Firebrick vs Crimson

What is the difference between Firebrick and Crimson?

Examining Firebrick (#B22222) relative to Crimson (#DC143C) showcases key differences in design application. In terms of color intensity, Crimson features a more vivid and saturated tone. Both shades have a nearly identical lightness profile on screens. They sit far apart on the color wheel, creating a distinct visual contrast.

Design recommendations for Firebrick vs Crimson

When choosing between Firebrick and Crimson for interface designs, consider their visual weight. Since Firebrick is darker, it serves as a solid base for structural layouts or heavy typography, while the lighter Crimson is ideal for backgrounds or high-visibility accents. Testing their contrast ratio is essential to meet WCAG accessibility guidelines.

Readability & Contrast Testing

Visual test showing black and white text overlay readability on both colors.

Firebrick Typography

Preview of dark and light text elements rendered over a solid Firebrick background canvas.

White Text: 6.68:1 Black Text: 3.14:1

Crimson Typography

Preview of dark and light text elements rendered over a solid Crimson background canvas.

White Text: 4.99:1 Black Text: 4.21:1

Technical Specifications Comparison

Format / Value Firebrick Crimson Delta / Difference
HEX Code #B22222 #DC143C -
RGB Channels rgb(178, 34, 34) rgb(220, 20, 60) R:+42 | G:-14 | B:+26
HSL Values hsl(0°, 68%, 42%) hsl(348°, 83%, 47%) H:+348° | S:+15% | L:+5%
CMYK (Print) cmyk(0%, 81%, 81%, 30%) cmyk(0%, 91%, 73%, 14%) -

Individual Color References

Firebrick Reference Sheet HEX, RGB, HSL and print codes
Crimson Reference Sheet HEX, RGB, HSL and print codes
Copied!