#CC553D Hex Color

Online color picker to view shades, tints, color codes, and complementary colors

Hex color #cc553d graphic
This saturated terracotta red feels raw and urgent. It carries a heavy, earthy undertone that anchors the shade, making it too intense for large backgrounds. Instead, use #cc553d as a high-impact accent color for calls to action or UI highlights. It pairs effectively with cool slate grays to temper its heat. The hex code for this brick red is #cc553d, which offers enough contrast for legible black text.

Questions about #cc553d

What is #cc553d in RGB, HSL and CMYK?
In RGB, #cc553d is rgb(204, 85, 61), in HSL hsl(10, 58%, 52%) and in CMYK 0%, 58%, 70%, 20%. Browse more shades of brown with names and hex codes.
How should I use #cc553d in a user interface design?
Use #cc553d primarily for high-impact UI elements like call-to-action buttons, notification badges, or icon highlights. Because this shade is so saturated and urgent, applying it to large background areas can overwhelm the user and make text significantly harder to read.
What neutral colors pair best with #cc553d?
Pair #cc553d with deep slate grays to effectively temper its high heat and intensity. These cool, muted tones balance the heavy, earthy red, allowing the color to stand out as a sharp accent without clashing or causing visual fatigue.
Is #cc553d readable on white or black?
#cc553d has a 4.25:1 contrast ratio on white and 4.93:1 on black. WCAG asks for 4.5:1 for body text and 3:1 for large text, so on white it works only for large text (24px, or 18.5px bold) and on black it works for body text. Try other pairs in the contrast checker.