Adlandırılmış renk · #F5B1A2
First Date
First Date, #F5B1A2: rgb(245 177 162), hsl(11 81% 80%), oklch(0.82 0.083 32.8). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Pink mean? → · First Date color name →
#F5B1A2
oklch(0.82 0.083 32.8)
Renk dönüşümleri
- HEX
- #f5b1a2
- RGB
- rgb(245 177 162)
- HSL
- hsl(11 81% 80%)
- HWB
- hwb(11 64% 4%)
- OKLCH
- oklch(0.82 0.083 32.8)
- OKLab
- oklab(0.82 0.07 0.045)
- CIE Lab
- lab(78.48 24.14 18.05)
- LCH
- lch(78.48 30.14 36.8)
- CMYK
- cmyk(0% 28% 34% 4%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F7B9AB
- F8C1B4
- F9C8BE
- FBD0C7
- FCD8D0
- FDE0D9
- FDE8E3
- FEEFEC
- FFF7F6
Koyu tonlar
- D5998C
- B68377
- 986C63
- 7B574F
- 5F423C
- 442F2A
- 2B1C19
- 150C0A
- 030101
Gri tonlar
- E9AC9F
- DDA79B
- D1A298
- C69E95
- BA9991
- AE948E
- A38F8A
- 978A87
- 8C8583
Renk uyumları
Tamamlayıcı +180°
- F5B1A2
First Date
- 82D3E4
≈ Middle Blue
Analog -30° +30°
- F5B1A2
First Date
- F3AEBF
≈ Baby Fish Mouth
- EBB98C
≈ Gold Vessel
Üçlü +120° +240°
- F5B1A2
First Date
- 9BD4AB
≈ Chinook
- B2C1FB
≈ Dried Lilac
Bölünmüş tamamlayıcı +150° +210°
- F5B1A2
First Date
- 84D6C9
≈ Shore
- 95CBF6
≈ Honolulu
Dörtlü +90° +180° +270°
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.79:1 · APCA Lc 33
Ag
AAASiyah üzerinde
WCAG 11.69:1 · APCA Lc 69
En iyi metin rengi: #000000
WCAG 11.69:1 (AAA) · APCA Lc 69
Contrast pairs
Kod parçacıkları
CSS
:root {
--first-date: #f5b1a2;
--first-date-rgb: 245 177 162;
--first-date-oklch: oklch(0.82 0.083 32.8);
}
.element {
color: var(--first-date);
background-color: hsl(11 81% 80%);
border-color: oklch(0.82 0.083 32.8);
}Tailwind CSS v4
@theme {
--color-first-date: #f5b1a2;
--color-first-date-50: #ffede5;
--color-first-date-100: #ffdfd6;
--color-first-date-200: #f5c8bd;
--color-first-date-300: #dea99b;
--color-first-date-400: #cb8d7f;
--color-first-date-500: #b67162;
--color-first-date-600: #9a6054;
--color-first-date-700: #7c4d43;
--color-first-date-800: #5c3731;
--color-first-date-900: #402621;
--color-first-date-950: #291410;
}SCSS
$first-date: #f5b1a2;
$first-date-rgb: 245, 177, 162;
$first-date-light: mix(#fff, $first-date, 20%);
$first-date-dark: mix(#000, $first-date, 20%);
.element {
color: $first-date;
box-shadow: 0 0 0 2px rgba($first-date, 0.35);
}