En yakın adlandırılmış renk · #E20094
#E20094
En yakın adlandırılmış renk: Benevolent Pink
#E20094 (rgb(226 0 148), hsl(321 100% 44%), oklch(0.601 0.251 350.4)) en çok Benevolent Pink 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.
#E20094
oklch(0.601 0.251 350.4)
Renk dönüşümleri
- HEX
- #e20094
- RGB
- rgb(226 0 148)
- HSL
- hsl(321 100% 44%)
- HWB
- hwb(321 0% 11%)
- OKLCH
- oklch(0.601 0.251 350.4)
- OKLab
- oklab(0.601 0.247 -0.042)
- CIE Lab
- lab(50.35 78.63 -14.72)
- LCH
- lch(50.35 80 349.4)
- CMYK
- cmyk(0% 100% 35% 11%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- E83B9E
- EE58A9
- F370B3
- F787BE
- FB9CC9
- FDB0D3
- FFC4DE
- FFD8E9
- FFEBF4
Koyu tonlar
- C40080
- A8006D
- 8C005A
- 710048
- 570036
- 3E0026
- 270016
- 120008
- 030001
Gri tonlar
- DA2A92
- D23D90
- C94A8E
- C0558C
- B75E8A
- AD6688
- A36E86
- 987484
- 8D7A82
Renk uyumları
Tamamlayıcı +180°
- E20094
Benevolent Pink
- 009776
≈ Cadaverous
Analog -30° +30°
- E20094
Benevolent Pink
- BE33D9
≈ Eupatorium Purple
- EF003D
≈ Red Ribbon
Üçlü +120° +240°
- E20094
Benevolent Pink
- 858700
≈ Krypton Green
- 008CBB
≈ Hawaiian Surf
Bölünmüş tamamlayıcı +150° +210°
- E20094
Benevolent Pink
- 2A9A00
≈ Innisfree Garden
- 009299
≈ Splashy
Dörtlü +90° +180° +270°
- E20094
Benevolent Pink
- A77700
≈ Bronze
- 009776
≈ Cadaverous
- 2677FF
≈ Hailey Blue
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 4.50:1 · APCA Lc 69
Ag
AASiyah üzerinde
WCAG 4.66:1 · APCA Lc 33
En iyi metin rengi: #000000
WCAG 4.66:1 (AA) · APCA Lc 33
Contrast pairs
Kod parçacıkları
CSS
:root {
--benevolent-pink: #e20094;
--benevolent-pink-rgb: 226 0 148;
--benevolent-pink-oklch: oklch(0.601 0.251 350.4);
}
.element {
color: var(--benevolent-pink);
background-color: hsl(321 100% 44%);
border-color: oklch(0.601 0.251 350.4);
}Tailwind CSS v4
@theme {
--color-benevolent-pink: #e20094;
--color-benevolent-pink-50: #ffd8fc;
--color-benevolent-pink-100: #ffc5f0;
--color-benevolent-pink-200: #ffa5df;
--color-benevolent-pink-300: #ff78c4;
--color-benevolent-pink-400: #ff49b2;
--color-benevolent-pink-500: #f1009c;
--color-benevolent-pink-600: #cb0084;
--color-benevolent-pink-700: #a40069;
--color-benevolent-pink-800: #790051;
--color-benevolent-pink-900: #560038;
--color-benevolent-pink-950: #390023;
}SCSS
$benevolent-pink: #e20094;
$benevolent-pink-rgb: 226, 0, 148;
$benevolent-pink-light: mix(#fff, $benevolent-pink, 20%);
$benevolent-pink-dark: mix(#000, $benevolent-pink, 20%);
.element {
color: $benevolent-pink;
box-shadow: 0 0 0 2px rgba($benevolent-pink, 0.35);
}