Named color · #714F29
Chocolate Rain
Chocolate Rain is #714F29: rgb(113 79 41), hsl(32 47% 30%), oklch(0.456 0.07 67.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Brown mean? → · Chocolate Rain color name →
#714F29
oklch(0.456 0.07 67.5)
Color conversions
- HEX
- #714f29
- RGB
- rgb(113 79 41)
- HSL
- hsl(32 47% 30%)
- HWB
- hwb(32 16% 56%)
- OKLCH
- oklch(0.456 0.07 67.5)
- OKLab
- oklab(0.456 0.027 0.065)
- CIE Lab
- lab(36.77 11.53 28.03)
- LCH
- lch(36.77 30.31 67.6)
- CMYK
- cmyk(0% 30% 64% 56%)
Tints · Shades · Tones
Tints
- 7F5F3E
- 8C7052
- 9A8166
- A8927B
- B7A390
- C5B5A6
- D3C7BB
- E2DAD2
- F0ECE8
Shades
- 614422
- 52381C
- 432E15
- 35230F
- 271909
- 1A1005
- 0E0702
- 040201
- 010000
Tones
- 735433
- 75593C
- 765E45
- 78634D
- 796856
- 7B6D5E
- 7C7167
- 7E766F
- 7F7B78
Color harmonies
Complementary +180°
- 714F29
Chocolate Rain
- 355A7C
≈ Dark Blue
Analogous -30° +30°
- 714F29
Chocolate Rain
- 79493A
≈ Egyptian Jasper
- 625725
≈ Tucumán Green
Triadic +120° +240°
- 714F29
Chocolate Rain
- 1A635E
≈ Abduction
- 624C75
≈ Imperial Palace
Split-complementary +150° +210°
- 714F29
Chocolate Rain
- 1D6071
≈ Excellence
- 4D537E
≈ Dusk
Tetradic +90° +180° +270°
- 714F29
Chocolate Rain
- 326347
≈ Black Pine Green
- 355A7C
≈ Dark Blue
- 704765
≈ Wizard Time
Contrast & accessibility
Ag
AAAOn white
WCAG 7.36:1 · APCA Lc 85
Ag
FailOn black
WCAG 2.85:1 · APCA Lc 17
Best text color: #FFFFFF
WCAG 7.36:1 (AAA) · APCA Lc 85
Contrast pairs
Code snippets
CSS
:root {
--chocolate-rain: #714f29;
--chocolate-rain-rgb: 113 79 41;
--chocolate-rain-oklch: oklch(0.456 0.07 67.5);
}
.element {
color: var(--chocolate-rain);
background-color: hsl(32 47% 30%);
border-color: oklch(0.456 0.07 67.5);
}Tailwind CSS v4
@theme {
--color-chocolate-rain: #714f29;
--color-chocolate-rain-50: #fff2e0;
--color-chocolate-rain-100: #f8e4cf;
--color-chocolate-rain-200: #e8d0b5;
--color-chocolate-rain-300: #cfb291;
--color-chocolate-rain-400: #bb9772;
--color-chocolate-rain-500: #a67d52;
--color-chocolate-rain-600: #8c6a46;
--color-chocolate-rain-700: #705538;
--color-chocolate-rain-800: #533d28;
--color-chocolate-rain-900: #3a2a1b;
--color-chocolate-rain-950: #24180b;
}SCSS
$chocolate-rain: #714f29;
$chocolate-rain-rgb: 113, 79, 41;
$chocolate-rain-light: mix(#fff, $chocolate-rain, 20%);
$chocolate-rain-dark: mix(#000, $chocolate-rain, 20%);
.element {
color: $chocolate-rain;
box-shadow: 0 0 0 2px rgba($chocolate-rain, 0.35);
}