Terracotta color guide

#E2725B
HEX
#E2725B
RGB
rgb(226, 114, 91)
HSL
hsl(10, 70%, 62%)
CMYK
cmyk(0%, 50%, 60%, 11%)

The colour of fired clay — muted, warm and tactile. It grounds a palette the way a brown would but with more life.

Best for
Interior, ceramic and craft-led brands.

Accessibility

Terracotta text on whiteAA Large
Sample3.09:1
White text on terracottaAA Large
Sample3.09:1
Terracotta text on blackAA
Sample6.79:1
Black text on terracottaAA
Sample6.79:1

Ratios follow WCAG 2.1. AA needs 4.5:1 for body text, AAA needs 7:1; large text passes AA at 3:1.

Colors that go with terracotta

Combinations that hold up in a real layout rather than only on the colour wheel.

Terracotta color harmonies

Complementary
The opposite hue — highest contrast, best used sparingly.
#E2725B #5ACBE2
Analogous
Neighbouring hues that sit together calmly.
#E25A87 #E2725B #E2B55A
Triadic
Three evenly spaced hues — vivid but balanced.
#E2725B #5AE271 #715AE2
Split complementary
Softer than complementary, with the same tension.
#E2725B #5AE2B5 #5A87E2

Terracotta shades and tints

The same hue and saturation across ten lightness steps — the basis of a usable colour ramp in a design system.

#FBECE9#F4C7BE#ECA293#E47C67#DD573C#C33D22#98301B#6C2213#41140B#230B06

Terracotta FAQ

What is the hex code for terracotta?

Terracotta is #E2725B. In other formats that is rgb(226, 114, 91), hsl(10, 70%, 62%), and approximately cmyk(0%, 50%, 60%, 11%) for print.

What colors go with terracotta?

Sage Green, Cream, Espresso all pair well with terracotta. Interior, ceramic and craft-led brands.

Is terracotta accessible for text?

Not on white: terracotta reaches only 3.09:1 there, below the 4.5:1 WCAG AA threshold. Use it as a background with black text on top, or reserve it for large display type.

Should text on terracotta be black or white?

Use black text. It gives the higher contrast ratio of the two against #E2725B.

More orange colors