Fire Brick is a medium-dark, saturated shade in the red color family, with a warm feel. Its HEX code is #B22222, which equals rgb(178, 34, 34) in RGB and hsl(0, 68%, 42%) in HSL. In print terms it converts to roughly C0 M81 Y81 K30, although exact CMYK results depend on the paper and color profile.
- HEX
#B22222 - RGB
178, 34, 34 - HSL
0°, 68%, 42% - CMYK
0, 81, 81, 30 - Family
Red - Tone
Medium-dark, saturated
About Fire Brick
Red shades carry energy, urgency and passion. They draw the eye first, which makes them a favorite for calls to action, sale banners, alerts and brands that want to feel bold. It works well for buttons, headings, illustrations and brand accents. Text in white is the most readable choice on this color, with a contrast ratio of 6.68:1. Its complementary color is #22B4B4.
Download Fire Brick as an image
Choose a size and format, then download a solid-color image — or tick colors in the library to batch-download a ZIP.
Loading colors…
Loading gradients…
Fire Brick color codes
| HEX | #B22222 |
|---|---|
| RGB | rgb(178, 34, 34) |
| HSL | hsl(0, 68%, 42%) |
| HSV | 0°, 81%, 70% |
| CMYK | 0%, 81%, 81%, 30% |
| Decimal | 11674146 |
Shades and tints of Fire Brick
Lighter tints are mixed with white and darker shades are mixed with black.
- 50
#F2DADA - 100
#E5B5B5 - 200
#D99191 - 300
#CC6C6C - 400
#BF4747 - 500
#B22222 - 600
#941C1C - 700
#771717 - 800
#591111 - 900
#3B0B0B - 950
#1E0606
Color harmonies for Fire Brick
- Complementary
#22B4B4≈ Light Sea Green - Analogous −30°
#B4226B≈ Medium Dark Soft Blush - Analogous +30°
#B46B22≈ Medium Dark Soft Orange - Triadic +120°
#22B422≈ Medium Dark Soft Green - Triadic +240°
#2222B4≈ Medium Dark Soft Blue - Split 150°
#22B46B≈ Medium Dark Soft Mint - Split 210°
#226BB4≈ Medium Dark Soft Cerulean
Contrast and accessibility of Fire Brick
| Text color | Sample | Contrast ratio | WCAG |
|---|---|---|---|
| White text on Fire Brick | Aa | 6.68:1 | AA (good) |
| Black text on Fire Brick | Aa | 3.14:1 | AA Large only |
CSS code for Fire Brick
background-color: #B22222;color: #B22222;background-color: rgb(178, 34, 34);background-color: hsl(0, 68%, 42%);:root { --color-fire-brick: #B22222; }class="bg-[#B22222]"Colors similar to Fire Brick
- Medium Dark Soft Red
#AB2B2B - Brown
#A52A2A - Medium Dark Bright Scarlet
#C12715 - Medium Dark Bright Cardinal
#C11527 - Medium Dark Soft Cardinal
#AB2B38 - Medium Dark Bright Red
#C11515 - Deep Bright Scarlet
#9C1F11 - Cardinal
#C41E3A - Medium Dark Soft Scarlet
#AB382B - Medium Dark Bright Crimson
#C11538 - Deep Bright Vermilion
#9C2D11 - Deep Bright Cardinal
#9C111F
More red shades
- Crimson
#DC143C - Indian Red
#CD5C5C - Light Coral
#F08080 - Salmon
#FA8072 - Tomato
#FF6347 - Brown
#A52A2A - Dark Red
#8B0000 - Maroon
#800000 - Red
#FF0000 - Rosy Brown
#BC8F8F - Burgundy
#800020
Frequently asked questions
What is the HEX code for Fire Brick?
The HEX code for Fire Brick is #B22222.
What is the RGB value of Fire Brick?
Fire Brick has an RGB value of 178, 34, 34 (rgb(178, 34, 34)). In HSL it is 0°, 68%, 42%.
What text color should I use on Fire Brick?
Use white text on Fire Brick. White text has a contrast ratio of 6.68:1 and black text has 3.14:1; WCAG AA requires at least 4.5:1 for normal text.
What color goes well with Fire Brick?
The complementary color of Fire Brick is #22B4B4. Analogous colors #B4226B and #B46B22 also pair well.