命名颜色 · #F2EEE2
Cream White
Cream White 即 #F2EEE2：rgb(242 238 226)、hsl(45 38% 92%)、oklch(0.949 0.016 91.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Cream White color name →
#F2EEE2
oklch(0.949 0.016 91.6)
颜色转换
- HEX
- #f2eee2
- RGB
- rgb(242 238 226)
- HSL
- hsl(45 38% 92%)
- HWB
- hwb(45 89% 5%)
- OKLCH
- oklch(0.949 0.016 91.6)
- OKLab
- oklab(0.949 0 0.016)
- CIE Lab
- lab(94.17 -0.13 6.33)
- LCH
- lch(94.17 6.33 91.2)
- CMYK
- cmyk(0% 2% 7% 5%)
浅色调 · 深色调 · 灰色调
浅色调
- F3F0E5
- F5F1E8
- F6F3EB
- F7F5EE
- F8F6F0
- FAF8F3
- FBFAF6
- FCFCF9
- FEFDFC
深色调
- D2CFC4
- B4B1A8
- 96938C
- 797771
- 5E5C57
- 43423E
- 2B2A27
- 141412
- 030303
灰色调
- E6E2D8
- DAD7CE
- CECCC4
- C3C1BA
- B7B5B0
- ACAAA6
- A1A09C
- 969593
- 8B8A89
配色和谐
互补色 +180°
- F2EEE2
Cream White
- EAEEFA
≈ Cotton Boll
类似色 -30° +30°
- F2EEE2
Cream White
- F7ECE3
≈ Champagne Flute
- ECF0E4
≈ Bean White
三角配色 +120° +240°
- F2EEE2
Cream White
- E2F1F4
≈ Diamond White
- F5EAF3
≈ Snow Plum
分裂互补色 +150° +210°
- F2EEE2
Cream White
- E5F0F8
≈ Clear Vision
- F0ECF8
≈ Placebo Purple
四角配色 +90° +180° +270°
- F2EEE2
Cream White
- E3F2EF
≈ Bone-Chilling
- EAEEFA
≈ Cotton Boll
- F8EAED
≈ Morning Shine
对比度与无障碍
Ag
Fail白底
WCAG 1.15:1 · APCA Lc 8
Ag
AAA黑底
WCAG 18.10:1 · APCA Lc 97
最佳文字颜色: #000000
WCAG 18.10:1 (AAA) · APCA Lc 97
Contrast pairs
代码片段
CSS
:root {
--cream-white: #f2eee2;
--cream-white-rgb: 242 238 226;
--cream-white-oklch: oklch(0.949 0.016 91.6);
}
.element {
color: var(--cream-white);
background-color: hsl(45 38% 92%);
border-color: oklch(0.949 0.016 91.6);
}Tailwind CSS v4
@theme {
--color-cream-white: #f2eee2;
--color-cream-white-50: #f7f5f0;
--color-cream-white-100: #e9e8e2;
--color-cream-white-200: #d6d4cc;
--color-cream-white-300: #bab7ae;
--color-cream-white-400: #a29e94;
--color-cream-white-500: #8a867a;
--color-cream-white-600: #757167;
--color-cream-white-700: #5d5b53;
--color-cream-white-800: #45423c;
--color-cream-white-900: #2f2e29;
--color-cream-white-950: #1c1a17;
}SCSS
$cream-white: #f2eee2;
$cream-white-rgb: 242, 238, 226;
$cream-white-light: mix(#fff, $cream-white, 20%);
$cream-white-dark: mix(#000, $cream-white, 20%);
.element {
color: $cream-white;
box-shadow: 0 0 0 2px rgba($cream-white, 0.35);
}