Named color · #362D26
Coffee Bean
Coffee Bean is #362D26: rgb(54 45 38), hsl(26 17% 18%), oklch(0.305 0.018 59.9). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Coffee Bean color name →
#362D26
oklch(0.305 0.018 59.9)
Color conversions
- HEX
- #362d26
- RGB
- rgb(54 45 38)
- HSL
- hsl(26 17% 18%)
- HWB
- hwb(26 15% 79%)
- OKLCH
- oklch(0.305 0.018 59.9)
- OKLab
- oklab(0.305 0.009 0.016)
- CIE Lab
- lab(19.31 3.25 6.15)
- LCH
- lch(19.31 6.95 62.2)
- CMYK
- cmyk(0% 17% 30% 79%)
Tints · Shades · Tones
Tints
- 483F38
- 5A524C
- 6D6560
- 807A75
- 948F8A
- A9A4A1
- BEBAB8
- D3D1CF
- E9E8E7
Shades
- 2E2620
- 251F19
- 1E1813
- 16110D
- 0F0B08
- 080604
- 030202
- 010101
- 000000
Tones
- 3D352E
- 443C37
- 4B443F
- 524D48
- 5A5551
- 615D5A
- 696663
- 706E6D
- 787776
Color harmonies
Complementary +180°
- 362D26
Coffee Bean
- 273037
≈ Chimney Sweep
Analogous -30° +30°
- 362D26
Coffee Bean
- 382C2A
≈ Mole
- 322F25
≈ Night Green
Triadic +120° +240°
- 362D26
Coffee Bean
- 25322F
≈ Concealed Green
- 302D37
≈ Stretch Limo
Split-complementary +150° +210°
- 362D26
Coffee Bean
- 253234
≈ Navy Black
- 2B2F38
≈ Suit Blue
Tetradic +90° +180° +270°
- 362D26
Coffee Bean
- 29322A
≈ Gordons Green
- 273037
≈ Chimney Sweep
- 342C33
≈ Mystical Shadow
Contrast & accessibility
Ag
AAAOn white
WCAG 13.45:1 · APCA Lc 100
Ag
FailOn black
WCAG 1.56:1 · APCA Lc 0
Best text color: #FFFFFF
WCAG 13.45:1 (AAA) · APCA Lc 100
Contrast pairs
Code snippets
CSS
:root {
--coffee-bean: #362d26;
--coffee-bean-rgb: 54 45 38;
--coffee-bean-oklch: oklch(0.305 0.018 59.9);
}
.element {
color: var(--coffee-bean);
background-color: hsl(26 17% 18%);
border-color: oklch(0.305 0.018 59.9);
}Tailwind CSS v4
@theme {
--color-coffee-bean: #362d26;
--color-coffee-bean-50: #f9f4f0;
--color-coffee-bean-100: #ece7e2;
--color-coffee-bean-200: #dad3cd;
--color-coffee-bean-300: #beb6ae;
--color-coffee-bean-400: #a79c94;
--color-coffee-bean-500: #90847b;
--color-coffee-bean-600: #796f68;
--color-coffee-bean-700: #615953;
--color-coffee-bean-800: #47413c;
--color-coffee-bean-900: #312d29;
--color-coffee-bean-950: #1d1a17;
}SCSS
$coffee-bean: #362d26;
$coffee-bean-rgb: 54, 45, 38;
$coffee-bean-light: mix(#fff, $coffee-bean, 20%);
$coffee-bean-dark: mix(#000, $coffee-bean, 20%);
.element {
color: $coffee-bean;
box-shadow: 0 0 0 2px rgba($coffee-bean, 0.35);
}