UI Shades

A study in brown

Brown

#A52A2A

Family
Brown
L
0.481
C
0.160
H
26°

Notes

Brown is the CSS named color closest to the dictionary definition of the word: a deep, warm, reddish-tan. Despite the name, the hex sits in the red family by hue, just at low enough lightness to register as earthen rather than fiery. Brown shows up in heritage branding for coffee, leather goods, and outdoor equipment as the dominant tone. Cream and brass accents sit well alongside, as does sage green for a vintage palette. On the web it is rare as a primary action color because it competes with red for attention without the same urgency cues, which can confuse users.

#a52a2a
Brown
Brown
#a52a2a
oklch(0.481 0.16 25.56)
rgb(165 42 42)
hsl(0 59.4% 40.6%)
Share
#fff3f0
#ffebe7
#ffd6d0
#ffbdb5
#ff877e
#df5a54
#c23f3c
#a52a2a
#7c181a
#580a0d
#320304

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 Brown

Cross-reference
Q&A

Frequently asked questions

What is Brown?

Brown is the CSS named color closest to the dictionary definition of the word: a deep, warm, reddish-tan. Despite the name, the hex sits in the red family by hue, just at low enough lightness to register as earthen rather than fiery. Its hex code is #A52A2A.

What are the tints and shades of Brown?

uishades builds an 11-step OKLCH ramp for Brown (#A52A2A) - 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 Brown?

Its complementary color is #006D79. Triadic partners are #007316 and #3255B6; analogous neighbours are #974200 and #9E2961.

What are the OKLCH and RGB values of Brown?

Brown is #A52A2A - OKLCH 0.481 0.160 26°, rgb(165 42 42), in the brown family.