En yakın adlandırılmış renk · #AB5890
#AB5890
En yakın adlandırılmış renk: Purple Zergling
#AB5890 (rgb(171 88 144), hsl(320 33% 51%), oklch(0.578 0.129 341)) en çok Purple Zergling 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.
#AB5890
oklch(0.578 0.129 341)
Renk dönüşümleri
- HEX
- #ab5890
- RGB
- rgb(171 88 144)
- HSL
- hsl(320 33% 51%)
- HWB
- hwb(320 35% 33%)
- OKLCH
- oklch(0.578 0.129 341)
- OKLab
- oklab(0.578 0.122 -0.042)
- CIE Lab
- lab(49.19 39.98 -15.21)
- LCH
- lch(49.19 42.78 339.2)
- CMYK
- cmyk(0% 49% 16% 33%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- B4699B
- BE79A6
- C68AB0
- CF9ABB
- D8AAC6
- E0BBD2
- E8CCDD
- F0DDE8
- F8EEF4
Koyu tonlar
- 944B7D
- 7E3F6A
- 683357
- 542845
- 401D34
- 2D1224
- 1B0915
- 0B0307
- 010001
Gri tonlar
- A75D8F
- A4618D
- A0668B
- 9C6A8A
- 986E88
- 937287
- 8F7685
- 8A7983
- 857D82
Renk uyumları
Tamamlayıcı +180°
- AB5890
Purple Zergling
- 009060
≈ Emerald Lake
Analog -30° +30°
- AB5890
Purple Zergling
- 9261B1
≈ Lusty Lavender
- B85567
≈ Tulip Red
Üçlü +120° +240°
- AB5890
Purple Zergling
- 897B00
≈ Moscow Papyrus
- 0087A5
≈ Caribbean Sea
Bölünmüş tamamlayıcı +150° +210°
- AB5890
Purple Zergling
- 5E882E
≈ Fresh Onion
- 008C88
≈ Greenish Blue
Dörtlü +90° +180° +270°
- AB5890
Purple Zergling
- A76B00
≈ Buckthorn Brown
- 009060
≈ Emerald Lake
- 377DC2
≈ Tufts Blue
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 4.63:1 · APCA Lc 72
Ag
AASiyah üzerinde
WCAG 4.53:1 · APCA Lc 30
En iyi metin rengi: #FFFFFF
WCAG 4.63:1 (AA) · APCA Lc 72
Contrast pairs
Kod parçacıkları
CSS
:root {
--purple-zergling: #ab5890;
--purple-zergling-rgb: 171 88 144;
--purple-zergling-oklch: oklch(0.578 0.129 341);
}
.element {
color: var(--purple-zergling);
background-color: hsl(320 33% 51%);
border-color: oklch(0.578 0.129 341);
}Tailwind CSS v4
@theme {
--color-purple-zergling: #ab5890;
--color-purple-zergling-50: #ffe7ff;
--color-purple-zergling-100: #ffd8f3;
--color-purple-zergling-200: #fcbfe3;
--color-purple-zergling-300: #e69dc9;
--color-purple-zergling-400: #d17fb5;
--color-purple-zergling-500: #bd609f;
--color-purple-zergling-600: #a05287;
--color-purple-zergling-700: #80416c;
--color-purple-zergling-800: #5f2f51;
--color-purple-zergling-900: #422038;
--color-purple-zergling-950: #2a0f23;
}SCSS
$purple-zergling: #ab5890;
$purple-zergling-rgb: 171, 88, 144;
$purple-zergling-light: mix(#fff, $purple-zergling, 20%);
$purple-zergling-dark: mix(#000, $purple-zergling, 20%);
.element {
color: $purple-zergling;
box-shadow: 0 0 0 2px rgba($purple-zergling, 0.35);
}