Indianred Color Palette

Indianred Color Palette built around #CD5C5C, a dark warm red anchor (WCAG contrast 5.28:1 against black). The set combines a light tint + a deep shade + a softened complement + a neutral ground so any palette position has a text-safe pairing.

redmoderatewarm
#CD5C5C
#FCC0BC
#74292B
#75B4B4
#D46D6B
#cd5c5c #fcc0bc #74292b #75b4b4 #d46d6b
#CD5C5C #FCC0BC #74292B #75B4B4 #D46D6B

Semantic roles

Assigned deterministically: lightest = background, darkest = text, most saturated = primary.

background#FCC0BC
surface#75B4B4
text#74292B
text-muted#CD5C5C
primary#CD5C5C
secondary#75B4B4
accent#D46D6B

CSS variables

:root {
  --background: #fcc0bc;
  --surface: #75b4b4;
  --text: #74292b;
  --text-muted: #cd5c5c;
  --primary: #cd5c5c;
  --secondary: #75b4b4;
  --accent: #d46d6b;
}
Preview in UIs →

Accessibility matrix

Text color (rows) on background (columns). Green = WCAG AA pass for normal text (≥4.5:1).

Text \ BG#CD5C5C#FCC0BC#74292B#75B4B4#D46D6B
#CD5C5C
1.0
2.5
2.5
1.7
1.2
#FCC0BC
2.5
1.0
6.4
1.5
2.2
#74292B
2.5
6.4
1.0
4.3
3.0
#75B4B4
1.7
1.5
4.3
1.0
1.4
#D46D6B
1.2
2.2
3.0
1.4
1.0

Under deuteranopia

Machado et al. (2009) simulation, severity 1.0 — approximation, not a medical tool.

Colors in this palette

Similar palettes

FAQ

How do I use the indianred color palette in CSS?

Copy the CSS variables below into :root and use var(--primary), var(--background) etc. Full palette: #CD5C5C, #FCC0BC, #74292B, #75B4B4, #D46D6B.

Do these colors pass accessibility checks?

See the WCAG matrix on this page: every text-on-background pairing with ratio ≥ 4.5 passes AA for normal text; ≥ 3 passes AA for large text and UI components.