En yakın adlandırılmış renk · #DF286D
#DF286D
En yakın adlandırılmış renk: Watermelon Sugar
#DF286D (rgb(223 40 109), hsl(337 74% 52%), oklch(0.596 0.218 5.2)) en çok Watermelon Sugar 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.
#DF286D
oklch(0.596 0.218 5.2)
Renk dönüşümleri
- HEX
- #df286d
- RGB
- rgb(223 40 109)
- HSL
- hsl(337 74% 52%)
- HWB
- hwb(337 16% 13%)
- OKLCH
- oklch(0.596 0.218 5.2)
- OKLab
- oklab(0.596 0.217 0.02)
- CIE Lab
- lab(50.53 70.51 9.08)
- LCH
- lch(50.53 71.1 7.3)
- CMYK
- cmyk(0% 82% 51% 13%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- E6487B
- EB6188
- F17796
- F58BA5
- F99FB3
- FCB3C2
- FEC6D1
- FFD9E0
- FFECEF
Koyu tonlar
- C2215E
- A51B4F
- 8A1541
- 6F0F33
- 560926
- 3D0419
- 27020D
- 120104
- 020001
Gri tonlar
- D73A6F
- CF4771
- C75173
- BE5A75
- B56277
- AC6978
- A2707A
- 97757C
- 8C7B7E
Renk uyumları
Tamamlayıcı +180°
- DF286D
Watermelon Sugar
- 009387
≈ Old Benchmark
Analog -30° +30°
- DF286D
Watermelon Sugar
- C739B1
≈ Purple Pink
- DF3A00
≈ Flame of Prometheus
Üçlü +120° +240°
- DF286D
Watermelon Sugar
- 6A8D00
≈ Asparagus Sultan
- 0085D2
≈ Calgar Blue
Bölünmüş tamamlayıcı +150° +210°
- DF286D
Watermelon Sugar
- 009857
≈ Garnish
- 008EA6
≈ Parrot Flight
Dörtlü +90° +180° +270°
- DF286D
Watermelon Sugar
- 967D00
≈ Moscow Papyrus
- 009387
≈ Old Benchmark
- 6068FD
≈ Blue Genie
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 4.50:1 · APCA Lc 70
Ag
AASiyah üzerinde
WCAG 4.66:1 · APCA Lc 32
En iyi metin rengi: #000000
WCAG 4.66:1 (AA) · APCA Lc 32
Contrast pairs
Kod parçacıkları
CSS
:root {
--watermelon-sugar: #df286d;
--watermelon-sugar-rgb: 223 40 109;
--watermelon-sugar-oklch: oklch(0.596 0.218 5.2);
}
.element {
color: var(--watermelon-sugar);
background-color: hsl(337 74% 52%);
border-color: oklch(0.596 0.218 5.2);
}Tailwind CSS v4
@theme {
--color-watermelon-sugar: #df286d;
--color-watermelon-sugar-50: #ffdcea;
--color-watermelon-sugar-100: #ffcadb;
--color-watermelon-sugar-200: #ffabc4;
--color-watermelon-sugar-300: #ff82a4;
--color-watermelon-sugar-400: #ff588d;
--color-watermelon-sugar-500: #f01a72;
--color-watermelon-sugar-600: #ca1c61;
--color-watermelon-sugar-700: #a3184d;
--color-watermelon-sugar-800: #790e3b;
--color-watermelon-sugar-900: #560a28;
--color-watermelon-sugar-950: #390016;
}SCSS
$watermelon-sugar: #df286d;
$watermelon-sugar-rgb: 223, 40, 109;
$watermelon-sugar-light: mix(#fff, $watermelon-sugar, 20%);
$watermelon-sugar-dark: mix(#000, $watermelon-sugar, 20%);
.element {
color: $watermelon-sugar;
box-shadow: 0 0 0 2px rgba($watermelon-sugar, 0.35);
}