#AF976F#AF976F

#AF976F is a light, moderate orange. Relative luminance 0.324; OKLCH L 68.8% C 0.062 H 80.1°. Best body text is #000000 at 7.48:1 contrast (WCAG AA passes).

Color values

HEX#AF976F
RGBrgb(175, 151, 111)
HSLhsl(38, 29%, 56%)
HSVhsv(38, 37%, 69%)
CMYKcmyk(0%, 13.7%, 36.6%, 31.4%)
CIE-LABlab(63.67, 3.04, 24.39)
CIE-LCHlch(63.67, 24.58, 82.90°)
OKLaboklab(68.8% 0.0106 0.0609)
OKLCHoklch(68.8% 0.062 80.1)
XYZxyz(31.6157, 32.3961, 19.6236)
Luminance0.3240 (WCAG relative)
Temperaturewarm
Familyorange

Closest named colors

Perceptual scales

Shades

Tints

Tones

OKLCH scale

Color harmonies

complementary
#AF976F #6F87AF
analogous
#AF776F #AF976F #A7AF6F
triadic
#AF976F #6FAF97 #976FAF
tetradic
#AF976F #6FAF77 #6F87AF #AF6FA7
square
#AF976F #6FAF77 #6F87AF #AF6FA7
split-complementary
#AF976F #6FA7AF #776FAF
monochromatic
#69583A #917850 #AF976F #C5B396 #DBD0BE

Accessibility & contrast

On white

2.81
#AF976F on #FFFFFF
AA ✗AA large ✗AAA ✗

On black

7.48
#AF976F on #000000
AA ✓AA large ✓AAA ✓

Best text color

#000000 on #AF976F
7.48:1 — WCAG AA (normal text) passes

Contrast matrix

fg \ bg##AF976F#FFFFFF#000000##000000
##AF976F1.002.817.487.48
#FFFFFF2.811.0021.0021.00
#0000007.4821.001.001.00
##0000007.4821.001.001.00

Color blindness preview

Protanopia (red-blind)
#A1976C
Deuteranopia (green-blind)
#A79D70
Tritanopia (blue-blind)
#B9908C
Achromatopsia (no color)
#9A9A9A

Design tokens & code

CSS
--color: #af976f;
/* rgb */ color: rgb(175, 151, 111);
/* oklch */ color: oklch(68.8% 0.062 80.1);
Tailwind
colors: {
  custom: {
    50: '#c8b598',
    500: '#af976f',
    950: '#000000',
  },
}
SCSS
$custom: #af976f;
$custom-light: #c8b598;
$custom-dark: #000000;
JSON
{
  "hex": "#af976f",
  "rgb": {
    "r": 175,
    "g": 151,
    "b": 111
  },
  "hsl": {
    "h": 37.5,
    "s": 28.571,
    "l": 56.078
  },
  "oklch": {
    "l": 0.68798,
    "c": 0.06181,
    "h": 80.1
  },
  "luminance": 0.32395
}

Semantic roles & 50–950 ramp

primary
#AF976F
secondary
#B0BACA
accent
#88C563
background
#FCFBF9
surface
#F8F6F2
border
#D1D0CC
text
#13110D
muted
#82807E

Preview Lab

Preview with #AF976F

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

Preview Lab → · Contrast checker → · Palette generator →

#AF976F Color — HEX, RGB, HSL, OKLCH & Contrast — Tintiva