Colore con nome · #8775A1
Smashed Grape
Smashed Grape è #8775A1: rgb(135 117 161), hsl(265 19% 55%), oklch(0.595 0.069 303.1). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Purple mean? → · Smashed Grape color name →
#8775A1
oklch(0.595 0.069 303.1)
Conversioni di colore
- HEX
- #8775a1
- RGB
- rgb(135 117 161)
- HSL
- hsl(265 19% 55%)
- HWB
- hwb(265 46% 37%)
- OKLCH
- oklch(0.595 0.069 303.1)
- OKLab
- oklab(0.595 0.038 -0.058)
- CIE Lab
- lab(52.18 14.02 -21.14)
- LCH
- lch(52.18 25.37 303.5)
- CMYK
- cmyk(16% 27% 0% 37%)
Tinte · Ombre · Toni
Tinte
- 9282AA
- 9E8FB4
- A99DBD
- B5AAC6
- C1B8D0
- CDC6D9
- DAD4E3
- E6E2EC
- F2F1F5
Ombre
- 75658B
- 635576
- 514662
- 41374E
- 31293C
- 211C2A
- 130F19
- 060509
- 010101
Toni
- 86769E
- 86779B
- 857997
- 847A94
- 837B91
- 837C8E
- 827D8A
- 817E87
- 817F83
Armonie di colore
Complementare +180°
- 8775A1
Smashed Grape
- 778658
≈ Fern Canopy
Analogo -30° +30°
- 8775A1
Smashed Grape
- 717CA8
≈ Lavender Violet
- 987091
≈ Felicia
Triadico +120° +240°
- 8775A1
Smashed Grape
- 9C7653
≈ Dirt
- 4B8C83
≈ Royal Palm
Complementare divisa +150° +210°
- 8775A1
Smashed Grape
- 8D7E4E
≈ Fennel Seed
- 5E8B6B
≈ Murdoch
Tetradico +90° +180° +270°
- 8775A1
Smashed Grape
- A47064
≈ Blast-Off Bronze
- 778658
≈ Fern Canopy
- 4A8A97
≈ Blue Square
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 4.12:1 · APCA Lc 68
Ag
AASu nero
WCAG 5.08:1 · APCA Lc 33
Miglior colore del testo: #000000
WCAG 5.08:1 (AA) · APCA Lc 33
Contrast pairs
Frammenti di codice
CSS
:root {
--smashed-grape: #8775a1;
--smashed-grape-rgb: 135 117 161;
--smashed-grape-oklch: oklch(0.595 0.069 303.1);
}
.element {
color: var(--smashed-grape);
background-color: hsl(265 19% 55%);
border-color: oklch(0.595 0.069 303.1);
}Tailwind CSS v4
@theme {
--color-smashed-grape: #8775a1;
--color-smashed-grape-50: #faf1ff;
--color-smashed-grape-100: #ede3fb;
--color-smashed-grape-200: #dbcdec;
--color-smashed-grape-300: #bfafd4;
--color-smashed-grape-400: #a695c0;
--color-smashed-grape-500: #8f7bac;
--color-smashed-grape-600: #796891;
--color-smashed-grape-700: #615375;
--color-smashed-grape-800: #463d57;
--color-smashed-grape-900: #312a3d;
--color-smashed-grape-950: #1d1726;
}SCSS
$smashed-grape: #8775a1;
$smashed-grape-rgb: 135, 117, 161;
$smashed-grape-light: mix(#fff, $smashed-grape, 20%);
$smashed-grape-dark: mix(#000, $smashed-grape, 20%);
.element {
color: $smashed-grape;
box-shadow: 0 0 0 2px rgba($smashed-grape, 0.35);
}