Adlandırılmış renk · #E57681
Passion Pink
Passion Pink, #E57681: rgb(229 118 129), hsl(354 68% 68%), oklch(0.695 0.138 15.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Red mean? → · Passion Pink color name →
#E57681
oklch(0.695 0.138 15.1)
Renk dönüşümleri
- HEX
- #e57681
- RGB
- rgb(229 118 129)
- HSL
- hsl(354 68% 68%)
- HWB
- hwb(354 46% 10%)
- OKLCH
- oklch(0.695 0.138 15.1)
- OKLab
- oklab(0.695 0.133 0.036)
- CIE Lab
- lab(63.14 44.66 14.88)
- LCH
- lch(63.14 47.07 18.4)
- CMYK
- cmyk(0% 48% 44% 10%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- E9848D
- ED9299
- F1A0A5
- F4AEB2
- F7BBBE
- F9C9CB
- FBD6D8
- FDE4E5
- FEF1F2
Koyu tonlar
- C7666F
- AA565E
- 8E474E
- 72383E
- 58292E
- 3F1C1F
- 280F12
- 120506
- 030101
Gri tonlar
- DB7881
- D27A81
- C87B81
- BE7C81
- B47D81
- AA7E81
- A07F81
- 967F80
- 8B8080
Renk uyumları
Tamamlayıcı +180°
- E57681
Passion Pink
- 00B3B4
≈ Cyan Sky
Analog -30° +30°
- E57681
Passion Pink
- D878B0
≈ Ice Plant
- E27F4F
≈ Solar Flare
Üçlü +120° +240°
- E57681
Passion Pink
- 76B054
≈ Lost Golfer
- 5F9FF0
≈ Feather Star
Bölünmüş tamamlayıcı +150° +210°
- E57681
Passion Pink
- 25B788
≈ Green Velour
- 00ADDA
≈ Bright Cerulean
Dörtlü +90° +180° +270°
- E57681
Passion Pink
- AAA123
≈ Venom
- 00B3B4
≈ Cyan Sky
- 958FEE
≈ Perrywinkle
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.90:1 · APCA Lc 55
Ag
AAASiyah üzerinde
WCAG 7.23:1 · APCA Lc 47
En iyi metin rengi: #000000
WCAG 7.23:1 (AAA) · APCA Lc 47
Contrast pairs
Kod parçacıkları
CSS
:root {
--passion-pink: #e57681;
--passion-pink-rgb: 229 118 129;
--passion-pink-oklch: oklch(0.695 0.138 15.1);
}
.element {
color: var(--passion-pink);
background-color: hsl(354 68% 68%);
border-color: oklch(0.695 0.138 15.1);
}Tailwind CSS v4
@theme {
--color-passion-pink: #e57681;
--color-passion-pink-50: #ffe6e7;
--color-passion-pink-100: #ffd6d7;
--color-passion-pink-200: #ffbdbf;
--color-passion-pink-300: #f69a9e;
--color-passion-pink-400: #e47a84;
--color-passion-pink-500: #d15968;
--color-passion-pink-600: #b04c58;
--color-passion-pink-700: #8e3d46;
--color-passion-pink-800: #692b34;
--color-passion-pink-900: #4a1d24;
--color-passion-pink-950: #300d13;
}SCSS
$passion-pink: #e57681;
$passion-pink-rgb: 229, 118, 129;
$passion-pink-light: mix(#fff, $passion-pink, 20%);
$passion-pink-dark: mix(#000, $passion-pink, 20%);
.element {
color: $passion-pink;
box-shadow: 0 0 0 2px rgba($passion-pink, 0.35);
}