Cor nomeada · #FF3300
Boiling Magma
Boiling Magma é #FF3300: rgb(255 51 0), hsl(12 100% 50%), oklch(0.646 0.241 32.6). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Red mean? → · Boiling Magma color name →
#FF3300
oklch(0.646 0.241 32.6)
Conversões de cor
- HEX
- #ff3300
- RGB
- rgb(255 51 0)
- HSL
- hsl(12 100% 50%)
- HWB
- hwb(12 0% 0%)
- OKLCH
- oklch(0.646 0.241 32.6)
- OKLab
- oklab(0.646 0.203 0.13)
- CIE Lab
- lab(56.71 74.1 70.38)
- LCH
- lch(56.71 102.19 43.5)
- CMYK
- cmyk(0% 80% 100% 0%)
Tons claros · Sombras · Tons
Tons claros
- FF5333
- FF6B4E
- FF8166
- FF957D
- FFA793
- FFBAA8
- FFCBBE
- FFDDD4
- FFEEE9
Sombras
- DE2B00
- BE2300
- 9E1C00
- 801400
- 630D00
- 480700
- 2E0300
- 160100
- 030000
Tons
- F44423
- E85035
- DD5A42
- D1624D
- C56957
- B86F60
- AB7469
- 9E7971
- 8F7D78
Harmonias de cor
Complementar +180°
- FF3300
Boiling Magma
- 009FB6
≈ January Blue
Análoga -30° +30°
- FF3300
Boiling Magma
- F82981
≈ Pink Piano
- CC7600
≈ Mountain Ash
Tríade +120° +240°
- FF3300
Boiling Magma
- 00AA59
≈ Rita Repulsa
- 6A80FF
≈ Deep Denim
Complementar dividida +150° +210°
- FF3300
Boiling Magma
- 00A494
≈ Tropical Sea
- 0096E4
≈ Atmosphere
Tétrade +90° +180° +270°
- FF3300
Boiling Magma
- 7D9C00
≈ Luminescent Green
- 009FB6
≈ January Blue
- AB5DFF
≈ Vega Violet
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 3.66:1 · APCA Lc 62
Ag
AASobre preto
WCAG 5.72:1 · APCA Lc 39
Melhor cor de texto: #000000
WCAG 5.72:1 (AA) · APCA Lc 39
Contrast pairs
Trechos de código
CSS
:root {
--boiling-magma: #ff3300;
--boiling-magma-rgb: 255 51 0;
--boiling-magma-oklch: oklch(0.646 0.241 32.6);
}
.element {
color: var(--boiling-magma);
background-color: hsl(12 100% 50%);
border-color: oklch(0.646 0.241 32.6);
}Tailwind CSS v4
@theme {
--color-boiling-magma: #ff3300;
--color-boiling-magma-50: #ffddc7;
--color-boiling-magma-100: #ffcbb2;
--color-boiling-magma-200: #ffac8d;
--color-boiling-magma-300: #ff815d;
--color-boiling-magma-400: #ff5230;
--color-boiling-magma-500: #fe0000;
--color-boiling-magma-600: #d70000;
--color-boiling-magma-700: #ad0500;
--color-boiling-magma-800: #820000;
--color-boiling-magma-900: #5c0300;
--color-boiling-magma-950: #3e0000;
}SCSS
$boiling-magma: #ff3300;
$boiling-magma-rgb: 255, 51, 0;
$boiling-magma-light: mix(#fff, $boiling-magma, 20%);
$boiling-magma-dark: mix(#000, $boiling-magma, 20%);
.element {
color: $boiling-magma;
box-shadow: 0 0 0 2px rgba($boiling-magma, 0.35);
}