Scheme Reference
This table lists all current built-in color schemes in FlexColorScheme, the version it was released with, its enum value, short name and description. It shows a small thumbnail of each color scheme in light and dark theme mode. Clicking on a thumbnail opens a high-resolution version of the image.
The column Swap on M3 shows if a scheme will when the FlexScheme.light/dark and FlexThemeData.light/dark properties swapLegacyOnMaterial3 and useMaterial3 are set to true, swap its secondary, tertiary colors and their container colors. It is only defined to swap, if doing so makes a scheme originally designed for the Material-2 color system, a better fit for intended color design when using the Material-3 color system. If it doesn't improve the fit or if it is already a good fit, the colors aren't set to be swapped. The indicated swap only happens if you also set both swapLegacyOnMaterial3 and useMaterial3 to true. This optional swapping of secondary and tertiary colors, was introduced in FlexColorScheme version 6.1.0 to make color schemes originally designed for the Material-2 color system, a better fit when using Material-3 and its color system.
Color schemes released starting from version 5.0, were designed with the Material-3 color system in mind. They can even be native Material-3 schemes based on pre-seeded colors or slight variations of them. Color schemes used as examples in the Material-3 design guide, most prominently the one referred to as Material baseline, are also included.
Using seed generated color schemes, with the predefined schemes' defined light theme mode primary, secondary and tertiary colors as input, any predefined scheme can be made into a perfect fit for the Material-3 color system and its intended color design. It works even better if you don't use the secondary color as a key color when making seed generated color schemes. In many cases you can also include the secondary color, and still get a color scheme that fits the Material-3 color system's design intent.
FlexColorScheme can use the secondary color of a built-in scheme as a key color to seed generate secondary colors. The secondary color and its container are in the Material-3 color system used for less prominent components in the UI. In the color design it is typically a less chromatic version of the primary-color's hue, or a hue close to it. If the hue of a built-in scheme's secondary color, or your custom scheme's secondary color, differs significantly in hue from the primary color, then it may be preferred to not use the secondary color as a key color when seed generating a color scheme. If you for such cases exclude it, you will get a scheme with perfect Material-3 design fit. You will then not find the hue of the scheme's secondary color, in the resulting seed-generated effective color scheme. The more restricted seed generation offered by Flutter SDK's via e.g. ColorScheme.fromSeed, can only use one seed color. With it, you have no choice.
In the scheme reference table, the column Second Key indicates if it is preferred to exclude a scheme's secondary color when making a seed generated Material-3 color scheme from it. This applies if you want to get a scheme that fits the secondary color's design intent in the Material-3 color system. The recommendations below are based on that swapLegacyOnMaterial3 and useMaterial3 are also set to true. The recommendation meanings are:
- exclude, prefer not using the secondary color as a seed key with this scheme.
- borderline, the resulting color is a bit off from the M3 intent, but not too bad, if you flex a bit.
- may use, it is not exactly the same, but close enough to probably not matter.
- can use, this scheme works perfectly fine with using the secondary color as seed-key. The result will be almost the same even if it is not used as seed-key.
The tertiary colors don't have the same usage and design restrictions as the secondary colors in Material-3. With tertiary color, using it as a key color or using the default Material-3 color systems +60 degree hue rotation from primary color, is more of a color design choice. Either will work fine, they just give different resulting hues for the generated tertiary colors.
| Release | Swap on M3 | Second Key | FlexScheme | Scheme Name | Description | Light | Dark |
|---|---|---|---|---|---|---|---|
| 1.0.0 | Yes | exclude | material | Material default | Default Material-2 color theme, used in the design guide. |  |  |
| 1.0.0 | Yes | exclude | materialHc | Material high contrast | High contrast Material-2 design guide theme. |  |  |
| 1.0.0 | Yes | can use | blue | Blue delight | Blue color theme, based on Material blue and light blue colors. |  |  |
| 1.0.0 | No | borderline | indigo | Indigo nights | Indigo color theme, based on Material indigo and deep purple colors. |  |  |
| 1.0.0 | Yes | exclude | hippieBlue | Hippie blue | Hippie blue with surfie green and chock coral pink theme. |  |  |
| 1.0.0 | No | borderline | aquaBlue | Aqua blue | Aqua tropical ocean blue theme. |  |  |
| 1.0.0 | No | may use | brandBlue | Brand blues | A mixture of blue colors from well known web brands. |  |  |
| 1.0.0 | No | borderline | deepBlue | Deep blue sea | Dark deep blue sea color theme. |  |  |
| 1.0.0 | No | borderline | sakura | Pink sakura | Pink color theme, based on sakura cherry blossom like colors. |  |  |
| 1.0.0 | Yes | exclude | mandyRed | Oh Mandy red | Mandy red and Viking blue colored theme. |  |  |
| 1.0.0 | Yes | borderline | red | Red tornado | Red color theme, based on Material red and pink colors. |  |  |
| 1.0.0 | Yes | can use | redWine | Red red wine | Red color theme, based on red wine like colors. |  |  |
| 1.0.0 | Yes | borderline | purpleBrown | Purple brown | Purple brown tinted aubergine and eggplant colored theme. |  |  |
| 1.0.0 | Yes | exclude | green | Green forest | Green color theme, based on Material green and cyan colors. |  |  |
| 1.0.0 | Yes | exclude | money | Green money | Green money and finance style color theme. |  |  |
| 1.0.0 | Yes | can use | jungle | Green jungle | Green jungle and rain forest color theme. |  |  |
| 1.0.0 | Yes | exclude | greyLaw | Grey law | Material blue grey and ultra dark purple color theme. Colors suitable for law firms. |  |  |
| 1.0.0 | Yes | exclude | wasabi | Willow and wasabi | Wild Willow and wasabi green with orchid purple inspired colors. |  |  |
| 1.0.0 | Yes | can use | gold | Gold sunset | Gold sunset color theme, based on orange like colors. |  |  |
| 1.0.0 | Yes | exclude | mango | Mango mojito | Orange and green Mango mojito color theme. |  |  |
| 1.2.0 | No | exclude | amber | Amber blue | Amber blaze and blue color theme, based on Material amber and blue accent colors, a high-contrast theme. An alternative to the default Material high contrast theme. |  |  |
| 1.2.0 | No | exclude | vesuviusBurn | Vesuvius burned | Vesuvius burned orange and eden green theme. |  |  |
| 1.2.0 | Yes | exclude | deepPurple | Deep purple | Deep purple daisy bush theme, based on Material deepPurple and lightBlueAccent colors. |  |  |
| 1.2.0 | Yes | exclude | ebonyClay | Ebony clay | Ebony clay dark blue-grey and watercourse green colored theme. |  |  |
| 1.4.1 | No | exclude | barossa | Barossa | Barossa red and cardin green colored theme. A somber color set suited for courts and law firms. |  |  |
| 1.4.1 | Yes | exclude | shark | Shark and orange | Shark grey and orange ecstasy colored theme. |  |  |
| 1.4.1 | No | exclude | bigStone | Big stone tulip | Big stone blue and tulip tree yellow colored theme. |  |  |
| 1.4.1 | No | exclude | damask | Damask and lunar | Damask red and lunar green colored theme. |  |  |
| 3.0.0 | Yes | can use | bahamaBlue | Bahama and trinidad | Bahama blue and trinidad orange colored theme. |  |  |
| 3.0.0 | Yes | may use | mallardGreen | Mallard and valencia | Mallard green and Valencia pink colored theme. |  |  |
| 3.0.0 | Yes | exclude | espresso | Espresso and crema | Espresso dark brown and crema colored theme. |  |  |
| 3.0.0 | Yes | can use | outerSpace | Outer space stage | Outer space dark blue-grey and stage red theme. |  |  |
| 4.0.0 | Yes | exclude | blueWhale | Blue whale | Blue whale, jungle green and outrageous tango orange theme. |  |  |
| 4.0.0 | Yes | exclude | sanJuanBlue | San Juan blue | San Juan blue and pink salmon theme. |  |  |
| 4.0.0 | No | exclude | rosewood | Rosewood | Rosewood red, with horses neck and driftwood theme. |  |  |
| 4.0.0 | Yes | can use | blumineBlue | Blumine | Blumine, easter blue and saffron mango theme. |  |  |
| 5.0.0 | No | can use | flutterDash | Flutter Dash | Flutter Dash wallpaper based theme. |  |  |
| 5.0.0 | No | can use | materialBaseline | M3 baseline | Material guide 3 baseline based theme. |  |  |
| 5.0.0 | No | can use | verdunHemlock | Verdun green | Material guide 3 verdun and mineral green with hemlock. |  |  |
| 5.0.0 | No | can use | dellGenoa | Dell genoa green | Material guide 3 theme with dell, axolotl and genoa greens. |  |  |
| 7.0.0 | No | can use | redM3 | Thunderbird red | Thunderbird red based Material-3 theme. |  |  |
| 7.0.0 | No | can use | pinkM3 | Lipstick pink | Lipstick pink based Material-3 theme. |  |  |
| 7.0.0 | No | can use | purpleM3 | Eggplant purple | Eggplant purple based Material-3 theme. |  |  |
| 7.0.0 | No | can use | indigoM3 | Indigo San Marino | Indigo San Marino based Material-3 theme. |  |  |
| 7.0.0 | No | can use | blueM3 | Endeavour blue | Endeavour blue based Material-3 theme. |  |  |
| 7.0.0 | No | can use | cyanM3 | Mosque cyan | Mosque cyan based Material-3 theme. |  |  |
| 7.0.0 | No | can use | tealM3 | Blue stone teal | Blue stone teal based Material-3 theme. |  |  |
| 7.0.0 | No | can use | greenM3 | Camarone green | Camarone green based Material-3 theme. |  |  |
| 7.0.0 | No | can use | limeM3 | Verdun lime | Verdun lime based Material-3 theme. |  |  |
| 7.0.0 | No | can use | yellowM3 | Yukon gold yellow | Yukon gold yellow based Material-3 theme. |  |  |
| 7.0.0 | No | can use | orangeM3 | Brown orange | Brown orange based Material-3 theme. |  |  |
| 7.0.0 | No | can use | deepOrangeM3 | Rust deep orange | Rust deep orange based Material-3 theme. |  |  |