Olive in OKLCH

Olive is the muted yellow-green CSS named color #808000. Here it is in OKLCH, RGB and as a full tonal palette you can copy or tweak below. 100% in your browser - copy the values or a Tailwind v4 export.

OKLCHoklch(58.1% 0.127 109.8)

HEX#808000

RGBrgb(128 128 0)

sRGB: in gamutDisplay-P3: in gamut

#808000

oklch(58.1% 0.127 109.8)

Lightness58.1%

Chroma0.127

Hue109.8°

sRGB: in gamutDisplay-P3: in gamut

Values

OKLCH

oklch(58.1% 0.127 109.8)

HEX

#808000

RGB

rgb(128 128 0)

Set from hex

Contrast (this color as text)

Aa on whiteWCAG 4.20:1

AA ✗AAA ✗

APCA Lc 69

Aa on blackWCAG 5.01:1

AA ✓AAA ✗

APCA Lc 33

Tonal palette

Tailwind steps · same hue

Export

Name

@theme {
  --color-brand-50: oklch(97.0% 0.087 109.8);
  --color-brand-100: oklch(94.0% 0.090 109.8);
  --color-brand-200: oklch(88.0% 0.097 109.8);
  --color-brand-300: oklch(80.0% 0.106 109.8);
  --color-brand-400: oklch(70.0% 0.117 109.8);
  --color-brand-500: oklch(62.0% 0.127 109.8);
  --color-brand-600: oklch(54.0% 0.117 109.8);
  --color-brand-700: oklch(46.0% 0.108 109.8);
  --color-brand-800: oklch(38.0% 0.099 109.8);
  --color-brand-900: oklch(30.0% 0.090 109.8);
  --color-brand-950: oklch(22.0% 0.081 109.8);
}

About olive

Olive is an earthy, desaturated yellow-green that reads as natural, calm and vintage, which suits organic, military and heritage branding. It sits at a mid lightness with restrained chroma, so it plays well as a neutral-ish accent. Fix the hue and vary lightness for a range of olive tones from pale sage to deep drab, then copy the OKLCH, HEX or RGB value.

Olive in CSS: oklch(58.1% 0.127 109.8) · #808000 · rgb(128 128 0)

Frequently Asked Questions

Olive is rgb(128, 128, 0). The RGB, HEX (#808000) and OKLCH values are all shown in the readouts above and can be copied individually.

Olive is a dark, desaturated yellow-green. Its OKLCH hue lands between yellow and green, and its low chroma is what gives it that muted, earthy character.

Other colors in OKLCH

Rebecca Purple Coral Crimson Teal Hot Pink Gold

Back to the full OKLCH Color Picker

From the blog

accessibility

Olive in OKLCH

Values

Contrast (this color as text)

Tonal palette

Export

About olive

Frequently Asked Questions

Other colors in OKLCH

From the blog

APCA vs. WCAG: Navigating Color Contrast and Accessibility in 2026

Migrating to Tailwind v4: How to Configure Custom OKLCH Color Themes

The Science of Wide-Gamut Web Colors and Gamut Mapping

Values

Contrast (this color as text)

Tonal palette

Export