Benannte Farbe · #8E473B
Chocolate Explosion
Chocolate Explosion ist #8E473B: rgb(142 71 59), hsl(9 41% 39%), oklch(0.484 0.099 31). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Chocolate Explosion color name →
#8E473B
oklch(0.484 0.099 31)
Farbumrechnungen
- HEX
- #8e473b
- RGB
- rgb(142 71 59)
- HSL
- hsl(9 41% 39%)
- HWB
- hwb(9 23% 44%)
- OKLCH
- oklch(0.484 0.099 31)
- OKLab
- oklab(0.484 0.085 0.051)
- CIE Lab
- lab(39.24 29.88 21.65)
- LCH
- lch(39.24 36.9 35.9)
- CMYK
- cmyk(0% 50% 58% 44%)
Tints · Shades · Tones
Tints
- 9A594D
- A66A5F
- B27C72
- BD8E85
- C9A099
- D4B3AC
- DFC6C1
- EAD8D5
- F4ECEA
Shades
- 7B3D32
- 683229
- 562821
- 441F19
- 341611
- 240D09
- 150604
- 070201
- 010000
Tones
- 8E4D42
- 8D5349
- 8C5950
- 8B5F57
- 8A655E
- 886A65
- 87706B
- 857572
- 827B79
Farbharmonien
Komplementär +180°
- 8E473B
Chocolate Explosion
- 006B79
≈ Mary Blue
Analog -30° +30°
- 8E473B
Chocolate Explosion
- 8B455B
≈ Redcurrant
- 865019
≈ Plane Brown
Triadisch +120° +240°
- 8E473B
Chocolate Explosion
- 2D6E41
≈ Billiard Ball
- 4A5A96
≈ Blue Dude
Geteilt komplementär +150° +210°
- 8E473B
Chocolate Explosion
- 006E61
≈ Forest Splendour
- 1D6591
≈ Traditional Blue
Tetradisch +90° +180° +270°
- 8E473B
Chocolate Explosion
- 57671E
≈ Forestial Outpost
- 006B79
≈ Mary Blue
- 68508D
≈ Zimidar
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 6.74:1 · APCA Lc 83
Ag
FailAuf Schwarz
WCAG 3.11:1 · APCA Lc 19
Beste Textfarbe: #FFFFFF
WCAG 6.74:1 (AA) · APCA Lc 83
Contrast pairs
Code-Snippets
CSS
:root {
--chocolate-explosion: #8e473b;
--chocolate-explosion-rgb: 142 71 59;
--chocolate-explosion-oklch: oklch(0.484 0.099 31);
}
.element {
color: var(--chocolate-explosion);
background-color: hsl(9 41% 39%);
border-color: oklch(0.484 0.099 31);
}Tailwind CSS v4
@theme {
--color-chocolate-explosion: #8e473b;
--color-chocolate-explosion-50: #ffece3;
--color-chocolate-explosion-100: #ffddd3;
--color-chocolate-explosion-200: #fcc6b9;
--color-chocolate-explosion-300: #e5a597;
--color-chocolate-explosion-400: #d2887b;
--color-chocolate-explosion-500: #bf6c5d;
--color-chocolate-explosion-600: #a15c4f;
--color-chocolate-explosion-700: #81493f;
--color-chocolate-explosion-800: #60342e;
--color-chocolate-explosion-900: #43241f;
--color-chocolate-explosion-950: #2b120f;
}SCSS
$chocolate-explosion: #8e473b;
$chocolate-explosion-rgb: 142, 71, 59;
$chocolate-explosion-light: mix(#fff, $chocolate-explosion, 20%);
$chocolate-explosion-dark: mix(#000, $chocolate-explosion, 20%);
.element {
color: $chocolate-explosion;
box-shadow: 0 0 0 2px rgba($chocolate-explosion, 0.35);
}