Named color · #6D4976
Hyssop
Hyssop is #6D4976: rgb(109 73 118), hsl(288 24% 37%), oklch(0.463 0.083 319.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Hyssop color name →
#6D4976
oklch(0.463 0.083 319.4)
Color conversions
- HEX
- #6d4976
- RGB
- rgb(109 73 118)
- HSL
- hsl(288 24% 37%)
- HWB
- hwb(288 29% 54%)
- OKLCH
- oklch(0.463 0.083 319.4)
- OKLab
- oklab(0.463 0.063 -0.054)
- CIE Lab
- lab(36.51 22.07 -19.65)
- LCH
- lch(36.51 29.55 318.3)
- CMYK
- cmyk(8% 38% 0% 54%)
Tints · Shades · Tones
Tints
- 7B5A83
- 896B90
- 977C9E
- A58EAB
- B4A0B9
- C3B3C7
- D2C5D5
- E1D8E3
- F0EBF1
Shades
- 5E3E66
- 4F3456
- 412A47
- 332038
- 261729
- 190E1C
- 0D060F
- 040205
- 010001
Tones
- 6F4F77
- 715478
- 735A7A
- 755F7B
- 77657C
- 796A7D
- 7B707E
- 7D757E
- 7E7B7F
Color harmonies
Complementary +180°
- 6D4976
Hyssop
- 3F6436
≈ Greenhouse
Analogous -30° +30°
Triadic +120° +240°
- 6D4976
Hyssop
- 715319
≈ Field Drab
- 00666A
≈ Joyful Tears
Split-complementary +150° +210°
- 6D4976
Hyssop
- 5C5C1F
≈ Gardener Green
- 196851
≈ Celtic Green
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAAOn white
WCAG 7.33:1 · APCA Lc 85
Ag
FailOn black
WCAG 2.86:1 · APCA Lc 17
Best text color: #FFFFFF
WCAG 7.33:1 (AAA) · APCA Lc 85
Contrast pairs
Code snippets
CSS
:root {
--hyssop: #6d4976;
--hyssop-rgb: 109 73 118;
--hyssop-oklch: oklch(0.463 0.083 319.4);
}
.element {
color: var(--hyssop);
background-color: hsl(288 24% 37%);
border-color: oklch(0.463 0.083 319.4);
}Tailwind CSS v4
@theme {
--color-hyssop: #6d4976;
--color-hyssop-50: #ffeeff;
--color-hyssop-100: #f5dff9;
--color-hyssop-200: #e5c9ea;
--color-hyssop-300: #ccaad1;
--color-hyssop-400: #b48fbe;
--color-hyssop-500: #9e74a9;
--color-hyssop-600: #86628f;
--color-hyssop-700: #6b4f72;
--color-hyssop-800: #4e3955;
--color-hyssop-900: #36273c;
--color-hyssop-950: #211525;
}SCSS
$hyssop: #6d4976;
$hyssop-rgb: 109, 73, 118;
$hyssop-light: mix(#fff, $hyssop, 20%);
$hyssop-dark: mix(#000, $hyssop, 20%);
.element {
color: $hyssop;
box-shadow: 0 0 0 2px rgba($hyssop, 0.35);
}