En yakın adlandırılmış renk · #DE7E8F
#DE7E8F
En yakın adlandırılmış renk: I Love You Pink
#DE7E8F (rgb(222 126 143), hsl(349 59% 68%), oklch(0.702 0.12 9.3)) en çok I Love You 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.
#DE7E8F
oklch(0.702 0.12 9.3)
Renk dönüşümleri
- HEX
- #de7e8f
- RGB
- rgb(222 126 143)
- HSL
- hsl(349 59% 68%)
- HWB
- hwb(349 49% 13%)
- OKLCH
- oklch(0.702 0.12 9.3)
- OKLab
- oklab(0.702 0.118 0.019)
- CIE Lab
- lab(64.06 39.32 8.04)
- LCH
- lch(64.06 40.13 11.6)
- CMYK
- cmyk(0% 43% 36% 13%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- E38B9A
- E798A4
- EBA5AF
- EFB2BA
- F2BFC6
- F5CBD1
- F8D8DC
- FBE5E8
- FDF2F3
Koyu tonlar
- C16D7C
- A55C69
- 894C57
- 6F3C45
- 552D34
- 3D1F24
- 261115
- 120507
- 020101
Gri tonlar
- D57F8E
- CC7F8C
- C3808B
- BA8089
- B08188
- A78186
- 9E8185
- 948183
- 8A8082
Renk uyumları
Tamamlayıcı +180°
- DE7E8F
I Love You Pink
- 10B6AF
≈ Swagger
Analog -30° +30°
- DE7E8F
I Love You Pink
- D081B7
≈ Peruvian Lily
- DE8465
≈ Sohi Orange
Üçlü +120° +240°
- DE7E8F
I Love You Pink
- 87AE5A
≈ Parrot Green
- 60A4E6
≈ Windjammer
Bölünmüş tamamlayıcı +150° +210°
- DE7E8F
I Love You Pink
- 52B684
≈ Jade Cream
- 25B0D2
≈ Aquarius
Dörtlü +90° +180° +270°
- DE7E8F
I Love You Pink
- B1A03D
≈ Martian
- 10B6AF
≈ Swagger
- 9096E8
≈ Perrywinkle
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.80:1 · APCA Lc 54
Ag
AAASiyah üzerinde
WCAG 7.48:1 · APCA Lc 48
En iyi metin rengi: #000000
WCAG 7.48:1 (AAA) · APCA Lc 48
Contrast pairs
Kod parçacıkları
CSS
:root {
--i-love-you-pink: #de7e8f;
--i-love-you-pink-rgb: 222 126 143;
--i-love-you-pink-oklch: oklch(0.702 0.12 9.3);
}
.element {
color: var(--i-love-you-pink);
background-color: hsl(349 59% 68%);
border-color: oklch(0.702 0.12 9.3);
}Tailwind CSS v4
@theme {
--color-i-love-you-pink: #de7e8f;
--color-i-love-you-pink-50: #ffe8ec;
--color-i-love-you-pink-100: #ffd8de;
--color-i-love-you-pink-200: #ffc0c7;
--color-i-love-you-pink-300: #ed9ea8;
--color-i-love-you-pink-400: #db7f8f;
--color-i-love-you-pink-500: #c76175;
--color-i-love-you-pink-600: #a85263;
--color-i-love-you-pink-700: #87424f;
--color-i-love-you-pink-800: #642f3b;
--color-i-love-you-pink-900: #462028;
--color-i-love-you-pink-950: #2e0f16;
}SCSS
$i-love-you-pink: #de7e8f;
$i-love-you-pink-rgb: 222, 126, 143;
$i-love-you-pink-light: mix(#fff, $i-love-you-pink, 20%);
$i-love-you-pink-dark: mix(#000, $i-love-you-pink, 20%);
.element {
color: $i-love-you-pink;
box-shadow: 0 0 0 2px rgba($i-love-you-pink, 0.35);
}