Adlandırılmış renk · #F5D8BB
Unbleached Calico
Unbleached Calico, #F5D8BB: rgb(245 216 187), hsl(30 74% 85%), oklch(0.899 0.05 67.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Unbleached Calico color name →
#F5D8BB
oklch(0.899 0.05 67.1)
Renk dönüşümleri
- HEX
- #f5d8bb
- RGB
- rgb(245 216 187)
- HSL
- hsl(30 74% 85%)
- HWB
- hwb(30 73% 4%)
- OKLCH
- oklch(0.899 0.05 67.1)
- OKLab
- oklab(0.899 0.02 0.046)
- CIE Lab
- lab(88.24 7.18 18.24)
- LCH
- lch(88.24 19.61 68.5)
- CMYK
- cmyk(0% 12% 24% 4%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F6DCC2
- F7E0C9
- F8E4CF
- F9E8D6
- FAECDD
- FBEFE4
- FCF3EB
- FDF7F1
- FEFBF8
Koyu tonlar
- D5BCA2
- B6A08A
- 988573
- 7B6B5C
- 5F5346
- 443B32
- 2B251F
- 15110D
- 030202
Gri tonlar
- E9CFB5
- DDC6AF
- D1BDA9
- C5B4A3
- B9AB9D
- ADA297
- A29A92
- 96918C
- 8B8886
Renk uyumları
Tamamlayıcı +180°
- F5D8BB
Unbleached Calico
- C4E2FE
≈ Fresh Water
Analog -30° +30°
- F5D8BB
Unbleached Calico
- FDD3C6
≈ Salmon Mousse
- E7DEB9
≈ Jodhpurs
Üçlü +120° +240°
- F5D8BB
Unbleached Calico
- B9E9E3
≈ Tahitian Breeze
- E6D6F8
≈ Lavender Princess
Bölünmüş tamamlayıcı +150° +210°
- F5D8BB
Unbleached Calico
- B9E7F4
≈ First of July
- D5DBFF
≈ Icy Plains
Dörtlü +90° +180° +270°
- F5D8BB
Unbleached Calico
- C3E8D1
≈ Martian Moon
- C4E2FE
≈ Fresh Water
- F5D2EA
≈ Little Smile
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.36:1 · APCA Lc 18
Ag
AAASiyah üzerinde
WCAG 15.42:1 · APCA Lc 86
En iyi metin rengi: #000000
WCAG 15.42:1 (AAA) · APCA Lc 86
Contrast pairs
Kod parçacıkları
CSS
:root {
--unbleached-calico: #f5d8bb;
--unbleached-calico-rgb: 245 216 187;
--unbleached-calico-oklch: oklch(0.899 0.05 67.1);
}
.element {
color: var(--unbleached-calico);
background-color: hsl(30 74% 85%);
border-color: oklch(0.899 0.05 67.1);
}Tailwind CSS v4
@theme {
--color-unbleached-calico: #f5d8bb;
--color-unbleached-calico-50: #fff3e6;
--color-unbleached-calico-100: #f3e5d6;
--color-unbleached-calico-200: #e3d1be;
--color-unbleached-calico-300: #c9b39c;
--color-unbleached-calico-400: #b3997f;
--color-unbleached-calico-500: #9d8062;
--color-unbleached-calico-600: #856c54;
--color-unbleached-calico-700: #6a5743;
--color-unbleached-calico-800: #4f3f30;
--color-unbleached-calico-900: #372b21;
--color-unbleached-calico-950: #221910;
}SCSS
$unbleached-calico: #f5d8bb;
$unbleached-calico-rgb: 245, 216, 187;
$unbleached-calico-light: mix(#fff, $unbleached-calico, 20%);
$unbleached-calico-dark: mix(#000, $unbleached-calico, 20%);
.element {
color: $unbleached-calico;
box-shadow: 0 0 0 2px rgba($unbleached-calico, 0.35);
}