Buy Me A Coffee

Simplifying your widget tree structure by defining widgets using methods.


Thanks to the introduction of extension methods in Dart 2.7.0, styled_widget makes it possible to build widget tree`s more readable and efficient.

styled_widget is build as a tool to enhance your Flutter development experience and to seamlessly integrate with your codebase.

Basic example

styled_widget has a bottom up approach to building widget`s. This means you start with the inner most element and layer widget`s on top. The following example is structured as follows: Icon -> blue circle -> light blue circle -> card -> background

Icon(OMIcons.home, color: Colors.white)
  .padding(all: 10)
  .decorated(color: Color(0xff7AC1E7), shape:
  .padding(all: 15)
  .decorated(color: Color(0xffE8F2F7), shape:
  .padding(all: 20)
    elevation: 10,
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(20),

Raw Flutter (click to show)



See the documentation at styled_widget/wiki for more information about using styled_widget!