A flutter package that offers pre-built UI components to build your UI faster. This package is part of the flutter_fit_utils environement.

flutter_fit_utils drawio


A flutter package that offers a wide variety of UI tools to make your apps faster, and more efficiently. There are 15+ prebuilt widgets available to use in just a few lines of code.

Available widgets:

  • FitText: Create headlines, titles, body text and hints with a single line of code.
  • FitLoadingIndicator: Auto aligned circular loading indicator that will always fit with your app theme.
  • FitTextIcon: Pair an icon with a text and vice-versa easily.
  • FitLoadingHandler: Use this to block input and show that your widget is loading.
  • FitDiaporama: Customizable diaporama that accept any type of image.
  • FitImageCard: A card with a background image. The card's text will always be readable, no matter what image you use.
  • FitButton: Buttons made easy, without the need to repeat code everywhere.
  • FitTextInput: A nice wrapper for TextFormField.
  • FitChips: Chips that you can use as radio buttons.
  • FitRadioCards: Beautiful cards that you can use as radio buttons.
  • FitSwipeable: Make any widget swipeable easily, with not much code.
  • FitSettings: Create settings page easily.

  • FitForm: Create forms with less code.

  • FitMenu: Create beautiful drawer menus easily.

  • FitSort: Sort a collection with prebuilt and customizable sort algorithms.

  • FitRuleValidator: Visualize how many steps/rule have been completed/respected.

  • FitDialog: Easily show dialogs with FitDialog.show().

Getting started

  • Go inside your pubspec.yaml file
  • Add this line under the dependencies:
flutter_fit_utils_ui: ^1.2.6
  • Get dependencies
flutter pub get


The FitTheme Widget

To have more control over the fit widgets, you can start be wrapping a dart FitTheme around your widget tree. This class lets you change:

  • The base text style for all FitTexts
  • The size of loading indicators
  • The theme data of FitTextIcons
  • The loading behavior of FitLoadingHandlers
  • The basic page margin
  • The base radius

These properties are all used by the different widgets offered by this package.

Other Widgets

All widgets are simple to use, and only need a few lines of code to use theme. For example, this is how a FitText is called:

FitText.headline("Your Headline Here")

To learn more about the other widgets available, please checkout the example/main.dart file. This example covers all the available widgets.

Additional information

Feel free to give any feedback ! This package is also open to contributions.