Adlandırılmış renk · #F2A9BA
Pink Blessing
Pink Blessing, #F2A9BA: rgb(242 169 186), hsl(346 74% 81%), oklch(0.809 0.088 3.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Pink mean? → · Pink Blessing color name →
#F2A9BA
oklch(0.809 0.088 3.9)
Renk dönüşümleri
- HEX
- #f2a9ba
- RGB
- rgb(242 169 186)
- HSL
- hsl(346 74% 81%)
- HWB
- hwb(346 66% 5%)
- OKLCH
- oklch(0.809 0.088 3.9)
- OKLab
- oklab(0.809 0.088 0.006)
- CIE Lab
- lab(76.78 29.34 2.66)
- LCH
- lch(76.78 29.46 5.2)
- CMYK
- cmyk(0% 30% 23% 5%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F4B2C1
- F6BAC7
- F7C3CE
- F9CBD5
- FAD4DC
- FCDDE3
- FDE5EA
- FEEEF1
- FEF6F8
Koyu tonlar
- D292A1
- B47C89
- 966772
- 79535C
- 5E3F46
- 432C32
- 2B1B1E
- 140A0D
- 030102
Gri tonlar
- E6A5B4
- DBA1AE
- CF9DA8
- C499A2
- B9959D
- AD9197
- A28D91
- 97888B
- 8B8486
Renk uyumları
Tamamlayıcı +180°
- F2A9BA
Pink Blessing
- 7AD4C7
≈ Shore
Analog -30° +30°
- F2A9BA
Pink Blessing
- E4ACD8
≈ Pink Plunge
- F4AC9B
≈ Rosy Outlook
Üçlü +120° +240°
- F2A9BA
Pink Blessing
- B5CB8B
≈ Marsh Fern
- 8FC7F6
≈ Sail to the Sea
Bölünmüş tamamlayıcı +150° +210°
- F2A9BA
Pink Blessing
- 93D2A7
≈ Low Tide
- 79D0E3
≈ Summer Splash
Dörtlü +90° +180° +270°
- F2A9BA
Pink Blessing
- D3C07E
≈ Winter Hazel
- 7AD4C7
≈ Shore
- AEBDFA
≈ Pastel Blue
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.88:1 · APCA Lc 36
Ag
AAASiyah üzerinde
WCAG 11.15:1 · APCA Lc 67
En iyi metin rengi: #000000
WCAG 11.15:1 (AAA) · APCA Lc 67
Contrast pairs
Kod parçacıkları
CSS
:root {
--pink-blessing: #f2a9ba;
--pink-blessing-rgb: 242 169 186;
--pink-blessing-oklch: oklch(0.809 0.088 3.9);
}
.element {
color: var(--pink-blessing);
background-color: hsl(346 74% 81%);
border-color: oklch(0.809 0.088 3.9);
}Tailwind CSS v4
@theme {
--color-pink-blessing: #f2a9ba;
--color-pink-blessing-50: #ffebf1;
--color-pink-blessing-100: #ffdce3;
--color-pink-blessing-200: #f7c5ce;
--color-pink-blessing-300: #e0a5b0;
--color-pink-blessing-400: #cb8998;
--color-pink-blessing-500: #b76c7f;
--color-pink-blessing-600: #9b5c6c;
--color-pink-blessing-700: #7c4956;
--color-pink-blessing-800: #5c3540;
--color-pink-blessing-900: #40242c;
--color-pink-blessing-950: #291319;
}SCSS
$pink-blessing: #f2a9ba;
$pink-blessing-rgb: 242, 169, 186;
$pink-blessing-light: mix(#fff, $pink-blessing, 20%);
$pink-blessing-dark: mix(#000, $pink-blessing, 20%);
.element {
color: $pink-blessing;
box-shadow: 0 0 0 2px rgba($pink-blessing, 0.35);
}