Named color · #4D4469
Evening Lavender
Evening Lavender is #4D4469: rgb(77 68 105), hsl(255 21% 34%), oklch(0.412 0.062 294.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Evening Lavender color name →
#4D4469
oklch(0.412 0.062 294.7)
Color conversions
- HEX
- #4d4469
- RGB
- rgb(77 68 105)
- HSL
- hsl(255 21% 34%)
- HWB
- hwb(255 27% 59%)
- OKLCH
- oklch(0.412 0.062 294.7)
- OKLab
- oklab(0.412 0.026 -0.056)
- CIE Lab
- lab(31 10.69 -20.36)
- LCH
- lch(31 23 297.7)
- CMYK
- cmyk(27% 35% 0% 59%)
Tints · Shades · Tones
Tints
- 5D5577
- 6D6686
- 7E7894
- 8F8AA3
- A19DB2
- B3B0C1
- C6C3D0
- D8D7E0
- ECEBEF
Shades
- 423A5A
- 37304C
- 2C263E
- 221D31
- 181424
- 0F0C18
- 07050C
- 020204
- 000000
Tones
- 524A6C
- 57506E
- 5C5670
- 615C73
- 666275
- 6B6877
- 706E7A
- 75747C
- 7B7A7E
Color harmonies
Complementary +180°
- 4D4469
Evening Lavender
- 4A4F26
≈ Bronze Tone
Analogous -30° +30°
- 4D4469
Evening Lavender
- 3A4A6D
≈ Jazz Age Blues
- 5C3F5D
≈ Navy Cosmos
Triadic +120° +240°
- 4D4469
Evening Lavender
- 654129
≈ Van Dyke Brown
- 1F5649
≈ Bagpiper
Split-complementary +150° +210°
- 4D4469
Evening Lavender
- 5A4820
≈ Nightingale
- 355435
≈ Goblin
Tetradic +90° +180° +270°
- 4D4469
Evening Lavender
- 683D3A
≈ Chipotle Paste
- 4A4F26
≈ Bronze Tone
- 16545B
≈ Seaworld
Contrast & accessibility
Ag
AAAOn white
WCAG 8.94:1 · APCA Lc 90
Ag
FailOn black
WCAG 2.34:1 · APCA Lc 12
Best text color: #FFFFFF
WCAG 8.94:1 (AAA) · APCA Lc 90
Contrast pairs
Code snippets
CSS
:root {
--evening-lavender: #4d4469;
--evening-lavender-rgb: 77 68 105;
--evening-lavender-oklch: oklch(0.412 0.062 294.7);
}
.element {
color: var(--evening-lavender);
background-color: hsl(255 21% 34%);
border-color: oklch(0.412 0.062 294.7);
}Tailwind CSS v4
@theme {
--color-evening-lavender: #4d4469;
--color-evening-lavender-50: #f6f2ff;
--color-evening-lavender-100: #e9e4fb;
--color-evening-lavender-200: #d6cfec;
--color-evening-lavender-300: #bab1d4;
--color-evening-lavender-400: #a098c0;
--color-evening-lavender-500: #897eab;
--color-evening-lavender-600: #746b91;
--color-evening-lavender-700: #5c5674;
--color-evening-lavender-800: #433f56;
--color-evening-lavender-900: #2e2b3c;
--color-evening-lavender-950: #1b1826;
}SCSS
$evening-lavender: #4d4469;
$evening-lavender-rgb: 77, 68, 105;
$evening-lavender-light: mix(#fff, $evening-lavender, 20%);
$evening-lavender-dark: mix(#000, $evening-lavender, 20%);
.element {
color: $evening-lavender;
box-shadow: 0 0 0 2px rgba($evening-lavender, 0.35);
}