#F6AF51#F6AF51

#F6AF51 is a light, vivid orange. Relative luminance 0.508; OKLCH L 80.4% C 0.137 H 71.1°. Best body text is #000000 at 11.17:1 contrast (WCAG AA passes).

Color values

HEX	#F6AF51
RGB	rgb(246, 175, 81)
HSL	hsl(34, 90%, 64%)
HSV	hsv(34, 67%, 96%)
CMYK	cmyk(0%, 28.9%, 67.1%, 3.5%)
CIE-LAB	lab(76.59, 17.12, 57.01)
CIE-LCH	lch(76.59, 59.53, 73.28°)
OKLab	oklab(80.45% 0.0443 0.1295)
OKLCH	oklch(80.45% 0.137 71.1)
XYZ	xyz(54.8249, 50.8513, 14.7108)
Luminance	0.5085 (WCAG relative)
Temperature	warm
Family	orange

Closest named colors

Perceptual scales

Shades

Tints

Tones

OKLCH scale

Color harmonies

complementary

#F6AF51 #5198F6

analogous

#F65D51 #F6AF51 #EAF651

triadic

#F6AF51 #51F6AF #AF51F6

tetradic

#F6AF51 #51F65D #5198F6 #F651EA

square

#F6AF51 #51F65D #5198F6 #F651EA

split-complementary

#F6AF51 #51EAF6 #5D51F6

monochromatic

#C3730A #F39417 #F6AF51 #F9CA8B #FCE5C5

Accessibility & contrast

On white

1.88

#F6AF51 on #FFFFFF

AA ✗AA large ✗AAA ✗

On black

11.17

#F6AF51 on #000000

AA ✓AA large ✓AAA ✓

Best text color

#000000 on #F6AF51

11.17:1 — WCAG AA (normal text) passes

Contrast matrix

fg \ bg	##F6AF51	#FFFFFF	#000000	##000000
##F6AF51	1.00	1.88	11.17	11.17
#FFFFFF	1.88	1.00	21.00	21.00
#000000	11.17	21.00	1.00	1.00
##000000	11.17	21.00	1.00	1.00

Color blindness preview

Protanopia (red-blind)

#C8B347

Deuteranopia (green-blind)

#D8C453

Tritanopia (blue-blind)

#FF9D9B

Achromatopsia (no color)

#BDBDBD

Design tokens & code

CSS

--color: #f6af51;
/* rgb */ color: rgb(246, 175, 81);
/* oklch */ color: oklch(80.4% 0.137 71.1);

Tailwind

colors: {
  custom: {
    50: '#fec686',
    500: '#f6af51',
    950: '#000000',
  },
}

SCSS

$custom: #f6af51;
$custom-light: #fec686;
$custom-dark: #000000;

JSON

{
  "hex": "#f6af51",
  "rgb": {
    "r": 246,
    "g": 175,
    "b": 81
  },
  "hsl": {
    "h": 34.182,
    "s": 90.164,
    "l": 64.118
  },
  "oklch": {
    "l": 0.80448,
    "c": 0.13684,
    "h": 71.1
  },
  "luminance": 0.50847
}

Semantic roles & 50–950 ramp

primary

#F6AF51

secondary

#2B6BC0

accent

#63E600

background

#FFFDFB

surface

#FFF9F2

border

#D7D2CC

text

#19130B

muted

#87827E

Preview Lab

Preview with #F6AF51

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

Preview Lab → · Contrast checker → · Palette generator →