Features Overview

Key Flutterwind capabilities across styling, variants, and runtime tools.

Core capabilities

  • Utility-first styling with .className('...')
  • Responsive breakpoints (sm, md, lg, xl, 2xl)
  • Runtime variants (dark:, light:, hover:, focus:, active:)
  • Layout utilities (flex/grid, alignment, spacing, sizing)
  • Typography utilities (size, weight, transform, decoration)
  • Effects and transforms (shadow, blur, brightness, scale, rotate, translate)

Advanced capabilities

  • Accessibility helpers like sr-only, focusable, and focus-order utilities
  • Performance-focused utilities like lazy-load, cache, and memory optimization flags
  • Preset tokens (btn, card, card-header, card-body) and plugin extensibility
  • App-level light/dark theme integration via FlutterWind(theme, darkTheme, themeMode)
  • Built-in developer overlay via FlutterWind(showDevTools: true)

See also:

  • /getting-started/theming
  • /getting-started/developer-tools

Notes on support

Flutterwind is a Flutter runtime system, so not every CSS-only Tailwind feature maps 1:1.
Check the Reference section for current support and constraints:

  • /reference/tailwind-v4-runtime-parity
  • /reference/generated-support-matrix