En yakın adlandırılmış renk · #D6258E
#D6258E
En yakın adlandırılmış renk: Benevolent Pink
#D6258E (rgb(214 37 142), hsl(324 71% 49%), oklch(0.59 0.225 350.7)) 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.
#D6258E
oklch(0.59 0.225 350.7)
Renk dönüşümleri
- HEX
- #d6258e
- RGB
- rgb(214 37 142)
- HSL
- hsl(324 71% 49%)
- HWB
- hwb(324 15% 16%)
- OKLCH
- oklch(0.59 0.225 350.7)
- OKLab
- oklab(0.59 0.222 -0.036)
- CIE Lab
- lab(49.41 70.97 -12.82)
- LCH
- lch(49.41 72.12 349.8)
- CMYK
- cmyk(0% 83% 34% 16%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- DD4699
- E45FA4
- EA75AF
- EF8ABA
- F39EC5
- F7B1D1
- FAC5DC
- FDD8E8
- FEECF3
Koyu tonlar
- BA1F7B
- 9E1968
- 841356
- 6A0D44
- 520834
- 3B0424
- 250215
- 100007
- 020001
Gri tonlar
- CF388D
- C8458B
- C0508A
- B85989
- B06187
- A86886
- 9F6F84
- 957583
- 8B7B81
Renk uyumları
Tamamlayıcı +180°
- D6258E
Benevolent Pink
- 009374
≈ Dòu Lǜ Green
Analog -30° +30°
- D6258E
Benevolent Pink
- B53ECC
≈ Ultraviolet Berl
- E41D3E
≈ Neon Romance
Üçlü +120° +240°
- D6258E
Benevolent Pink
- 828300
≈ Drably Olive
- 0089B6
≈ Spinnaker Blue
Bölünmüş tamamlayıcı +150° +210°
- D6258E
Benevolent Pink
- 259700
≈ Innisfree Garden
- 008F95
≈ Christina Brown
Dörtlü +90° +180° +270°
- D6258E
Benevolent Pink
- A27400
≈ Barbarian Leather
- 009374
≈ Dòu Lǜ Green
- 1F72FF
≈ Magic Fountain
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 4.65:1 · APCA Lc 71
Ag
AASiyah üzerinde
WCAG 4.51:1 · APCA Lc 31
En iyi metin rengi: #FFFFFF
WCAG 4.65:1 (AA) · APCA Lc 71
Contrast pairs
Kod parçacıkları
CSS
:root {
--benevolent-pink: #d6258e;
--benevolent-pink-rgb: 214 37 142;
--benevolent-pink-oklch: oklch(0.59 0.225 350.7);
}
.element {
color: var(--benevolent-pink);
background-color: hsl(324 71% 49%);
border-color: oklch(0.59 0.225 350.7);
}Tailwind CSS v4
@theme {
--color-benevolent-pink: #d6258e;
--color-benevolent-pink-50: #ffdbfb;
--color-benevolent-pink-100: #ffc9ef;
--color-benevolent-pink-200: #ffaadd;
--color-benevolent-pink-300: #ff81c2;
--color-benevolent-pink-400: #fa58af;
--color-benevolent-pink-500: #e81a99;
--color-benevolent-pink-600: #c41c81;
--color-benevolent-pink-700: #9e1867;
--color-benevolent-pink-800: #750f4f;
--color-benevolent-pink-900: #530a37;
--color-benevolent-pink-950: #370022;
}SCSS
$benevolent-pink: #d6258e;
$benevolent-pink-rgb: 214, 37, 142;
$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);
}