Tomato in OKLCH

Tomato is the warm red-orange CSS named color #FF6347. 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(69.6% 0.196 32.3)

HEX#FF6347

RGBrgb(255 99 71)

sRGB: in gamutDisplay-P3: in gamut

#FF6347

oklch(69.6% 0.196 32.3)

Lightness69.6%

Chroma0.196

Hue32.3°

sRGB: in gamutDisplay-P3: in gamut

Values

OKLCH

oklch(69.6% 0.196 32.3)

HEX

#FF6347

RGB

rgb(255 99 71)

Set from hex

Contrast (this color as text)

Aa on whiteWCAG 2.95:1

AA ✗AAA ✗

APCA Lc 55

Aa on blackWCAG 7.13:1

AA ✓AAA ✓

APCA Lc 47

Tonal palette

Tailwind steps · same hue

Export

Name

@theme {
  --color-brand-50: oklch(97.0% 0.134 32.3);
  --color-brand-100: oklch(94.0% 0.139 32.3);
  --color-brand-200: oklch(88.0% 0.150 32.3);
  --color-brand-300: oklch(80.0% 0.164 32.3);
  --color-brand-400: oklch(70.0% 0.181 32.3);
  --color-brand-500: oklch(62.0% 0.196 32.3);
  --color-brand-600: oklch(54.0% 0.181 32.3);
  --color-brand-700: oklch(46.0% 0.167 32.3);
  --color-brand-800: oklch(38.0% 0.153 32.3);
  --color-brand-900: oklch(30.0% 0.139 32.3);
  --color-brand-950: oklch(22.0% 0.125 32.3);
}

About tomato

Tomato is a lively red with an orange lean that feels warm and energetic without tipping into pure red, so it works well for CTAs, food branding and friendly alerts. It is bright and saturated, so watch the gamut badge on the most chromatic steps. Hold the hue and sweep lightness to build a soft-to-deep tomato ramp, then copy the OKLCH, HEX or RGB value.

Tomato in CSS: oklch(69.6% 0.196 32.3) · #ff6347 · rgb(255 99 71)

Frequently Asked Questions

Tomato is the CSS named color #FF6347 (rgb(255, 99, 71)). Its OKLCH equivalent is shown in the readout above and can be copied in one click.

Tomato (#FF6347) is redder and a touch more saturated, while coral (#FF7F50) leans more orange. In OKLCH tomato sits at a slightly lower hue angle toward red.

Other colors in OKLCH

Rebecca Purple Coral Crimson Teal Hot Pink Gold

Back to the full OKLCH Color Picker

From the blog

accessibility

Tomato in OKLCH

Values

Contrast (this color as text)

Tonal palette

Export

About tomato

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