Skip to content

Brown

Brown is a medium, rich color from the red family. Hex code #A52A2A.

Brown#A52A2A

Color codes

  • CSS namebrown
  • HEX#A52A2A
  • RGBrgb(165 42 42)
  • HSLhsl(0 59% 41%)
  • HSB / HSVhsb(0, 75%, 65%)
  • OKLCHoklch(48.1% 0.16 25.6)
  • CMYKcmyk(0%, 75%, 75%, 35%)

White text

7.08:1 · passes WCAG AAA

Black text

2.96:1 · fails WCAG

Shades

50#FFEDEB
100#FFC4BE
200#FA9A92
300#EF6F67
400#D0534D
500#B13634
600#93151B
700#6B090F
800#450407

Complementary

#A52A2A
#156A73

Analogous

#A52A2A
#9E2961
#8E4904

Triadic

#A52A2A
#0B7222
#3255B6

About this color

Brown in CSS and design

Brown is a medium, rich color from the red family. Brown is one of the extended color keywords, which CSS adopted from the X11 color names used on Unix workstations.

Use it in CSS by name or by any of its codes; these all give the same color:

color: brown;
color: #A52A2A;
color: rgb(165 42 42);
color: hsl(0 59% 41%);

For text on brown, white reads best. Check other combinations with the contrast checker, or browse all CSS color names.

Frequently asked questions

What is the hex code for brown?

#A52A2A. In CSS you can also use the keyword brown, which works in every browser.

What is brown in RGB and HSL?

In RGB it is rgb(165 42 42), in HSL hsl(0 59% 41%). For print, cmyk(0%, 75%, 75%, 35%) is a starting point, but CMYK depends on paper and ink, so check with your printer.

Should I use black or white text on brown?

White text works better: it has a contrast ratio of 7.08:1 and passes WCAG AAA. Black text reaches 2.96:1.

Which colors go with brown?

Its complementary color is #156A73, on the opposite side of the color wheel. For a calmer look, combine it with its analogous neighbors #9E2961 and #8E4904. The palette generator builds more combinations.