最接近的命名颜色 · #F7E8E7
#F7E8E7
最接近的命名颜色: White Christmas
#F7E8E7（rgb(247 232 231)、hsl(4 50% 94%)、oklch(0.943 0.016 22.1)）最接近命名颜色 White Christmas。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#F7E8E7
oklch(0.943 0.016 22.1)
颜色转换
- HEX
- #f7e8e7
- RGB
- rgb(247 232 231)
- HSL
- hsl(4 50% 94%)
- HWB
- hwb(4 91% 3%)
- OKLCH
- oklch(0.943 0.016 22.1)
- OKLab
- oklab(0.943 0.015 0.006)
- CIE Lab
- lab(93.18 5.14 2.41)
- LCH
- lch(93.18 5.67 25.2)
- CMYK
- cmyk(0% 6% 6% 3%)
浅色调 · 深色调 · 灰色调
浅色调
- F8EAE9
- F9EDEC
- F9EFEE
- FAF1F1
- FBF3F3
- FCF6F5
- FDF8F8
- FDFAFA
- FEFDFD
深色调
- D7CAC9
- B7ACAB
- 99908F
- 7C7473
- 605959
- 454040
- 2C2928
- 151313
- 030303
灰色调
- EBDDDC
- DED2D2
- D2C8C7
- C6BDBC
- BAB3B2
- AEA8A8
- A29E9E
- 979494
- 8B8A8A
配色和谐
互补色 +180°
- F7E8E7
White Christmas
- E0F0F1
≈ Azul Primavera
类似色 -30° +30°
- F7E8E7
White Christmas
- F6E8ED
≈ Princess Elle
- F6E9E2
≈ Spooled White
三角配色 +120° +240°
- F7E8E7
White Christmas
- E6EFE5
≈ Stone Path
- E6ECF7
≈ Coconut White
分裂互补色 +150° +210°
- F7E8E7
White Christmas
- E2F0EB
≈ Aquacade
- E2EEF5
≈ Diamond White
四角配色 +90° +180° +270°
- F7E8E7
White Christmas
- ECEDE1
≈ Sublime
- E0F0F1
≈ Azul Primavera
- ECEAF6
≈ Silver Phoenix
对比度与无障碍
Ag
Fail白底
WCAG 1.18:1 · APCA Lc 9
Ag
AAA黑底
WCAG 17.65:1 · APCA Lc 95
最佳文字颜色: #000000
WCAG 17.65:1 (AAA) · APCA Lc 95
Contrast pairs
代码片段
CSS
:root {
--white-christmas: #f7e8e7;
--white-christmas-rgb: 247 232 231;
--white-christmas-oklch: oklch(0.943 0.016 22.1);
}
.element {
color: var(--white-christmas);
background-color: hsl(4 50% 94%);
border-color: oklch(0.943 0.016 22.1);
}Tailwind CSS v4
@theme {
--color-white-christmas: #f7e8e7;
--color-white-christmas-50: #faf3f3;
--color-white-christmas-100: #ede6e5;
--color-white-christmas-200: #dbd2d1;
--color-white-christmas-300: #c0b4b3;
--color-white-christmas-400: #a89b9a;
--color-white-christmas-500: #918281;
--color-white-christmas-600: #7b6e6d;
--color-white-christmas-700: #625857;
--color-white-christmas-800: #484040;
--color-white-christmas-900: #322c2c;
--color-white-christmas-950: #1e1919;
}SCSS
$white-christmas: #f7e8e7;
$white-christmas-rgb: 247, 232, 231;
$white-christmas-light: mix(#fff, $white-christmas, 20%);
$white-christmas-dark: mix(#000, $white-christmas, 20%);
.element {
color: $white-christmas;
box-shadow: 0 0 0 2px rgba($white-christmas, 0.35);
}