Adlandırılmış renk · #F0E2CF
Coconut Cream Pie
Coconut Cream Pie, #F0E2CF: rgb(240 226 207), hsl(35 52% 88%), oklch(0.919 0.03 75.7). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Coconut Cream Pie color name →
#F0E2CF
oklch(0.919 0.03 75.7)
Renk dönüşümleri
- HEX
- #f0e2cf
- RGB
- rgb(240 226 207)
- HSL
- hsl(35 52% 88%)
- HWB
- hwb(35 81% 6%)
- OKLCH
- oklch(0.919 0.03 75.7)
- OKLab
- oklab(0.919 0.007 0.029)
- CIE Lab
- lab(90.64 2.64 11.13)
- LCH
- lch(90.64 11.44 76.6)
- CMYK
- cmyk(0% 6% 14% 6%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F2E5D4
- F3E8D9
- F5EBDD
- F6EEE2
- F8F0E7
- F9F3EC
- FBF6F1
- FCF9F5
- FEFCFA
Koyu tonlar
- D1C4B4
- B2A899
- 958C7F
- 787167
- 5D574F
- 433E38
- 2A2723
- 141210
- 030302
Gri tonlar
- E4D8C7
- D9CEBF
- CDC4B7
- C2BAAF
- B6B0A7
- ABA69F
- A09C97
- 95938F
- 8B8988
Renk uyumları
Tamamlayıcı +180°
- F0E2CF
Coconut Cream Pie
- D8E6F8
≈ Icicle Veil
Analog -30° +30°
- F0E2CF
Coconut Cream Pie
- F6DFD4
≈ Summer Blush
- E6E6D0
≈ Light Fern Green
Üçlü +120° +240°
- F0E2CF
Coconut Cream Pie
- CFEBEA
≈ Mint Chip
- ECDFF2
≈ Divine Dove
Bölünmüş tamamlayıcı +150° +210°
- F0E2CF
Coconut Cream Pie
- D0E9F3
≈ On Thin Ice
- E2E2F8
≈ Lavender Mist
Dörtlü +90° +180° +270°
- F0E2CF
Coconut Cream Pie
- D3EBE0
≈ Icy Glacier
- D8E6F8
≈ Icicle Veil
- F4DDE8
≈ Ranunculus White
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.27:1 · APCA Lc 14
Ag
AAASiyah üzerinde
WCAG 16.48:1 · APCA Lc 90
En iyi metin rengi: #000000
WCAG 16.48:1 (AAA) · APCA Lc 90
Contrast pairs
Kod parçacıkları
CSS
:root {
--coconut-cream-pie: #f0e2cf;
--coconut-cream-pie-rgb: 240 226 207;
--coconut-cream-pie-oklch: oklch(0.919 0.03 75.7);
}
.element {
color: var(--coconut-cream-pie);
background-color: hsl(35 52% 88%);
border-color: oklch(0.919 0.03 75.7);
}Tailwind CSS v4
@theme {
--color-coconut-cream-pie: #f0e2cf;
--color-coconut-cream-pie-50: #faf4ec;
--color-coconut-cream-pie-100: #ede7dd;
--color-coconut-cream-pie-200: #dbd3c7;
--color-coconut-cream-pie-300: #c0b6a7;
--color-coconut-cream-pie-400: #a99c8b;
--color-coconut-cream-pie-500: #928471;
--color-coconut-cream-pie-600: #7b7060;
--color-coconut-cream-pie-700: #63594c;
--color-coconut-cream-pie-800: #494137;
--color-coconut-cream-pie-900: #322d26;
--color-coconut-cream-pie-950: #1e1a14;
}SCSS
$coconut-cream-pie: #f0e2cf;
$coconut-cream-pie-rgb: 240, 226, 207;
$coconut-cream-pie-light: mix(#fff, $coconut-cream-pie, 20%);
$coconut-cream-pie-dark: mix(#000, $coconut-cream-pie, 20%);
.element {
color: $coconut-cream-pie;
box-shadow: 0 0 0 2px rgba($coconut-cream-pie, 0.35);
}