Crimson vs Firebrick

What is the difference between Crimson and Firebrick?

Examining Crimson (#DC143C) relative to Firebrick (#B22222) showcases key differences in design application. In terms of color intensity, Crimson is visibly more vibrant and saturated. 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 Crimson vs Firebrick

When choosing between Crimson and Firebrick 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.

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

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

Technical Specifications Comparison

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

Individual Color References

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