#CBC786#CBC786

#CBC786 is a light, moderate yellow. Relative luminance 0.553; OKLCH L 81.8% C 0.085 H 105.1°. Best body text is #000000 at 12.05:1 contrast (WCAG AA passes).

Color values

HEX	#CBC786
RGB	rgb(203, 199, 134)
HSL	hsl(57, 40%, 66%)
HSV	hsv(57, 34%, 80%)
CMYK	cmyk(0%, 2%, 34%, 20.4%)
CIE-LAB	lab(79.19, -8.43, 33.10)
CIE-LCH	lch(79.19, 34.16, 104.29°)
OKLab	oklab(81.77% -0.0221 0.0819)
OKLCH	oklch(81.77% 0.085 105.1)
XYZ	xyz(49.3556, 55.2656, 30.6170)
Luminance	0.5526 (WCAG relative)
Temperature	warm
Family	yellow

Closest named colors

Perceptual scales

Shades

Tints

Tones

OKLCH scale

Color harmonies

complementary

#CBC786 #868ACB

analogous

#CBA486 #CBC786 #ACCB86

triadic

#CBC786 #86CBC7 #C786CB

tetradic

#CBC786 #86CBA4 #868ACB #CB86AC

square

#CBC786 #86CBA4 #868ACB #CB86AC

split-complementary

#CBC786 #86ACCB #A486CB

monochromatic

#969141 #B9B35B #CBC786 #DDDBB1 #F0EFDC

Accessibility & contrast

On white

1.74

#CBC786 on #FFFFFF

AA ✗AA large ✗AAA ✗

On black

12.05

#CBC786 on #000000

AA ✓AA large ✓AAA ✓

Best text color

#000000 on #CBC786

12.05:1 — WCAG AA (normal text) passes

Contrast matrix

fg \ bg	##CBC786	#FFFFFF	#000000	##000000
##CBC786	1.00	1.74	12.05	12.05
#FFFFFF	1.74	1.00	21.00	21.00
#000000	12.05	21.00	1.00	1.00
##000000	12.05	21.00	1.00	1.00

Color blindness preview

Protanopia (red-blind)

#D2C281

Deuteranopia (green-blind)

#D4C689

Tritanopia (blue-blind)

#D5BFB6

Achromatopsia (no color)

#C4C4C4

Design tokens & code

CSS

--color: #cbc786;
/* rgb */ color: rgb(203, 199, 134);
/* oklch */ color: oklch(81.8% 0.085 105.1);

Tailwind

colors: {
  custom: {
    50: '#dcd7aa',
    500: '#cbc786',
    950: '#000000',
  },
}

SCSS

$custom: #cbc786;
$custom-light: #dcd7aa;
$custom-dark: #000000;

JSON

{
  "hex": "#cbc786",
  "rgb": {
    "r": 203,
    "g": 199,
    "b": 134
  },
  "hsl": {
    "h": 56.522,
    "s": 39.884,
    "l": 66.078
  },
  "oklch": {
    "l": 0.81768,
    "c": 0.08484,
    "h": 105.1
  },
  "luminance": 0.55265
}

Semantic roles & 50–950 ramp

primary

#CBC786

secondary

#585C9D

accent

#3AB333

background

#FEFEFD

surface

#FCFBF7

border

#D5D4D0

text

#151410

muted

#848381

Preview Lab

Preview with #CBC786

Body copy rendered with the generated semantic roles for this colour.

Preview Lab → · Contrast checker → · Palette generator →