History in Tweets
Over the years, a number of Tweet threads have been created to present new release of FlexColorScheme and Themes Playground. You can find them below. They are useful as a summary of new features and changes in releases. The tweet threads also serve as a history that shows how FlexColorScheme has evolved over time.
Some threads are not release related, but useful general theming guides. You can also use the last few threads as a feature update about what is new in the FlexColorScheme world. Reading them from start to finnish, they also work as a TLDR story for learning what you can do with FlexColorScheme and Themes Playground.
December 21, 2020
First humble release of FlexColorScheme 1.0.0. There is not even a tweet about it. It launched with 20 different built-in color schemes. There is a tweet for the version 1.1 released shortly after, on December 29, 2020. The tweet also shows the very modest version of example 5, that much later evolved into the Themes Playground.
January 4, 2021
The journey to add more color schemes started in version 1.2, by adding 4 new ones. Amber blue, Vesuvius burned, Deep purple and Ebony clay, taking the number of built-in schemes from 20 to 24.
Version 1.3 was released a few days later on January 7, 2021. It added more tests, made some internal improvements and marked
FlexSchemeSurfaceColors.themeSurface as deprecated in favor of the correctly named
FlexSchemeSurfaceColors.surfaceStyle. It was a silent fix without any tweet announcements.
January 18, 2021
Version 1.4 added a simper API for using built-in schemes, the still used
schemes property. It contained first experimental support for Android transparent system navigation bar. Added the reference table for built-in schemes. It also automated the test pipe using Codecov and hit 99% code test coverage.
January 4, 2021
This version should have been called 1.5.0, since it added new features in the form of 4 new themes. This time Barossa, Shark and orange, Big stone tulip and Damask and lunar. The number of color themes now grew from 24 to 28.
March 15, 2021
Version 2.0 was the step of going to sound-null safety and Dart 2.0. Test coverage also reached 99.78%. Feature wise it did not bring anything new, but it was a needed and significant chore update.
June 26, 2021
Version 3 was the first release with a real Tweet thread summary. It was also the first major release after the null-safety upgrade. The only breaking change was removing
accentColor, that was getting deprecated in Flutter SDK.
Version 3 also added four new built-in color themes, Bahama and trinidad, Mallard and valencia, Espresso and crema and Outer space stage, increasing the total number of color themes from 28 to 32. A minor new feature allowing swapping primary and secondary colors in a scheme with a quick setting, was also added.
November 14, 2021
In version 4, the feature to opt-in on using opinionated component theming was first introduced. It offered the first take on what is still available as a very opinionated optional style for Material-2. To make it look, and to a degree emulate coming Material-3 design. The release was a major step forward in features. It only had a few minor style breaking changes. APIs were actually unbroken, but the minor breakage in a few past theme styles and major new feature warranted and new major release bump.
Version 4 again adds four new color themes, Blue whale, San Juan blue, Rosewood red and Blumine, bring the total up from 32 to 36.
November 20, 2021
Version 4.1 release was when Example 5 in the tutorial, started to take off and evolve into the Themes Playground. It got its feature that enables it to generate API config code, that can be copied and used to re-use the configured theme in an app.
January 24, 2022
In version 4.2, support for Flutter 2.8 was added. The release required using minimum Flutter 2.8.0 and Dart 2.15. FlexColorScheme also received its Flutter Favorite status in conjunction with Flutter 2.8 release on December 9, 2021.
This release is also the one where it first became necessary to start limiting new FlexColorScheme releases' Flutter backwards compatibility to the latest release. This is simply due to constant additions and changes in theming properties offered and changed in the Flutter SDK. This phase is still going on today with new Material-3 features being added and ThemeData color properties constantly being deprecated.
Version 4.2 also added many new features, one of them being features that allow changing
ColorScheme color mappings on component theme level. It also added support for the first real Material-3 style component, the
April 21, 2022
This major release got four new built-in color theme, Flutter Dash , M3 baseline, Verdun green and Dell genoa green, bringing the number of themes from 36 to 40 matched light and dark pairs.
The release was also one of the biggest new feature additions made in a single major release. It also contained breaking style and API changes. All the built-in color schemes the themes used, were revised to follow the new Flutter 2.10.0 Material3 based
ColorScheme, that added many new color properties and deprecated some. Seed generated
ColorScheme, using more than one seed color and custom chroma config limits, were also introduced.
This version also included the launch of the documentation web-site that you are reading now.
The actual meat and info about version 5 was tweeted already a week before the launch, in the 5.0.0-dev1 release. This dev or beta release thread is also valid for the final 5.0.0 released features. It presents all the new features in detail, in a tweet thread with 24 slides.
Version 5 is also where the Themes Playground started getting its current form and many of the features it has today.
August 31, 2022
There is no Tweet thread about version 6.0. It is a very big release that came out during Flutter Vikings conference. Due to participation and speaking at the conference and releasing a big new version at the same time, there was no time to make a nice Tweet slide deck presentation. However, the above-linked talk from the conference presents the new Material-3 features it added support for. The release also requires minimum Flutter 3.3, that was released at the same time.
November 20, 2022
There is a Tweet presentation slide deck for version 6.1. Despite being only a minor release, it contains more new features for FlexColorScheme and the Themes Playground than version 6.0 did.
April 2, 2023
Version 7 is a very big release, requiring minimum Flutter 3.7 and containing massive updates to the Themes Playground, like a theme simulator to show the impact of selected themes on a few demo apps, including the official Flutter Material-3 demo app. It also includes many preconfigured component theming examples. They can be used as theming capability examples, or starting points for custom themes.
Flutter version 3.7 is also the first Flutter release where using Material-3 in a production Flutter app is recommended and endorsed by FlexColorScheme author.
In version 7, twelve new color themes were added. Now there is a total of 52 built-in color themes.
Version 7.0.1 was released four days later. No package changes, but it added several significant improvements to the Themes Playground user experience. It introduced a compacter UI more suitable on laptop screens and also made the user interface less chatty by hiding long explanations behind more info expands icons.
May 12, 2023
In version 7.1, FlexColorScheme adds support for Flutter 3.10 and Dart 3.0.
July 21, 2023
In version 7.2, FlexColorScheme and Themes Playground brings new features like:
- Visual density setting, with platform adaptive features.
- Platform adaptive splash ink effects, keep Android's default Material splash effects on Android, but use instant splash on other platforms.
- Platform adaptive theming of dialog border radius.
- Switch with fixed thumb size in Material-3 mode.
- Text selection theme customization.
- Two new cool ColorScheme seed generation strategies called Candy Pop and Chroma.
- Make any seed strategy use tone 100 (white) or tone 0 (black) as resulting surface and background tones.
August 16, 2023
Version 7.3 of FlexColorScheme adds support for Flutter 3.13, it even requires it, as it uses some new theming APIs not available in earlier versions of Flutter.
There are also a few useful general guides released as tweet threads, that you may find helpful.
April 24, 2022
Slightly after the version 5 release, a tweet slide deck with 15 slides was released. It is an extensive guide to how the new Material-3 ColorScheme and color system work in Material-3 and Flutter.
A Theme Story#
May 17, 2023
This tweet thread story was released after version 7.1. and uses short screen recordings for a fictive theming use-case story. It demonstrates advanced features in the current version of FlexColorScheme and Themes Playground. It shows how to use custom brand colors, with a seed generation algorithm that gives brighter generated colors than the default M3 algorithm. The example locks down the brand colors to the fixed given brand colors. It uses the brand colors as seeds for all other supporting colors, except for critical ColorScheme colors. They use the exact given brand color values.
It also demonstrates how to use the in version 7.0 introduced platform adaptive theming properties. They are used in this example to create a theme that automatically looks less Material-3 opinionated and more platform-agnostic on other platforms than Android, while still using Material-3 on Android, where it is desired in this example. All this styling is done on theme level. The design changes are automatic depending on what platform the app is built for and run on.
The impact of the adaptive theme changes can be simulated in Themes Playground by faking the used platform. The adaptive theme responses can then be observed in the mock apps in the built-in Theme Simulator.
June 26, 2023
This tweet thread uses screenshots to demonstrate how to make a platform-agnostic Material-3 based theme. Widget color mapping and border radius are customized to make a custom style suitable on Android, iOS and desktop as well web. This serves as an example of how to make custom branded theme using Material-3 design in Flutter by simple visual styling adjustments with the Themes Playground, to give us the theme definition to copy and use in FlexColorScheme in our Flutter app.
This example uses a blue color seed generated
ColorScheme, where the resulting scheme only uses different blue tones. The scheme is generated from a single seed color that is also used as the main "brand" color in light theme mode. This is also the only defined color to make this expressive blue theme, using multiple matching shades of blue in light and dark mode.
Some sneak peeks into work in progress. Using a different shape type for the corner radius, something else than current circular corners. Most notably "Squircle" shaped corners, which is used by Apple in iOS. The Squircle is often seen and used in many Figma designs as well. The squircle or super ellipses border radius is generally perceived as looking a bit softer and friendlier than the circular border radius.