Couleur nommée la plus proche · #B20000
#B20000
Couleur nommée la plus proche: All Systems Red
#B20000 (rgb(178 0 0), hsl(0 100% 35%), oklch(0.479 0.197 29.2)) est la plus proche de la couleur nommée All Systems Red. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#B20000
oklch(0.479 0.197 29.2)
Conversions de couleur
- HEX
- #b20000
- RGB
- rgb(178 0 0)
- HSL
- hsl(0 100% 35%)
- HWB
- hwb(0 0% 30%)
- OKLCH
- oklch(0.479 0.197 29.2)
- OKLab
- oklab(0.479 0.172 0.096)
- CIE Lab
- lab(37.67 61.7 53.25)
- LCH
- lch(37.67 81.5 40.8)
- CMYK
- cmyk(0% 100% 100% 30%)
Teintes · Ombres · Tons
Teintes
- BD3327
- C74E41
- D16658
- DA7D6F
- E29387
- E9A89E
- F0BEB6
- F6D4CE
- FBE9E6
Ombres
- 9A0000
- 830000
- 6D0000
- 570000
- 430000
- 2F0000
- 1D0000
- 0C0000
- 010000
Tons
- AF231A
- AC3529
- A84236
- A44D41
- A0574C
- 9B6057
- 956961
- 8F716C
- 887976
Harmonies de couleurs
Complémentaire +180°
- B20000
All Systems Red
- 006A77
≈ Mary Blue
Analogue -30° +30°
- B20000
All Systems Red
- AA005A
≈ Shy Guy Red
- 8B4B00
≈ Parasite Brown
Triadique +120° +240°
- B20000
All Systems Red
- 00712F
≈ Bogey Green
- 344CCA
≈ New Car
Complémentaire divisée +150° +210°
- B20000
All Systems Red
- 006D5F
≈ Forest Splendour
- 006493
≈ Bauhaus Blue
Tétradique +90° +180° +270°
- B20000
All Systems Red
- 576600
≈ Serrano Pepper
- 006A77
≈ Mary Blue
- 7035BA
≈ Purple Emperor
Contraste et accessibilité
Ag
AAASur blanc
WCAG 7.25:1 · APCA Lc 82
Ag
FailSur noir
WCAG 2.89:1 · APCA Lc 19
Meilleure couleur de texte: #FFFFFF
WCAG 7.25:1 (AAA) · APCA Lc 82
Contrast pairs
Extraits de code
CSS
:root {
--all-systems-red: #b20000;
--all-systems-red-rgb: 178 0 0;
--all-systems-red-oklch: oklch(0.479 0.197 29.2);
}
.element {
color: var(--all-systems-red);
background-color: hsl(0 100% 35%);
border-color: oklch(0.479 0.197 29.2);
}Tailwind CSS v4
@theme {
--color-all-systems-red: #b20000;
--color-all-systems-red-50: #ffe1d3;
--color-all-systems-red-100: #ffd0c0;
--color-all-systems-red-200: #ffb4a0;
--color-all-systems-red-300: #ff8d77;
--color-all-systems-red-400: #fd6755;
--color-all-systems-red-500: #ec392c;
--color-all-systems-red-600: #c73327;
--color-all-systems-red-700: #a0291f;
--color-all-systems-red-800: #781b18;
--color-all-systems-red-900: #55120f;
--color-all-systems-red-950: #390303;
}SCSS
$all-systems-red: #b20000;
$all-systems-red-rgb: 178, 0, 0;
$all-systems-red-light: mix(#fff, $all-systems-red, 20%);
$all-systems-red-dark: mix(#000, $all-systems-red, 20%);
.element {
color: $all-systems-red;
box-shadow: 0 0 0 2px rgba($all-systems-red, 0.35);
}