En yakın adlandırılmış renk · #F5A1A9
#F5A1A9
En yakın adlandırılmış renk: Ballet Slippers
#F5A1A9 (rgb(245 161 169), hsl(354 81% 80%), oklch(0.794 0.1 13.4)) en çok Ballet Slippers 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.
#F5A1A9
oklch(0.794 0.1 13.4)
Renk dönüşümleri
- HEX
- #f5a1a9
- RGB
- rgb(245 161 169)
- HSL
- hsl(354 81% 80%)
- HWB
- hwb(354 63% 4%)
- OKLCH
- oklch(0.794 0.1 13.4)
- OKLab
- oklab(0.794 0.098 0.023)
- CIE Lab
- lab(75 32.78 9.44)
- LCH
- lch(75 34.11 16.1)
- CMYK
- cmyk(0% 34% 31% 4%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F7ABB1
- F9B4BA
- FABDC2
- FBC7CB
- FDD0D3
- FDDADC
- FEE3E5
- FFECED
- FFF6F6
Koyu tonlar
- D58B92
- B6767C
- 986267
- 7B4E53
- 5F3C3F
- 442A2C
- 2B191B
- 15090A
- 030101
Gri tonlar
- E99EA5
- DE9BA1
- D2989D
- C69498
- BB9194
- AF8E90
- A38A8C
- 988788
- 8C8484
Renk uyumları
Tamamlayıcı +180°
- F5A1A9
Ballet Slippers
- 63D0CE
≈ Petrichor
Analog -30° +30°
- F5A1A9
Ballet Slippers
- EAA2CC
≈ Elastic Pink
- F3A787
≈ Creamy Peach
Üçlü +120° +240°
- F5A1A9
Ballet Slippers
- A2CA87
≈ Whipped Pistachio
- 8EC0FB
≈ Scenic Water
Bölünmüş tamamlayıcı +150° +210°
- F5A1A9
Ballet Slippers
- 7BD0AA
≈ Crystal Gem
- 6CCAEB
≈ Spritzig
Dörtlü +90° +180° +270°
- F5A1A9
Ballet Slippers
- C7BF71
≈ Fresh Sprout
- 63D0CE
≈ Petrichor
- B3B4FB
≈ Greyish Lavender
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.98:1 · APCA Lc 38
Ag
AAASiyah üzerinde
WCAG 10.55:1 · APCA Lc 64
En iyi metin rengi: #000000
WCAG 10.55:1 (AAA) · APCA Lc 64
Contrast pairs
Kod parçacıkları
CSS
:root {
--ballet-slippers: #f5a1a9;
--ballet-slippers-rgb: 245 161 169;
--ballet-slippers-oklch: oklch(0.794 0.1 13.4);
}
.element {
color: var(--ballet-slippers);
background-color: hsl(354 81% 80%);
border-color: oklch(0.794 0.1 13.4);
}Tailwind CSS v4
@theme {
--color-ballet-slippers: #f5a1a9;
--color-ballet-slippers-50: #ffeaec;
--color-ballet-slippers-100: #ffdbdd;
--color-ballet-slippers-200: #fcc3c6;
--color-ballet-slippers-300: #e6a3a6;
--color-ballet-slippers-400: #d3858d;
--color-ballet-slippers-500: #bf6873;
--color-ballet-slippers-600: #a15961;
--color-ballet-slippers-700: #81474e;
--color-ballet-slippers-800: #603339;
--color-ballet-slippers-900: #432327;
--color-ballet-slippers-950: #2b1115;
}SCSS
$ballet-slippers: #f5a1a9;
$ballet-slippers-rgb: 245, 161, 169;
$ballet-slippers-light: mix(#fff, $ballet-slippers, 20%);
$ballet-slippers-dark: mix(#000, $ballet-slippers, 20%);
.element {
color: $ballet-slippers;
box-shadow: 0 0 0 2px rgba($ballet-slippers, 0.35);
}