Online Tools HarborFire Brick color codes
| CSS name | firebrick |
|---|---|
| HEX | #B22222 |
| RGB | rgb(178, 34, 34) |
| HSL | hsl(0, 68%, 42%) |
| CMYK | cmyk(0%, 81%, 81%, 30%) |
| Decimal | 11674146 |
Shades of Fire Brick (darker)
#A01F1F · #8E1B1B · #7D1818 · #6B1414 · #591111 · #470E0E · #350A0A · #240707 · #120303
Tints of Fire Brick (lighter)
#BA3838 · #C14E4E · #C96464 · #D17A7A · #D99191 · #E0A7A7 · #E8BDBD · #F0D3D3 · #F7E9E9
Color harmonies
| Complementary | #22B4B4 |
|---|---|
| Triadic | #22B422, #2222B4 |
| Analogous | #B4226B, #B46B22 |
Accessibility (WCAG contrast)
| White text on Fire Brick | 6.68:1 · AA |
|---|---|
| Black text on Fire Brick | 3.14:1 · AA large text only |
Use Fire Brick in code
.element {
color: firebrick; /* or #b22222 */
background-color: rgb(178 34 34 / 0.5);
}Frequently asked questions
What is the hex code for Fire Brick?
Fire Brick is #B22222 in HEX, rgb(178, 34, 34) in RGB and hsl(0, 68%, 42%) in HSL.
Can I use "firebrick" directly in CSS?
Yes. "firebrick" is one of the 148 standard CSS named colors, so color: firebrick; works in every browser.
Is Fire Brick readable on white?
The contrast ratio of Fire Brick on white is 6.68:1 (WCAG AA). On black it is 3.14:1 (AA large text only).
What is the complementary color of Fire Brick?
The complementary color (opposite on the color wheel) is #22B4B4.
Similar colors
Brown#A52A2ACrimson#DC143CSienna#A0522DSaddle Brown#8B4513Dark Red#8B0000Maroon#800000Chocolate#D2691EIndian Red#CD5C5C
Convert any color with the Color Converter, generate palettes with the Random Color Generator, or browse all 148 CSS color names.