Named color · #816D5A
Kaffee
Kaffee is #816D5A: rgb(129 109 90), hsl(29 18% 43%), oklch(0.549 0.038 65.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Brown mean? → · Kaffee color name →
#816D5A
oklch(0.549 0.038 65.4)
Color conversions
- HEX
- #816d5a
- RGB
- rgb(129 109 90)
- HSL
- hsl(29 18% 43%)
- HWB
- hwb(29 35% 49%)
- OKLCH
- oklch(0.549 0.038 65.4)
- OKLab
- oklab(0.549 0.016 0.035)
- CIE Lab
- lab(47.58 5.89 13.74)
- LCH
- lch(47.58 14.95 66.8)
- CMYK
- cmyk(0% 16% 30% 49%)
Tints · Shades · Tones
Tints
- 8D7B69
- 998879
- A59789
- B2A599
- BEB3A9
- CBC2BA
- D8D1CB
- E5E0DC
- F2F0ED
Shades
- 6F5E4D
- 5E4F41
- 4E4135
- 3E3329
- 2E261E
- 1F1913
- 120D09
- 060403
- 010100
Tones
- 816F5E
- 817162
- 817366
- 817569
- 81776D
- 817871
- 817A75
- 807C78
- 807E7C
Color harmonies
Complementary +180°
- 816D5A
Kaffee
- 5F7486
≈ Lost Atlantis
Analogous -30° +30°
- 816D5A
Kaffee
- 866A62
≈ Nut Brown
- 787158
≈ Pine Peak
Triadic +120° +240°
- 816D5A
Kaffee
- 587974
≈ Breaker Bay
- 766C83
≈ Fujinezumi
Split-complementary +150° +210°
- 816D5A
Kaffee
- 58777F
≈ Hampton Surf
- 6A7088
≈ Deep Larkspur
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAOn white
WCAG 4.91:1 · APCA Lc 74
Ag
FailOn black
WCAG 4.26:1 · APCA Lc 28
Best text color: #FFFFFF
WCAG 4.91:1 (AA) · APCA Lc 74
Contrast pairs
Code snippets
CSS
:root {
--kaffee: #816d5a;
--kaffee-rgb: 129 109 90;
--kaffee-oklch: oklch(0.549 0.038 65.4);
}
.element {
color: var(--kaffee);
background-color: hsl(29 18% 43%);
border-color: oklch(0.549 0.038 65.4);
}Tailwind CSS v4
@theme {
--color-kaffee: #816d5a;
--color-kaffee-50: #fdf3ea;
--color-kaffee-100: #f1e6db;
--color-kaffee-200: #e0d2c3;
--color-kaffee-300: #c5b4a3;
--color-kaffee-400: #af9a87;
--color-kaffee-500: #98816c;
--color-kaffee-600: #816e5c;
--color-kaffee-700: #675849;
--color-kaffee-800: #4c4035;
--color-kaffee-900: #352c24;
--color-kaffee-950: #201913;
}SCSS
$kaffee: #816d5a;
$kaffee-rgb: 129, 109, 90;
$kaffee-light: mix(#fff, $kaffee, 20%);
$kaffee-dark: mix(#000, $kaffee, 20%);
.element {
color: $kaffee;
box-shadow: 0 0 0 2px rgba($kaffee, 0.35);
}