Color con nombre · #CC4411
Fire Bolt
Fire Bolt es #CC4411: rgb(204 68 17), hsl(16 85% 43%), oklch(0.574 0.181 37.7). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Red mean? → · Fire Bolt color name →
#CC4411
oklch(0.574 0.181 37.7)
Conversiones de color
- HEX
- #cc4411
- RGB
- rgb(204 68 17)
- HSL
- hsl(16 85% 43%)
- HWB
- hwb(16 7% 20%)
- OKLCH
- oklch(0.574 0.181 37.7)
- OKLab
- oklab(0.574 0.143 0.111)
- CIE Lab
- lab(49.02 53.32 56.2)
- LCH
- lch(49.02 77.47 46.5)
- CMYK
- cmyk(0% 67% 92% 20%)
Tintes · Sombras · Tonos
Tintes
- D45A34
- DB6E4D
- E18164
- E7937A
- EDA690
- F2B8A6
- F6C9BC
- FADBD2
- FDEDE8
Sombras
- B13A0D
- 973009
- 7E2606
- 651D04
- 4E1402
- 370C01
- 220500
- 0F0200
- 020000
Tonos
- C64D26
- BF5534
- B95C40
- B2634B
- AA6955
- A36E5E
- 9B7367
- 93786F
- 8A7C78
Armonías de color
Complementario +180°
- CC4411
Fire Bolt
- 0087A0
≈ Gogo Blue
Análogo -30° +30°
- CC4411
Fire Bolt
- CA3B64
≈ Raspberry Jam
- A86800
≈ Butter Fudge
Triádico +120° +240°
- CC4411
Fire Bolt
- 008F58
≈ Emerald Isle
- 6367E0
≈ Exodus Fruit
Complementario dividido +150° +210°
- CC4411
Fire Bolt
- 008B83
≈ Clear Turquoise
- 007DCD
≈ Blue Aster
Tetrádico +90° +180° +270°
- CC4411
Fire Bolt
- 5F8800
≈ Sap Green
- 0087A0
≈ Gogo Blue
- 9653C9
≈ Morado Purple
Contraste y accesibilidad
Ag
AASobre blanco
WCAG 4.77:1 · APCA Lc 72
Ag
FailSobre negro
WCAG 4.40:1 · APCA Lc 30
Mejor color de texto: #FFFFFF
WCAG 4.77:1 (AA) · APCA Lc 72
Contrast pairs
Fragmentos de código
CSS
:root {
--fire-bolt: #cc4411;
--fire-bolt-rgb: 204 68 17;
--fire-bolt-oklch: oklch(0.574 0.181 37.7);
}
.element {
color: var(--fire-bolt);
background-color: hsl(16 85% 43%);
border-color: oklch(0.574 0.181 37.7);
}Tailwind CSS v4
@theme {
--color-fire-bolt: #cc4411;
--color-fire-bolt-50: #ffe5cf;
--color-fire-bolt-100: #ffd4bb;
--color-fire-bolt-200: #ffb999;
--color-fire-bolt-300: #ff956e;
--color-fire-bolt-400: #f57148;
--color-fire-bolt-500: #e44a0e;
--color-fire-bolt-600: #c04112;
--color-fire-bolt-700: #9b340f;
--color-fire-bolt-800: #74230d;
--color-fire-bolt-900: #521808;
--color-fire-bolt-950: #360700;
}SCSS
$fire-bolt: #cc4411;
$fire-bolt-rgb: 204, 68, 17;
$fire-bolt-light: mix(#fff, $fire-bolt, 20%);
$fire-bolt-dark: mix(#000, $fire-bolt, 20%);
.element {
color: $fire-bolt;
box-shadow: 0 0 0 2px rgba($fire-bolt, 0.35);
}