En yakın adlandırılmış renk · #8857AA
#8857AA
En yakın adlandırılmış renk: Lusty Lavender
#8857AA (rgb(136 87 170), hsl(275 33% 50%), oklch(0.546 0.134 309.9)) en çok Lusty Lavender adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#8857AA
oklch(0.546 0.134 309.9)
Renk dönüşümleri
- HEX
- #8857aa
- RGB
- rgb(136 87 170)
- HSL
- hsl(275 33% 50%)
- HWB
- hwb(275 34% 33%)
- OKLCH
- oklch(0.546 0.134 309.9)
- OKLab
- oklab(0.546 0.086 -0.103)
- CIE Lab
- lab(45.29 32.58 -37.04)
- LCH
- lch(45.29 49.33 311.3)
- CMYK
- cmyk(20% 49% 0% 33%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 9368B3
- 9F78BC
- AB89C5
- B699CD
- C2AAD6
- CEBADE
- DACBE7
- E6DCEF
- F3EEF7
Koyu tonlar
- 754B93
- 633E7D
- 523368
- 412753
- 311C3F
- 22122D
- 13081B
- 06030B
- 010001
Gri tonlar
- 875CA6
- 8761A2
- 86659E
- 85699A
- 846D96
- 837192
- 83758E
- 827989
- 817C85
Renk uyumları
Tamamlayıcı +180°
- 8857AA
Lusty Lavender
- 567F1A
≈ Emerald Clear Green
Analog -30° +30°
- 8857AA
Lusty Lavender
- 6265BC
≈ Bluish Purple Anemone
- A24D89
≈ La la Lavender
Üçlü +120° +240°
- 8857AA
Lusty Lavender
- 9B6200
≈ Raw Sienna
- 00817C
≈ Blue Winged Teal
Bölünmüş tamamlayıcı +150° +210°
- 8857AA
Lusty Lavender
- 807100
≈ Sunlit Kelp Green
- 008656
≈ Pixel Nature
Dörtlü +90° +180° +270°
- 8857AA
Lusty Lavender
- AF502D
≈ Red Stage
- 567F1A
≈ Emerald Clear Green
- 007D98
≈ Pacific Pleasure
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 5.26:1 · APCA Lc 76
Ag
FailSiyah üzerinde
WCAG 3.99:1 · APCA Lc 26
En iyi metin rengi: #FFFFFF
WCAG 5.26:1 (AA) · APCA Lc 76
Contrast pairs
Kod parçacıkları
CSS
:root {
--lusty-lavender: #8857aa;
--lusty-lavender-rgb: 136 87 170;
--lusty-lavender-oklch: oklch(0.546 0.134 309.9);
}
.element {
color: var(--lusty-lavender);
background-color: hsl(275 33% 50%);
border-color: oklch(0.546 0.134 309.9);
}Tailwind CSS v4
@theme {
--color-lusty-lavender: #8857aa;
--color-lusty-lavender-50: #ffebff;
--color-lusty-lavender-100: #f7dcff;
--color-lusty-lavender-200: #e8c4fe;
--color-lusty-lavender-300: #cea3e9;
--color-lusty-lavender-400: #b787d9;
--color-lusty-lavender-500: #a16ac8;
--color-lusty-lavender-600: #885aa9;
--color-lusty-lavender-700: #6d4887;
--color-lusty-lavender-800: #4f3466;
--color-lusty-lavender-900: #372447;
--color-lusty-lavender-950: #22122f;
}SCSS
$lusty-lavender: #8857aa;
$lusty-lavender-rgb: 136, 87, 170;
$lusty-lavender-light: mix(#fff, $lusty-lavender, 20%);
$lusty-lavender-dark: mix(#000, $lusty-lavender, 20%);
.element {
color: $lusty-lavender;
box-shadow: 0 0 0 2px rgba($lusty-lavender, 0.35);
}