18 Different Shades of Maroon (+ HEX codes)

Explore all shades of maroon, from lighter to darker shades. See HEX codes, shade names, and maroon color palettes. Click any shade to copy its HEX code.

Maroon is brown-red: the colour of school crests, brick and dried blood. It reads as tradition and endurance rather than passion.

It pairs naturally with cream, camel and forest green, and takes white text at any size.

fair pink
#ffebeb
cosmos
#ffd1d1
sundown
#ffb7b7
mona lisa
#ff9d9d
vivid tangerine
#ff8484
bittersweet
#ff6a6a
sunset orange
#ff5050
red orange
#ff3636
torch red
#ff1c1c
red
#ff0303
guardsman red
#ce0000
bright red
#b40000
sangria
#9b0000
maroon
#810000
lonestar
#670000
temptress
#4d0000
diesel
#1a0000
black
#000000

Maroon: HEX & RGB Codes

maroon has the following primary color codes:

HEX: #ffebeb
RGB: (255, 235, 235).

Explore a wide range of maroon shades using our interactive color picker. Click any color to copy its HEX code and use it in your project!

Explore tints of maroon

Fair Pink
#ffebeb
Fair Pink
#ffebeb
Chablis
#fff0f0
Chablis
#fff0f0
Rose White
#fff5f5
Rose White
#fff5f5
Rose White
#fff5f5
Rose White
#fffafa
Rose White
#fffafa
White
#ffffff

Explore shades of maroon

Aubergine
#340909
Brown Derby
#4c1515
Irish Coffee
#652525
Lotus
#813b3b
Au Chico
#9b5555
Turkish Rose
#b47474
Oriental Pink
#cc9494
Cavern Pink
#e5bdbd

maroon in HEX, RGB, HSL and CMYK

HEX	#800000
RGB	rgb(128, 0, 0)
HSL	hsl(0, 100%, 25%)
CMYK	cmyk(0%, 100%, 100%, 50%)

Tints and shades of maroon

Tints add white and shades add black, keeping the hue. Use them for hover states, borders and backgrounds that still belong to the same colour.

Tints (lighter)

#bc0000
#f80000
#ff3636
#ff7272
#ffaeae
#ffebeb

Shades (darker)

#6e0000
#5c0000
#4a0000
#380000
#260000
#140000

Colours that work with maroon

Complementary

#800000 #007f80

Opposite on the colour wheel. Maximum contrast — use it for accents, not for half the page.

Analogous

#800040 #800000 #804000

Neighbours on the wheel. Calm and cohesive, the safest way to build a palette.

Triadic

#800000 #008000 #000080

Three colours evenly spaced. Lively and balanced; let one dominate.

Text on maroon

Example Primary text

White text on maroon10.95:1AAA

Example Primary text

Near-black text on maroon1.62:1Fail

Measured against WCAG: 4.5:1 for body text, 3:1 for large text. Test your own pair in the Contrast Checker

maroon shade chart

Shade chart showing five steps of maroon, from light tint to deep shade

Right-click to save the chart, or copy the individual codes above.