Couleur nommée · #BB3333
Pesto Rosso
Pesto Rosso correspond à #BB3333 : rgb(187 51 51), hsl(0 57% 47%), oklch(0.53 0.173 25.3). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Red mean? → · Pesto Rosso color name →
#BB3333
oklch(0.53 0.173 25.3)
Conversions de couleur
- HEX
- #bb3333
- RGB
- rgb(187 51 51)
- HSL
- hsl(0 57% 47%)
- HWB
- hwb(0 20% 27%)
- OKLCH
- oklch(0.53 0.173 25.3)
- OKLab
- oklab(0.53 0.156 0.074)
- CIE Lab
- lab(43.7 54.63 34)
- LCH
- lch(43.7 64.35 31.9)
- CMYK
- cmyk(0% 73% 73% 27%)
Teintes · Ombres · Tons
Teintes
- C54C47
- CD615B
- D6766F
- DE8A82
- E59D96
- EBB1AB
- F1C4BF
- F6D8D4
- FBEBEA
Ombres
- A22B2B
- 8A2323
- 731C1C
- 5C1414
- 460D0D
- 320707
- 1F0303
- 0D0101
- 020000
Tons
- B73F3C
- B24944
- AD524C
- A85A54
- A3615B
- 9D6863
- 976E6A
- 907472
- 887A79
Harmonies de couleurs
Complémentaire +180°
- BB3333
Pesto Rosso
- 007A85
≈ Mediterranean Cove
Analogue -30° +30°
- BB3333
Pesto Rosso
- B33270
≈ Hibiscus
- A35300
≈ Windsor Brown
Triadique +120° +240°
- BB3333
Pesto Rosso
- 008323
≈ Poblano
- 3A62CE
≈ God of Rain
Complémentaire divisée +150° +210°
- BB3333
Pesto Rosso
- 007E69
≈ Mediaeval Forest
- 0075A3
≈ Summer Lake
Tétradique +90° +180° +270°
- BB3333
Pesto Rosso
- 6A7300
≈ Spinach Soup
- 007A85
≈ Mediterranean Cove
- 764FC3
≈ Fuchsia Blue
Contraste et accessibilité
Ag
AASur blanc
WCAG 5.77:1 · APCA Lc 78
Ag
FailSur noir
WCAG 3.63:1 · APCA Lc 24
Meilleure couleur de texte: #FFFFFF
WCAG 5.77:1 (AA) · APCA Lc 78
Contrast pairs
Extraits de code
CSS
:root {
--pesto-rosso: #bb3333;
--pesto-rosso-rgb: 187 51 51;
--pesto-rosso-oklch: oklch(0.53 0.173 25.3);
}
.element {
color: var(--pesto-rosso);
background-color: hsl(0 57% 47%);
border-color: oklch(0.53 0.173 25.3);
}Tailwind CSS v4
@theme {
--color-pesto-rosso: #bb3333;
--color-pesto-rosso-50: #ffe3da;
--color-pesto-rosso-100: #ffd2c9;
--color-pesto-rosso-200: #ffb8ac;
--color-pesto-rosso-300: #ff9386;
--color-pesto-rosso-400: #f46f68;
--color-pesto-rosso-500: #e24946;
--color-pesto-rosso-600: #bf3f3c;
--color-pesto-rosso-700: #993230;
--color-pesto-rosso-800: #732324;
--color-pesto-rosso-900: #511718;
--color-pesto-rosso-950: #360709;
}SCSS
$pesto-rosso: #bb3333;
$pesto-rosso-rgb: 187, 51, 51;
$pesto-rosso-light: mix(#fff, $pesto-rosso, 20%);
$pesto-rosso-dark: mix(#000, $pesto-rosso, 20%);
.element {
color: $pesto-rosso;
box-shadow: 0 0 0 2px rgba($pesto-rosso, 0.35);
}