Colore con nome · #9437FF
Sugar Grape
Sugar Grape è #9437FF: rgb(148 55 255), hsl(268 100% 61%), oklch(0.579 0.269 298.3). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Purple mean? → · Sugar Grape color name →
#9437FF
oklch(0.579 0.269 298.3)
Conversioni di colore
- HEX
- #9437ff
- RGB
- rgb(148 55 255)
- HSL
- hsl(268 100% 61%)
- HWB
- hwb(268 22% 0%)
- OKLCH
- oklch(0.579 0.269 298.3)
- OKLab
- oklab(0.579 0.128 -0.237)
- CIE Lab
- lab(46.16 65.86 -84.11)
- LCH
- lch(46.16 106.83 308.1)
- CMYK
- cmyk(42% 78% 0% 0%)
Tinte · Ombre · Toni
Tinte
- 9D54FF
- A76CFF
- B181FF
- BB94FF
- C6A7FF
- D0B9FF
- DCCBFF
- E7DCFF
- F3EEFF
Ombre
- 802EDE
- 6D26BE
- 5A1E9E
- 481680
- 360F63
- 260848
- 16032E
- 080116
- 010003
Toni
- 9146F3
- 8F51E7
- 8C5BDA
- 8A62CE
- 8869C2
- 866FB5
- 8474A8
- 83789B
- 817C8E
Armonie di colore
Complementare +180°
- 9437FF
Sugar Grape
- 738400
≈ Swamp Green
Analogo -30° +30°
- 9437FF
Sugar Grape
- 4466FF
≈ Blue Titmouse
- C600C6
≈ Screaming Magenta
Triadico +120° +240°
- 9437FF
Sugar Grape
- B56100
≈ Orangish Brown
- 008E7A
≈ Greenlake
Complementare divisa +150° +210°
- 9437FF
Sugar Grape
- 977500
≈ Mesozoic Green
- 00933B
≈ Pixelated Grass
Tetradico +90° +180° +270°
- 9437FF
Sugar Grape
- E5000D
≈ Miyamoto Red
- 738400
≈ Swamp Green
- 008A99
≈ Atlantic Blue
Contrasto e accessibilità
Ag
AASu bianco
WCAG 4.94:1 · APCA Lc 73
Ag
FailSu nero
WCAG 4.24:1 · APCA Lc 29
Miglior colore del testo: #FFFFFF
WCAG 4.94:1 (AA) · APCA Lc 73
Contrast pairs
Frammenti di codice
CSS
:root {
--sugar-grape: #9437ff;
--sugar-grape-rgb: 148 55 255;
--sugar-grape-oklch: oklch(0.579 0.269 298.3);
}
.element {
color: var(--sugar-grape);
background-color: hsl(268 100% 61%);
border-color: oklch(0.579 0.269 298.3);
}Tailwind CSS v4
@theme {
--color-sugar-grape: #9437ff;
--color-sugar-grape-50: #ffe4ff;
--color-sugar-grape-100: #f6d3ff;
--color-sugar-grape-200: #e7b7ff;
--color-sugar-grape-300: #cf90ff;
--color-sugar-grape-400: #b66bff;
--color-sugar-grape-500: #a338ff;
--color-sugar-grape-600: #8a33ee;
--color-sugar-grape-700: #6e29c0;
--color-sugar-grape-800: #4f1d92;
--color-sugar-grape-900: #371467;
--color-sugar-grape-950: #220248;
}SCSS
$sugar-grape: #9437ff;
$sugar-grape-rgb: 148, 55, 255;
$sugar-grape-light: mix(#fff, $sugar-grape, 20%);
$sugar-grape-dark: mix(#000, $sugar-grape, 20%);
.element {
color: $sugar-grape;
box-shadow: 0 0 0 2px rgba($sugar-grape, 0.35);
}