En yakın adlandırılmış renk · #DF1A8A
#DF1A8A
En yakın adlandırılmış renk: Benevolent Pink
#DF1A8A (rgb(223 26 138), hsl(326 79% 49%), oklch(0.599 0.236 353.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.
#DF1A8A
oklch(0.599 0.236 353.7)
Renk dönüşümleri
- HEX
- #df1a8a
- RGB
- rgb(223 26 138)
- HSL
- hsl(326 79% 49%)
- HWB
- hwb(326 10% 13%)
- OKLCH
- oklch(0.599 0.236 353.7)
- OKLab
- oklab(0.599 0.234 -0.026)
- CIE Lab
- lab(50.33 74.81 -8.81)
- LCH
- lch(50.33 75.33 353.3)
- CMYK
- cmyk(0% 88% 38% 13%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- E64295
- EB5CA0
- F173AC
- F589B7
- F99DC3
- FCB1CF
- FEC5DB
- FFD8E7
- FFECF3
Koyu tonlar
- C21577
- A51065
- 8A0C53
- 6F0742
- 560432
- 3D0222
- 270114
- 120007
- 020001
Gri tonlar
- D73289
- CF4288
- C74E87
- BE5786
- B56085
- AC6884
- A26E83
- 977582
- 8C7B81
Renk uyumları
Tamamlayıcı +180°
- DF1A8A
Benevolent Pink
- 00957A
≈ Pool Table
Analog -30° +30°
- DF1A8A
Benevolent Pink
- BF38CD
≈ Ultraviolet Berl
- EC1331
≈ Transfusion
Üçlü +120° +240°
- DF1A8A
Benevolent Pink
- 808800
≈ Krypton Green
- 008BBE
≈ Hawaiian Surf
Bölünmüş tamamlayıcı +150° +210°
- DF1A8A
Benevolent Pink
- 009B1B
≈ Green Gardens
- 00919B
≈ Peacock Feather
Dörtlü +90° +180° +270°
- DF1A8A
Benevolent Pink
- A27800
≈ Nataneyu Gold
- 00957A
≈ Pool Table
- 3873FF
≈ Hailey Blue
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 4.51:1 · APCA Lc 69
Ag
AASiyah üzerinde
WCAG 4.65:1 · APCA Lc 32
En iyi metin rengi: #000000
WCAG 4.65:1 (AA) · APCA Lc 32
Contrast pairs
Kod parçacıkları
CSS
:root {
--benevolent-pink: #df1a8a;
--benevolent-pink-rgb: 223 26 138;
--benevolent-pink-oklch: oklch(0.599 0.236 353.7);
}
.element {
color: var(--benevolent-pink);
background-color: hsl(326 79% 49%);
border-color: oklch(0.599 0.236 353.7);
}Tailwind CSS v4
@theme {
--color-benevolent-pink: #df1a8a;
--color-benevolent-pink-50: #ffd9f8;
--color-benevolent-pink-100: #ffc7eb;
--color-benevolent-pink-200: #ffa8d8;
--color-benevolent-pink-300: #ff7dbc;
--color-benevolent-pink-400: #ff51a9;
--color-benevolent-pink-500: #ef0091;
--color-benevolent-pink-600: #ca077b;
--color-benevolent-pink-700: #a20a62;
--color-benevolent-pink-800: #78054b;
--color-benevolent-pink-900: #550534;
--color-benevolent-pink-950: #390020;
}SCSS
$benevolent-pink: #df1a8a;
$benevolent-pink-rgb: 223, 26, 138;
$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);
}