What is new?

This what is new chapter covers the last two major releases. Older what's new chapters are purged as new ones are added.

Documentation

This documentation site and its content is very new. It will be continuously improved, concerning spelling, grammar, style and content.

New in Version 5

FlexColorScheme Version 5 is a large upgrade from version 4, with deprecation of previous variant based color names in favor of container ones that were added to updated Material 3 based ColorScheme in Flutter 2.10.0. The same additions and changes are now also introduced in FlexColorScheme. Despite being a big release, with many new features, actual breaking changes are very few and mostly concern in version 4 already deprecated members, and of course requiring minimum Flutter 2.10.0 to work.

Version 5 has many new advanced coloring features and fully supports Material 3 based color schemes, including seed key color generated color schemes. With more configuration options to generate the ColorScheme from key colors, compared to what is currently available in Flutter SDK. Version 5 also comes with many more convenient component sub-theming options compared to previous versions.

The open source companion app, the Themes Playground has been completely revised. It now has two view modes, the previous large masonry grid and also a convenient topic based page view. In the new version you can also see the generated theme setup code as you change your theming settings.

This is a breaking release, with many new Material 3 ColorScheme features. See change log for detailed change information. Generated API docs are available and up to date with version 5.

The example apps have all also been updated. New live web builds of them are available here 1. Basic Theme, 2. Custom Theme, 3. Four Themes, 4. All Themes and 5. Themes Playground.

Version 5 of the Themes Playground application demonstrates all the new features, including using Material 3 key color based seeded color schemes. The playground has its own usage guide chapter. The updated Copy Playground Theme template, can be used to quickly test themes using copy-pasted setup code from the Themes Playground.

The default example, the Hot Reload Playground has also been updated. Its comments contain extensive documentation that serve as a getting started guide as well.

For a guided tour of what is new, check out this Tweet and its thread, where Flutter Dash explains all the new features in a dashing slide series.

The slide series is using the Themes Playground app from the 5.0.0-dev.1 release. The current version of the app is a lot fancier, but all the FlexColorScheme V5 features and principles are the same as in the above tweet.

New V5 Themes

There are of course new built-in color schemes in version 5. Four of them is by now the de-facto standard for major new releases. The new color schemes are:

  • Flutter Dash - A blue Flutter Dash wallpaper based Material 3 theme.
  • M3 baseline - Material guide 3 baseline based theme.
  • Verdun green - Verdun and mineral green with hemlock based Material 3 theme.
  • Dell genoa green - A Material 3 theme with dell, axolotl and genoa greens.
 Flutter Dash    M3 Baseline    Verdun Green    Dell Genoa Green
Dash light   M3 baseline   Verdun green   Dell genoa
Dash light   M3 baseline   Verdun green   Dell genoa
New FlexColorScheme themes in version 5

New in Version 4

There are two major new features. The first one is that FlexColorScheme now comes with opinionated widget sub themes that you can opt-in on. By default, these Flutter UI component widget sub-themes follow the Material 3 guide. This is done as far as reasonably possible while still using standard Material 2 theming features available in Flutter 2.8. There is a Material 3 style TextTheme as well, and by default this text theme is also slightly color tinted using the color scheme's primary color. You can turn these styles on and off, based on your your own preferences when you opt in on the sub themes.

The second main new feature is that FlexColorScheme now offers 9 different surface color blend modes, with 40 different blend levels each. Version 3 only had one "blend style" with 5 levels, including the no blend option. The version 3 blend style API is still available and works, but is deprecated since version 4.2.0. Despite the major version bump from 3 to 4, all APIs from version 3 are fully compatible with version 4. The version was mostly bumped because it contains so many new features that it made sense.

There are of course new built-in color schemes. Four of them seems to be the standard for major new releases. The new color schemes are:

  • Blue whale - Blue whale, jungle green and outrageous tango orange
  • San Juan - San Juan blue and pink salmon theme
  • Rosewood - Rosewood red, with horses neck and driftwood theme
  • Blumine - Blumine, easter blue and saffron mango theme

Total number of offered built-in color schemes is now 36 matched light and dark pairs. By using the swap primary and secondary colors, you can double the amount of variations with just a boolean toggle. Not all the color schemes are so attractive when you swap the colors, but some were designed to support it and look well with the colors reversed too. You can for example use this to present the dark mode with primary and secondary colors swapped compared to the light mode.

You can check out this Tweet and its thread for a visual presentation of FlexColorScheme's features.