Couleur nommée · #FF1111
Spicy
Spicy correspond à #FF1111 : rgb(255 17 17), hsl(0 100% 53%), oklch(0.632 0.254 28.8). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Red mean? → · Spicy color name →
#FF1111
oklch(0.632 0.254 28.8)
Conversions de couleur
- HEX
- #ff1111
- RGB
- rgb(255 17 17)
- HSL
- hsl(0 100% 53%)
- HWB
- hwb(0 7% 0%)
- OKLCH
- oklch(0.632 0.254 28.8)
- OKLab
- oklab(0.632 0.223 0.122)
- CIE Lab
- lab(54.75 79.71 65.61)
- LCH
- lch(54.75 103.24 39.5)
- CMYK
- cmyk(0% 93% 93% 0%)
Teintes · Ombres · Tons
Teintes
- FF4437
- FF6150
- FF7868
- FF8E7E
- FFA293
- FFB5A9
- FFC8BE
- FFDBD4
- FFEDE9
Ombres
- DE0D0D
- BE0909
- 9E0606
- 800404
- 630202
- 480101
- 2E0000
- 160000
- 030000
Tons
- F43328
- E94437
- DD5143
- D25B4E
- C66457
- B96B60
- AC7169
- 9E7771
- 907C78
Harmonies de couleurs
Complémentaire +180°
- FF1111
Spicy
- 009BAD
≈ Aquarium Diver
Analogue -30° +30°
- FF1111
Spicy
- F50A87
≈ Fabulous Fuchsia
- CA6F00
≈ Sludge
Triadique +120° +240°
- FF1111
Spicy
- 00A646
≈ Poetic Green
- 5A7DFF
≈ C64 NTSC
Complémentaire divisée +150° +210°
- FF1111
Spicy
- 00A08B
≈ Turquish
- 0093D5
≈ Sea of Crete
Tétradique +90° +180° +270°
Contraste et accessibilité
Ag
FailSur blanc
WCAG 3.93:1 · APCA Lc 64
Ag
AASur noir
WCAG 5.34:1 · APCA Lc 38
Meilleure couleur de texte: #000000
WCAG 5.34:1 (AA) · APCA Lc 38
Contrast pairs
Extraits de code
CSS
:root {
--spicy: #ff1111;
--spicy-rgb: 255 17 17;
--spicy-oklch: oklch(0.632 0.254 28.8);
}
.element {
color: var(--spicy);
background-color: hsl(0 100% 53%);
border-color: oklch(0.632 0.254 28.8);
}Tailwind CSS v4
@theme {
--color-spicy: #ff1111;
--color-spicy-50: #ffdac9;
--color-spicy-100: #ffc8b4;
--color-spicy-200: #ffa890;
--color-spicy-300: #ff7b62;
--color-spicy-400: #ff473a;
--color-spicy-500: #ff0000;
--color-spicy-600: #dc0000;
--color-spicy-700: #b10000;
--color-spicy-800: #850002;
--color-spicy-900: #5e0003;
--color-spicy-950: #400000;
}SCSS
$spicy: #ff1111;
$spicy-rgb: 255, 17, 17;
$spicy-light: mix(#fff, $spicy, 20%);
$spicy-dark: mix(#000, $spicy, 20%);
.element {
color: $spicy;
box-shadow: 0 0 0 2px rgba($spicy, 0.35);
}