Nearest named color · #CB8D56
#CB8D56
Nearest named color: Butter Bronze
#CB8D56 (rgb(203 141 86), hsl(28 53% 57%), oklch(0.694 0.104 61.4)) is closest to the named color Butter Bronze. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#CB8D56
oklch(0.694 0.104 61.4)
Color conversions
- HEX
- #cb8d56
- RGB
- rgb(203 141 86)
- HSL
- hsl(28 53% 57%)
- HWB
- hwb(28 34% 20%)
- OKLCH
- oklch(0.694 0.104 61.4)
- OKLab
- oklab(0.694 0.05 0.091)
- CIE Lab
- lab(64.12 20.05 38.95)
- LCH
- lch(64.12 43.81 62.8)
- CMYK
- cmyk(0% 31% 58% 20%)
Tints · Shades · Tones
Tints
- D19868
- D6A479
- DCAF8A
- E1BA9A
- E6C6AB
- ECD1BC
- F1DDCC
- F6E8DD
- FAF3EE
Shades
- B07A4A
- 96673E
- 7D5532
- 654427
- 4D331C
- 372312
- 221408
- 0F0702
- 020100
Tones
- C48C5C
- BC8B61
- B58A65
- AD896A
- A6876E
- 9E8672
- 978576
- 8F8379
- 88827D
Color harmonies
Complementary +180°
- CB8D56
Butter Bronze
- 5DA4D7
≈ Water Spirit
Analogous -30° +30°
- CB8D56
Butter Bronze
- D58374
≈ Freckles
- B49A4A
≈ Husk
Triadic +120° +240°
- CB8D56
Butter Bronze
- 41B1A0
≈ Waterfall
- A88DD3
≈ Middy’s Purple
Split-complementary +150° +210°
- CB8D56
Butter Bronze
- 3AADC1
≈ Explore Blue
- 8599DD
≈ Portage
Tetradic +90° +180° +270°
- CB8D56
Butter Bronze
- 69AF7B
≈ Pale Green
- 5DA4D7
≈ Water Spirit
- C284BA
≈ Lavender Sweater
Contrast & accessibility
Ag
FailOn white
WCAG 2.80:1 · APCA Lc 54
Ag
AAAOn black
WCAG 7.48:1 · APCA Lc 48
Best text color: #000000
WCAG 7.48:1 (AAA) · APCA Lc 48
Contrast pairs
Code snippets
CSS
:root {
--butter-bronze: #cb8d56;
--butter-bronze-rgb: 203 141 86;
--butter-bronze-oklch: oklch(0.694 0.104 61.4);
}
.element {
color: var(--butter-bronze);
background-color: hsl(28 53% 57%);
border-color: oklch(0.694 0.104 61.4);
}Tailwind CSS v4
@theme {
--color-butter-bronze: #cb8d56;
--color-butter-bronze-50: #fff0d7;
--color-butter-bronze-100: #ffe1c5;
--color-butter-bronze-200: #f5cba7;
--color-butter-bronze-300: #deac7f;
--color-butter-bronze-400: #cb905c;
--color-butter-bronze-500: #b77535;
--color-butter-bronze-600: #9b632f;
--color-butter-bronze-700: #7c4f25;
--color-butter-bronze-800: #5d391a;
--color-butter-bronze-900: #412711;
--color-butter-bronze-950: #291504;
}SCSS
$butter-bronze: #cb8d56;
$butter-bronze-rgb: 203, 141, 86;
$butter-bronze-light: mix(#fff, $butter-bronze, 20%);
$butter-bronze-dark: mix(#000, $butter-bronze, 20%);
.element {
color: $butter-bronze;
box-shadow: 0 0 0 2px rgba($butter-bronze, 0.35);
}