Adlandırılmış renk · #F4DEC3
Impressive Ivory
Impressive Ivory, #F4DEC3: rgb(244 222 195), hsl(33 69% 86%), oklch(0.912 0.043 72.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Impressive Ivory color name →
#F4DEC3
oklch(0.912 0.043 72.9)
Renk dönüşümleri
- HEX
- #f4dec3
- RGB
- rgb(244 222 195)
- HSL
- hsl(33 69% 86%)
- HWB
- hwb(33 76% 4%)
- OKLCH
- oklch(0.912 0.043 72.9)
- OKLab
- oklab(0.912 0.013 0.041)
- CIE Lab
- lab(89.77 4.72 16.19)
- LCH
- lch(89.77 16.87 73.7)
- CMYK
- cmyk(0% 9% 20% 4%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F5E1C9
- F6E5CF
- F7E8D5
- F9EBDB
- FAEFE1
- FBF2E7
- FCF5ED
- FDF8F3
- FEFCF9
Koyu tonlar
- D4C1A9
- B5A590
- 978978
- 7A6F60
- 5E554A
- 443D34
- 2B2620
- 14120E
- 030202
Gri tonlar
- E8D4BC
- DCCBB5
- D0C1AF
- C4B7A8
- B8AEA1
- ADA59A
- A19B94
- 96928D
- 8B8987
Renk uyumları
Tamamlayıcı +180°
- F4DEC3
Impressive Ivory
- CEE4FF
≈ Fresh Water
Analog -30° +30°
- F4DEC3
Impressive Ivory
- FCD9CB
≈ Yours Truly
- E7E4C3
≈ Fountain Frolic
Üçlü +120° +240°
- F4DEC3
Impressive Ivory
- C2EBEA
≈ Gentle Cold
- ECDAF7
≈ Lavender Savour
Bölünmüş tamamlayıcı +150° +210°
- F4DEC3
Impressive Ivory
- C4E9F7
≈ Icy Landscape
- DDDFFF
≈ Contrail
Dörtlü +90° +180° +270°
- F4DEC3
Impressive Ivory
- C9EBDA
≈ Mint Tulip
- CEE4FF
≈ Fresh Water
- F8D7E9
≈ Sunset Pink
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.30:1 · APCA Lc 15
Ag
AAASiyah üzerinde
WCAG 16.08:1 · APCA Lc 89
En iyi metin rengi: #000000
WCAG 16.08:1 (AAA) · APCA Lc 89
Contrast pairs
Kod parçacıkları
CSS
:root {
--impressive-ivory: #f4dec3;
--impressive-ivory-rgb: 244 222 195;
--impressive-ivory-oklch: oklch(0.912 0.043 72.9);
}
.element {
color: var(--impressive-ivory);
background-color: hsl(33 69% 86%);
border-color: oklch(0.912 0.043 72.9);
}Tailwind CSS v4
@theme {
--color-impressive-ivory: #f4dec3;
--color-impressive-ivory-50: #fdf4e8;
--color-impressive-ivory-100: #f1e6d8;
--color-impressive-ivory-200: #dfd2c0;
--color-impressive-ivory-300: #c5b59f;
--color-impressive-ivory-400: #af9b83;
--color-impressive-ivory-500: #988267;
--color-impressive-ivory-600: #816e57;
--color-impressive-ivory-700: #675845;
--color-impressive-ivory-800: #4c4032;
--color-impressive-ivory-900: #352c22;
--color-impressive-ivory-950: #201911;
}SCSS
$impressive-ivory: #f4dec3;
$impressive-ivory-rgb: 244, 222, 195;
$impressive-ivory-light: mix(#fff, $impressive-ivory, 20%);
$impressive-ivory-dark: mix(#000, $impressive-ivory, 20%);
.element {
color: $impressive-ivory;
box-shadow: 0 0 0 2px rgba($impressive-ivory, 0.35);
}