Colore con nome · #5533CC
Grape Hyacinth
Grape Hyacinth è #5533CC: rgb(85 51 204), hsl(253 60% 50%), oklch(0.466 0.219 284.2). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Grape Hyacinth color name →
#5533CC
oklch(0.466 0.219 284.2)
Conversioni di colore
- HEX
- #5533cc
- RGB
- rgb(85 51 204)
- HSL
- hsl(253 60% 50%)
- HWB
- hwb(253 20% 20%)
- OKLCH
- oklch(0.466 0.219 284.2)
- OKLab
- oklab(0.466 0.054 -0.212)
- CIE Lab
- lab(34.1 46.08 -75.28)
- LCH
- lch(34.1 88.26 301.5)
- CMYK
- cmyk(58% 75% 0% 20%)
Tinte · Ombre · Toni
Tinte
- 624DD3
- 7063DA
- 7F78E0
- 8F8CE6
- A09FEB
- B2B2F0
- C5C5F5
- D8D9F9
- EBECFC
Ombre
- 492BB1
- 3D2397
- 311C7E
- 261465
- 1C0D4E
- 110737
- 080322
- 02010F
- 000002
Toni
- 5740C5
- 5A4ABF
- 5E53B8
- 625BB1
- 6662A9
- 6B69A2
- 6F6F9A
- 757592
- 7A7B89
Armonie di colore
Complementare +180°
- 5533CC
Grape Hyacinth
- 635C00
≈ Brussels Sprout Green
Analogo -30° +30°
- 5533CC
Grape Hyacinth
- 0058AA
≈ Raiden Blue
- 8413AC
≈ Shade of Violet
Triadico +120° +240°
- 5533CC
Grape Hyacinth
- 943900
≈ Citrine Brown
- 006B4B
≈ Device Green
Complementare divisa +150° +210°
- 5533CC
Grape Hyacinth
- 7A5000
≈ Lucky Brown
- 376900
≈ Tatzelwurm Green
Tetradico +90° +180° +270°
- 5533CC
Grape Hyacinth
- A80038
≈ Hot Lava
- 635C00
≈ Brussels Sprout Green
- 006767
≈ Teal Beak
Contrasto e accessibilità
Ag
AAASu bianco
WCAG 7.68:1 · APCA Lc 86
Ag
FailSu nero
WCAG 2.73:1 · APCA Lc 16
Miglior colore del testo: #FFFFFF
WCAG 7.68:1 (AAA) · APCA Lc 86
Contrast pairs
Frammenti di codice
CSS
:root {
--grape-hyacinth: #5533cc;
--grape-hyacinth-rgb: 85 51 204;
--grape-hyacinth-oklch: oklch(0.466 0.219 284.2);
}
.element {
color: var(--grape-hyacinth);
background-color: hsl(253 60% 50%);
border-color: oklch(0.466 0.219 284.2);
}Tailwind CSS v4
@theme {
--color-grape-hyacinth: #5533cc;
--color-grape-hyacinth-50: #efedff;
--color-grape-hyacinth-100: #e1deff;
--color-grape-hyacinth-200: #cdc6ff;
--color-grape-hyacinth-300: #b0a3ff;
--color-grape-hyacinth-400: #9385ff;
--color-grape-hyacinth-500: #7d62ff;
--color-grape-hyacinth-600: #6a54e3;
--color-grape-hyacinth-700: #5443b7;
--color-grape-hyacinth-800: #3b318a;
--color-grape-hyacinth-900: #282262;
--color-grape-hyacinth-950: #170f43;
}SCSS
$grape-hyacinth: #5533cc;
$grape-hyacinth-rgb: 85, 51, 204;
$grape-hyacinth-light: mix(#fff, $grape-hyacinth, 20%);
$grape-hyacinth-dark: mix(#000, $grape-hyacinth, 20%);
.element {
color: $grape-hyacinth;
box-shadow: 0 0 0 2px rgba($grape-hyacinth, 0.35);
}