Color Palette generators¶
Use these color palette generators to create colors that are compatible with your Home Assistant Material 3 theme that matches the lightness and WCAG contrast guidelines to make your card stand out!
Accessible Palette Color System Generator¶
With the Accessible palette website, you can create Material Design color systems with consistent lightness and contrast. Nice for your custom colors to create matching pairs!
This is your go-to tool for creating lightness compatible colors to add to your Material 3 theme!
URL: https://accessiblepalette.com/
Color Designer to Create Tints and Shades¶
Color Designer is great for creating tints and shades, among a few other color combinations.
These tints and shades use the HSL (Hue, Saturation, Lightness) representation of the RGB color model. These are not fully accurate compared to the human perception of lightness. Use the previous one, the accessible palette generator for a better match!
URL: https://colordesigner.io/
Paletton Color Palette Generator¶
Paletton is one of the nice color palette generators around.
Material Design Palette Generator¶
Another one is the MCG generator. It is build on the Material Design color scheme, and can generate any swatch based on the central color.
URL: http://mcg.mbitson.com/#!?mcgpalette0=%233f51b5&mcgpalette1=%2326a69a
CIELab colors used for the Cx numbered Example Themes¶
(From the CIELab.io github page):
CIELab.io is a color tool based on human perception. CIELab.io lets you work with colors based on human perception, instead of based on how screens display them.
With CIELab.io, you can:
- Explore a selected set of color palettes from various brands and design systems, and see how they look in CIELab.
- Build your own color palette, visualize it in CIELab, and export it into code.
