Warna bernama · #FDF3E3
Historic Cream
Historic Cream adalah #FDF3E3: rgb(253 243 227), hsl(37 87% 94%), oklch(0.968 0.024 79.7). Lihat tint, shade, harmoni, kontras WCAG & APCA, serta kode CSS, Tailwind v4, dan SCSS.
What does Gray mean? → · Historic Cream color name →
#FDF3E3
oklch(0.968 0.024 79.7)
Konversi warna
- HEX
- #fdf3e3
- RGB
- rgb(253 243 227)
- HSL
- hsl(37 87% 94%)
- HWB
- hwb(37 89% 1%)
- OKLCH
- oklch(0.968 0.024 79.7)
- OKLab
- oklab(0.968 0.004 0.023)
- CIE Lab
- lab(96.31 1.51 9)
- LCH
- lch(96.31 9.13 80.5)
- CMYK
- cmyk(0% 4% 10% 1%)
Tint · Shade · Tone
Tint
- FDF4E6
- FDF5E9
- FEF7EB
- FEF8EE
- FEF9F1
- FEFAF4
- FEFBF7
- FFFDF9
- FFFEFC
Shade
- DCD3C5
- BCB4A8
- 9D978C
- 7F7A71
- 625E57
- 47443F
- 2D2B27
- 161412
- 030303
Tone
- F0E7D9
- E3DBCE
- D6CFC4
- C9C3BA
- BDB8B0
- B0ACA6
- A4A19D
- 989693
- 8C8B89
Harmoni warna
Komplementer +180°
- FDF3E3
Historic Cream
- EEF5FF
≈ Placebo Blue
Analog -30° +30°
- FDF3E3
Historic Cream
- FFF1EA
≈ Strawberry Dust
- F5F6E4
≈ Precious Dewdrop
Triadik +120° +240°
- FDF3E3
Historic Cream
- E3FAFB
≈ Calm Waters
- FCF0FF
≈ Lovely Euphoric Delight
Split-komplementer +150° +210°
- FDF3E3
Historic Cream
- E8F7FF
≈ Clear Skies
- F4F3FF
≈ Cloud Break
Tetradik +90° +180° +270°
- FDF3E3
Historic Cream
- E6FAF2
≈ Soft Mint
- EEF5FF
≈ Placebo Blue
- FFEFF6
≈ Lavender Blush
Kontras & aksesibilitas
Ag
FailDi atas putih
WCAG 1.09:1 · APCA Lc 0
Ag
AAADi atas hitam
WCAG 19.10:1 · APCA Lc 101
Warna teks terbaik: #000000
WCAG 19.10:1 (AAA) · APCA Lc 101
Contrast pairs
Cuplikan kode
CSS
:root {
--historic-cream: #fdf3e3;
--historic-cream-rgb: 253 243 227;
--historic-cream-oklch: oklch(0.968 0.024 79.7);
}
.element {
color: var(--historic-cream);
background-color: hsl(37 87% 94%);
border-color: oklch(0.968 0.024 79.7);
}Tailwind CSS v4
@theme {
--color-historic-cream: #fdf3e3;
--color-historic-cream-50: #f9f5ee;
--color-historic-cream-100: #ece7df;
--color-historic-cream-200: #d9d3c9;
--color-historic-cream-300: #beb6aa;
--color-historic-cream-400: #a69d8f;
--color-historic-cream-500: #8f8575;
--color-historic-cream-600: #797063;
--color-historic-cream-700: #615a4f;
--color-historic-cream-800: #474139;
--color-historic-cream-900: #312d27;
--color-historic-cream-950: #1d1a15;
}SCSS
$historic-cream: #fdf3e3;
$historic-cream-rgb: 253, 243, 227;
$historic-cream-light: mix(#fff, $historic-cream, 20%);
$historic-cream-dark: mix(#000, $historic-cream, 20%);
.element {
color: $historic-cream;
box-shadow: 0 0 0 2px rgba($historic-cream, 0.35);
}