I'm building a set of beautiful, native Flutter UI widgets

What's up Hackers,

I'm currently developing a set of beautiful, hand-crafted, native Flutter UI components. Many of you probably know Tailwind UI, a set of UI components for Tailwind CSS, which I bought by the time it came out and have been in love with ever since. I'm building something similar for Flutter!

The idea is to have a comprehensive set of beautifully designed widgets, which you can copy & paste into your projects and adapt as necessary to bootstrap ideas quickly. I'd like to divide the widgets into two types.

Type 1: Primitive widgets to use individually (Buttons, Badges, ...)
Type 2: Pre-built views that make use of said widgets (Login, Home, ...)

Widgets I have built so far:

Type 1

• Buttons
• Inputs
• Dropdowns
• Badges
• Cards
• Alerts
• Modals
• Navbars
• Drawers

Type 2

• Login
• Empty state
• Home

Here's an example of the first button in the first attached screenshot.

return FlatButton(
  disabledColor: Colors.grey[400],
  disabledTextColor: Colors.white,
  padding: EdgeInsets.fromLTRB(16, 12, 16, 12),
  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(4)),
  color: Colors.indigo,
  child: Text('New project', style: TextStyle(color: Colors.white)),
  onPressed: () {},
);

Here's an example of the first alert in the second attached screenshot:

return Container(
  width: double.infinity,
  padding: EdgeInsets.all(16),
  decoration: BoxDecoration(
    gradient: LinearGradient(
        stops: [0.01, 0.01], colors: [Colors.red[900], Colors.red[100]]),
  ),
  child: Column(
  crossAxisAlignment: CrossAxisAlignment.start,
  children: <Widget>[
    Text('Whoa, that didn\'t work',
        style: TextStyle(
            color: Colors.red[800], fontWeight: FontWeight.w500),
        overflow: TextOverflow.clip),
    Padding(
        padding: EdgeInsets.only(top: 4),
        child: Text(
            'Your request can currently not be processed. Please try again in a few moments.',
            style: TextStyle(color: Colors.red[700]),
            overflow: TextOverflow.clip))
  ],
));

I also added a screenshot of a home screen view I built. I already mentioned that I love Tailwind UI, which I frequently use for three main reasons.

• Saving time by copying and pasting pre-built components
• Get inspiration from pre-built components and partially extract concepts
• Learning how to get things done

Since I see the same potential for Flutter, I would like to build something similar.

If you like the idea (and would pay for something like this), please reach out to me at [email protected]. I would love to hear from you.

Any feedback is greatly appreciated. Thanks!