Why Wind?
Do you like using Tailwind CSS to style your UIs? This helps you do that in Flutter. Wind is not a widget library. It is a utility-first styling engine that maps Tailwind-syntax className strings to optimized Flutter widget trees, with a 24-field theme, 20 parsers, 27 W-prefix widgets, and the WindRecipe / WindSlotRecipe variant-composition primitives. Flutter's structural styling produces six-widget pyramids for a rounded card with a hover state. The Flutter team itself acknowledged the verbosity pain, ran an experimental Decorators feature, found mixed results, and shelved it. Wind closes that gap.
Features
- 🤖 AI-first
- 🎨 Tailwind syntax, natively
- 🧩 27 W-prefix widgets
- 🎭 Customizable theme
- 🎨 WindRecipe / WindSlotRecipe
- 📱 Responsive prefixes - sm:, md:, lg:, xl:, 2xl: breakpoints, plus custom breakpoints via the theme.
- 🌙 First-class dark mode - dark: prefix with runtime toggle and automatic system-brightness sync. Every color token carries its dark: pair in the same className.
- 🎯 State prefixes - hover:, focus:, disabled:, loading:, selected:, and any custom state. Zero MouseRegion, zero setState, zero _isHovered booleans.
- 🔌 Platform prefixes - ios:, android:, web:, mobile: for conditional styling without a single if. Works on all 6 Flutter platforms.
- 📡 Server-driven UI - WDynamic renders widget trees from JSON. Ship UI updates without ship-blocking releases. Whitelisted 13 Wind widgets + 16 Flutter core widgets.
“Requires Flutter >= 3.27.0 and Dart >= 3.4.0. Stable since 1.0. Open Source. Tailwind syntax. Flutter native.”
Important