Nearest named color · #764E2D
#764E2D
Nearest named color: Chocolate Bells
#764E2D (rgb(118 78 45), hsl(27 45% 32%), oklch(0.461 0.072 59.2)) is closest to the named color Chocolate Bells. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#764E2D
oklch(0.461 0.072 59.2)
Color conversions
- HEX
- #764e2d
- RGB
- rgb(118 78 45)
- HSL
- hsl(27 45% 32%)
- HWB
- hwb(27 18% 54%)
- OKLCH
- oklch(0.461 0.072 59.2)
- OKLab
- oklab(0.461 0.037 0.062)
- CIE Lab
- lab(37.21 14.67 26.49)
- LCH
- lch(37.21 30.28 61)
- CMYK
- cmyk(0% 34% 62% 54%)
Tints · Shades · Tones
Tints
- 835E41
- 916F55
- 9E8069
- AC917D
- BAA392
- C7B5A7
- D5C7BC
- E3D9D2
- F1ECE8
Shades
- 664326
- 56381F
- 472D18
- 382311
- 29190B
- 1C0F06
- 0F0702
- 050201
- 010000
Tones
- 775336
- 79583F
- 7A5D47
- 7B624F
- 7C6757
- 7D6C60
- 7E7168
- 7F7670
- 7F7B78
Color harmonies
Complementary +180°
- 764E2D
Chocolate Bells
- 2E5E7C
≈ Nautical Creatures
Analogous -30° +30°
- 764E2D
Chocolate Bells
- 7C4841
≈ Texas Sweet Tea
- 685624
≈ Field Drab
Triadic +120° +240°
- 764E2D
Chocolate Bells
- 1F6559
≈ Eucalyptus Green
- 5E4F7B
≈ Imperial Palace
Split-complementary +150° +210°
- 764E2D
Chocolate Bells
- 17636E
≈ Seamount
- 485681
≈ Yacht Club Blue
Tetradic +90° +180° +270°
- 764E2D
Chocolate Bells
- 3A6442
≈ Forest Serenade
- 2E5E7C
≈ Nautical Creatures
- 6F496C
≈ Old Fashioned Purple
Contrast & accessibility
Ag
AAAOn white
WCAG 7.24:1 · APCA Lc 85
Ag
FailOn black
WCAG 2.89:1 · APCA Lc 17
Best text color: #FFFFFF
WCAG 7.24:1 (AAA) · APCA Lc 85
Contrast pairs
Code snippets
CSS
:root {
--chocolate-bells: #764e2d;
--chocolate-bells-rgb: 118 78 45;
--chocolate-bells-oklch: oklch(0.461 0.072 59.2);
}
.element {
color: var(--chocolate-bells);
background-color: hsl(27 45% 32%);
border-color: oklch(0.461 0.072 59.2);
}Tailwind CSS v4
@theme {
--color-chocolate-bells: #764e2d;
--color-chocolate-bells-50: #fff1e1;
--color-chocolate-bells-100: #fae3d0;
--color-chocolate-bells-200: #ecceb6;
--color-chocolate-bells-300: #d3b092;
--color-chocolate-bells-400: #bf9574;
--color-chocolate-bells-500: #aa7b55;
--color-chocolate-bells-600: #906848;
--color-chocolate-bells-700: #735339;
--color-chocolate-bells-800: #553c29;
--color-chocolate-bells-900: #3c291c;
--color-chocolate-bells-950: #25170c;
}SCSS
$chocolate-bells: #764e2d;
$chocolate-bells-rgb: 118, 78, 45;
$chocolate-bells-light: mix(#fff, $chocolate-bells, 20%);
$chocolate-bells-dark: mix(#000, $chocolate-bells, 20%);
.element {
color: $chocolate-bells;
box-shadow: 0 0 0 2px rgba($chocolate-bells, 0.35);
}