Afterglow Violet Umbra
A cool palette of 6 colors drawing on black, purple, orange, with a wide lightness range, so it covers backgrounds, text and accents. Its lightest and darkest colors reach a contrast of 13.58:1, enough for body text.
About this palette
A cool palette of 6 colors drawing on black, purple, orange, with a wide lightness range, so it covers backgrounds, text and accents. Its lightest and darkest colors reach a contrast of 13.58:1, enough for body text. Open any color for its conversions, shades, harmonies and contrast.
Colors
- ≈ Corbeau#11101A
A very dark, neutral black (Corbeau) that brings serious elegance. White text sits comfortably on it.
- ≈ Deep Sea Base#2D284B
A dark, muted purple (Deep Sea Base) that brings imagination and polish. White text sits comfortably on it.
- ≈ Blueberry#4D4186
A dark, moderately saturated purple (Blueberry) that brings quiet luxury. White text sits comfortably on it.
- ≈ Galactic Gossamer#8D8DB3
A medium, muted blue (Galactic Gossamer) that brings open, airy calm. Dark text reads well on it.
- ≈ Icy Plains#DAD7FD
A very light, muted blue (Icy Plains) that brings quiet confidence. Dark text reads well on it.
- ≈ Arancio#EE700E
A light, vivid orange (Arancio) that brings a sunny, approachable mood. Dark text reads well on it.
Tags
Psychology
Meaning
Applications
Similar palettes
Dusty Lavender
Fig & Honey
Sapphire Saffron
Violet Amber
Neon Berry
Slate Harbor
Accessibility
- On white18.87:1Excellent 5/5
- On black15.11:1Excellent 5/5
- Color blind friendly98% similarExcellent 5/5
Contrast is the best any color in the palette reaches on a plain white or black background. Color blind friendly shows how much of the difference between the colors is kept under the common kinds of color blindness.
Colors and suggested roles
| Color | Role | HEX |
|---|---|---|
| Corbeau | Background | #11101A |
| Deep Sea Base | Surface | #2D284B |
| Blueberry | Primary | #4D4186 |
| Galactic Gossamer | Secondary | #8D8DB3 |
| Icy Plains | Light | #DAD7FD |
| Arancio | Accent | #EE700E |
CSS variables
:root {
--background: #11101A;
--surface: #2D284B;
--primary: #4D4186;
--secondary: #8D8DB3;
--light: #DAD7FD;
--accent: #EE700E;
}
Tailwind v4 (@theme)
@theme {
--color-background: #11101A;
--color-surface: #2D284B;
--color-primary: #4D4186;
--color-secondary: #8D8DB3;
--color-light: #DAD7FD;
--color-accent: #EE700E;
}