UI Shades

A study in brown

Burnt Orange

#CC5500

Family
Brown
L
0.595
C
0.169
H
45°

Notes

Burnt Orange is the rust-tinted orange of autumn leaves and 1970s upholstery. The exact value sits between true orange and red-brown, deep enough to feel earthy but bright enough to register as a hot color rather than a brown. It enjoyed a major revival in branding around 2018 when warm minimalism became fashionable in lifestyle and fashion. As a primary accent it sits well against cream and charcoal. Sage green alongside gives a vintage palette; deep teal yields richer contrast. Large areas suit editorial layouts; in UI contexts it can be mistaken for a hover state on an orange button.

#cc5500
Burnt Orange
Burnt Orange
#cc5500
oklch(0.595 0.169 45.48)
rgb(204 85 0)
hsl(25 100% 40%)
Share
#fff4ea
#ffecdd
#ffd8c1
#ffc09d
#ff9056
#db621c
#cc5500
#a23400
#792100
#561100
#310600

See your palette on a real UI - coming soon

Preview these shades across buttons, cards, and components in a live interface.

Plate 02

Palette built around Burnt Orange

Cross-reference
Q&A

Frequently asked questions

What is Burnt Orange?

Burnt Orange is the rust-tinted orange of autumn leaves and 1970s upholstery. The exact value sits between true orange and red-brown, deep enough to feel earthy but bright enough to register as a hot color rather than a brown. Its hex code is #CC5500.

What are the tints and shades of Burnt Orange?

uishades builds an 11-step OKLCH ramp for Burnt Orange (#CC5500) - its lightest tints through its darkest shades - plus an 11-stop Tailwind scale (50–950), both keyed to the same 50–950 stops. Lightness steps stay evenly spaced and the hue stays stable, so the mid-tones don't go muddy.

What colors pair well with Burnt Orange?

Its complementary color is #008DBB. Triadic partners are #009969 and #786ADD; analogous neighbours are #AF6F00 and #CF495C.

What are the OKLCH and RGB values of Burnt Orange?

Burnt Orange is #CC5500 - OKLCH 0.595 0.169 45°, rgb(204 85 0), in the brown family.