Dichtstbijzijnde benoemde kleur · #876C9A
#876C9A
Dichtstbijzijnde benoemde kleur: Purple Haze
#876C9A (rgb(135 108 154), hsl(275 19% 51%), oklch(0.575 0.076 310.8)) komt het dichtst bij de benoemde kleur Purple Haze. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#876C9A
oklch(0.575 0.076 310.8)
Kleurconversies
- HEX
- #876c9a
- RGB
- rgb(135 108 154)
- HSL
- hsl(275 19% 51%)
- HWB
- hwb(275 42% 40%)
- OKLCH
- oklch(0.575 0.076 310.8)
- OKLab
- oklab(0.575 0.049 -0.057)
- CIE Lab
- lab(49.62 17.82 -20.96)
- LCH
- lch(49.62 27.51 310.4)
- CMYK
- cmyk(12% 30% 0% 40%)
Tinten · Schaduwen · Tonen
Tinten
- 927AA4
- 9E88AE
- AA96B8
- B5A5C2
- C1B3CC
- CEC2D6
- DAD1E0
- E6E0EB
- F2F0F5
Schaduwen
- 755D85
- 634E71
- 51405E
- 41324B
- 312539
- 211927
- 130D17
- 060409
- 010001
Tonen
- 866E98
- 867095
- 857293
- 847490
- 84768D
- 83788B
- 827A88
- 817C86
- 817E83
Kleurharmonieën
Complementair +180°
- 876C9A
Purple Haze
- 698252
≈ Happy Camper
Analoog -30° +30°
- 876C9A
Purple Haze
- 7074A5
≈ Hyacinth Mauve
- 976786
≈ Rust Magenta
Triadisch +120° +240°
- 876C9A
Purple Haze
- 957145
≈ Tavern Creek
- 3A8783
≈ Copper Turquoise
Gesplitst complementair +150° +210°
- 876C9A
Purple Haze
- 827A43
≈ Tribal
- 4E876A
≈ Saltwater Depth
Tetradisch +90° +180° +270°
- 876C9A
Purple Haze
- 9F6956
≈ J’s Big Heart
- 698252
≈ Happy Camper
- 3F8398
≈ Dirty Blue
Contrast en toegankelijkheid
Ag
AAOp wit
WCAG 4.52:1 · APCA Lc 71
Ag
AAOp zwart
WCAG 4.64:1 · APCA Lc 30
Beste tekstkleur: #000000
WCAG 4.64:1 (AA) · APCA Lc 30
Contrast pairs
Codefragmenten
CSS
:root {
--purple-haze: #876c9a;
--purple-haze-rgb: 135 108 154;
--purple-haze-oklch: oklch(0.575 0.076 310.8);
}
.element {
color: var(--purple-haze);
background-color: hsl(275 19% 51%);
border-color: oklch(0.575 0.076 310.8);
}Tailwind CSS v4
@theme {
--color-purple-haze: #876c9a;
--color-purple-haze-50: #fdefff;
--color-purple-haze-100: #f1e1fa;
--color-purple-haze-200: #e0cbec;
--color-purple-haze-300: #c5add4;
--color-purple-haze-400: #ad92c0;
--color-purple-haze-500: #9678ab;
--color-purple-haze-600: #7f6691;
--color-purple-haze-700: #665174;
--color-purple-haze-800: #4a3b56;
--color-purple-haze-900: #33293c;
--color-purple-haze-950: #1f1626;
}SCSS
$purple-haze: #876c9a;
$purple-haze-rgb: 135, 108, 154;
$purple-haze-light: mix(#fff, $purple-haze, 20%);
$purple-haze-dark: mix(#000, $purple-haze, 20%);
.element {
color: $purple-haze;
box-shadow: 0 0 0 2px rgba($purple-haze, 0.35);
}