命名颜色 · #F9E5C2
Havana Cream
Havana Cream 即 #F9E5C2：rgb(249 229 194)、hsl(38 82% 87%)、oklch(0.929 0.051 81.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Havana Cream color name →
#F9E5C2
oklch(0.929 0.051 81.6)
颜色转换
- HEX
- #f9e5c2
- RGB
- rgb(249 229 194)
- HSL
- hsl(38 82% 87%)
- HWB
- hwb(38 76% 2%)
- OKLCH
- oklch(0.929 0.051 81.6)
- OKLab
- oklab(0.929 0.007 0.05)
- CIE Lab
- lab(91.92 3.1 19.75)
- LCH
- lch(91.92 19.99 81.1)
- CMYK
- cmyk(0% 8% 22% 2%)
浅色调 · 深色调 · 灰色调
浅色调
- FAE8C8
- FAEACE
- FBEDD4
- FBEFDB
- FCF2E1
- FDF5E7
- FDF7ED
- FEFAF3
- FEFCF9
深色调
- D9C7A8
- B9AA8F
- 9A8E77
- 7D7260
- 615849
- 463F34
- 2C2820
- 15120E
- 030302
灰色调
- ECDABB
- E0D0B5
- D3C6AE
- C7BBA7
- BBB1A1
- AFA79A
- A39D94
- 97938D
- 8B8A87
配色和谐
互补色 +180°
- F9E5C2
Havana Cream
- DBE8FF
≈ Veiling Waterfalls
类似色 -30° +30°
- F9E5C2
Havana Cream
- FFE1CF
≈ Powdered Peach
- E8ECC5
≈ Olive Creed
三角配色 +120° +240°
- F9E5C2
Havana Cream
- C1F2F6
≈ Pale Sky
- F8DDFC
≈ Sugarpills
分裂互补色 +150° +210°
- F9E5C2
Havana Cream
- CDEDFF
≈ Blue Hijab
- E7E4FF
≈ Lavender Mist
四角配色 +90° +180° +270°
- F9E5C2
Havana Cream
- C7F3E3
≈ Shallow End
- DBE8FF
≈ Veiling Waterfalls
- FFDDEB
≈ Transparent Pink
对比度与无障碍
Ag
Fail白底
WCAG 1.23:1 · APCA Lc 12
Ag
AAA黑底
WCAG 17.01:1 · APCA Lc 92
最佳文字颜色: #000000
WCAG 17.01:1 (AAA) · APCA Lc 92
Contrast pairs
代码片段
CSS
:root {
--havana-cream: #f9e5c2;
--havana-cream-rgb: 249 229 194;
--havana-cream-oklch: oklch(0.929 0.051 81.6);
}
.element {
color: var(--havana-cream);
background-color: hsl(38 82% 87%);
border-color: oklch(0.929 0.051 81.6);
}Tailwind CSS v4
@theme {
--color-havana-cream: #f9e5c2;
--color-havana-cream-50: #fcf4e5;
--color-havana-cream-100: #f0e7d5;
--color-havana-cream-200: #dfd3bc;
--color-havana-cream-300: #c4b69a;
--color-havana-cream-400: #ae9c7d;
--color-havana-cream-500: #97835f;
--color-havana-cream-600: #806f51;
--color-havana-cream-700: #665941;
--color-havana-cream-800: #4c412e;
--color-havana-cream-900: #352d1f;
--color-havana-cream-950: #201a0f;
}SCSS
$havana-cream: #f9e5c2;
$havana-cream-rgb: 249, 229, 194;
$havana-cream-light: mix(#fff, $havana-cream, 20%);
$havana-cream-dark: mix(#000, $havana-cream, 20%);
.element {
color: $havana-cream;
box-shadow: 0 0 0 2px rgba($havana-cream, 0.35);
}