Benoemde kleur · #BB3333
Pesto Rosso
Pesto Rosso is #BB3333: rgb(187 51 51), hsl(0 57% 47%), oklch(0.53 0.173 25.3). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Red mean? → · Pesto Rosso color name →
#BB3333
oklch(0.53 0.173 25.3)
Kleurconversies
- 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%)
Tinten · Schaduwen · Tonen
Tinten
- C54C47
- CD615B
- D6766F
- DE8A82
- E59D96
- EBB1AB
- F1C4BF
- F6D8D4
- FBEBEA
Schaduwen
- A22B2B
- 8A2323
- 731C1C
- 5C1414
- 460D0D
- 320707
- 1F0303
- 0D0101
- 020000
Tonen
- B73F3C
- B24944
- AD524C
- A85A54
- A3615B
- 9D6863
- 976E6A
- 907472
- 887A79
Kleurharmonieën
Complementair +180°
- BB3333
Pesto Rosso
- 007A85
≈ Mediterranean Cove
Analoog -30° +30°
- BB3333
Pesto Rosso
- B33270
≈ Hibiscus
- A35300
≈ Windsor Brown
Triadisch +120° +240°
- BB3333
Pesto Rosso
- 008323
≈ Poblano
- 3A62CE
≈ God of Rain
Gesplitst complementair +150° +210°
- BB3333
Pesto Rosso
- 007E69
≈ Mediaeval Forest
- 0075A3
≈ Summer Lake
Tetradisch +90° +180° +270°
- BB3333
Pesto Rosso
- 6A7300
≈ Spinach Soup
- 007A85
≈ Mediterranean Cove
- 764FC3
≈ Fuchsia Blue
Contrast en toegankelijkheid
Ag
AAOp wit
WCAG 5.77:1 · APCA Lc 78
Ag
FailOp zwart
WCAG 3.63:1 · APCA Lc 24
Beste tekstkleur: #FFFFFF
WCAG 5.77:1 (AA) · APCA Lc 78
Contrast pairs
Codefragmenten
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);
}