moon_design 0.59.1 copy "moon_design: ^0.59.1" to clipboard
moon_design: ^0.59.1 copied to clipboard

Moon Design System for Flutter. A set of coherent, themable, and extensible widgets following the Moon Design System.

Moon Design System #

Version Build Conventional Commits

Moon Design System

Note: This project uses Release Please and Conventional Commits spec, please follow the conventions or consider using Commitizen to write commit messages.

Resources #

Applying theming and overrides #

  • Declare tokens variable and optionally override values:
final lightTokens = MoonTokens.light.copyWith(
  colors: MoonColors.light.copyWith(
    piccolo: Colors.blue,
    textPrimary: Colors.amber,
  ),
  typography: MoonTypography.typography.copyWith(
    heading: MoonTypography.typography.heading.apply(fontFamily: "DMSans"),
  ),
);

final lightTheme = ThemeData.light().copyWith(
    extensions: <ThemeExtension<dynamic>>[MoonTheme(tokens: lightTokens)],
  );
  • Or if needed override widget theming:
final lightTheme = ThemeData.light().copyWith(
  extensions: <ThemeExtension<dynamic>>[
    MoonTheme(tokens: lightTokens).copyWith(
      accordionTheme: MoonAccordionTheme(tokens: lightTokens).copyWith(
        colors: MoonAccordionTheme(tokens: lightTokens).colors.copyWith(
              backgroundColor: Colors.green,
            ),
      ),
    ),
  ],
);
  • Apply the declared theme:
return MaterialApp(
      title: 'Moon Design System example',
      theme: lightTheme,
      home: const HomePage(),
 );
29
likes
140
pub points
76%
popularity

Publisher

verified publisheryolo.com

Moon Design System for Flutter. A set of coherent, themable, and extensible widgets following the Moon Design System.

Homepage
Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (LICENSE)

Dependencies

flutter, moon_icons, moon_tokens

More

Packages that depend on moon_design