命名颜色 · #E4EEEB
White Sapphire
White Sapphire 即 #E4EEEB：rgb(228 238 235)、hsl(162 23% 91%)、oklch(0.941 0.011 176.3)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · White Sapphire color name →
#E4EEEB
oklch(0.941 0.011 176.3)
颜色转换
- HEX
- #e4eeeb
- RGB
- rgb(228 238 235)
- HSL
- hsl(162 23% 91%)
- HWB
- hwb(162 89% 7%)
- OKLCH
- oklch(0.941 0.011 176.3)
- OKLab
- oklab(0.941 -0.011 0.001)
- CIE Lab
- lab(93.27 -3.85 0.24)
- LCH
- lch(93.27 3.85 176.4)
- CMYK
- cmyk(4% 0% 1% 7%)
浅色调 · 深色调 · 灰色调
浅色调
- E7F0ED
- E9F1EF
- ECF3F1
- EFF5F3
- F1F6F5
- F4F8F7
- F7FAF9
- FAFCFB
- FCFDFD
深色调
- C6CFCC
- A9B1AE
- 8D9391
- 727775
- 585C5B
- 3F4241
- 282A29
- 121413
- 030303
灰色调
- DAE2E0
- CFD7D5
- C5CCCA
- BBC1BF
- B1B5B4
- A7AAA9
- 9DA09F
- 939594
- 8A8A8A
配色和谐
互补色 +180°
- E4EEEB
White Sapphire
- F2E8EB
≈ Rose Fantasy
类似色 -30° +30°
- E4EEEB
White Sapphire
- E7EEE7
≈ Gossamer Wings
- E3EEEF
≈ Faraway Blue
三角配色 +120° +240°
- E4EEEB
White Sapphire
- ECEAF2
≈ Greek Goddess
- F2EAE4
≈ Sauvignon
分裂互补色 +150° +210°
- E4EEEB
White Sapphire
- F0E9EF
≈ Greek Goddess
- F3E9E7
≈ White Christmas
四角配色 +90° +180° +270°
- E4EEEB
White Sapphire
- E8EBF3
≈ Solitude
- F2E8EB
≈ Rose Fantasy
- EFEBE3
≈ Linen Ruffle
对比度与无障碍
Ag
Fail白底
WCAG 1.18:1 · APCA Lc 9
Ag
AAA黑底
WCAG 17.72:1 · APCA Lc 95
最佳文字颜色: #000000
WCAG 17.72:1 (AAA) · APCA Lc 95
Contrast pairs
代码片段
CSS
:root {
--white-sapphire: #e4eeeb;
--white-sapphire-rgb: 228 238 235;
--white-sapphire-oklch: oklch(0.941 0.011 176.3);
}
.element {
color: var(--white-sapphire);
background-color: hsl(162 23% 91%);
border-color: oklch(0.941 0.011 176.3);
}Tailwind CSS v4
@theme {
--color-white-sapphire: #e4eeeb;
--color-white-sapphire-50: #f2f6f5;
--color-white-sapphire-100: #e4e9e8;
--color-white-sapphire-200: #cfd6d4;
--color-white-sapphire-300: #b2b9b7;
--color-white-sapphire-400: #98a19e;
--color-white-sapphire-500: #7f8986;
--color-white-sapphire-600: #6b7471;
--color-white-sapphire-700: #565d5b;
--color-white-sapphire-800: #3f4442;
--color-white-sapphire-900: #2b2f2e;
--color-white-sapphire-950: #181b1a;
}SCSS
$white-sapphire: #e4eeeb;
$white-sapphire-rgb: 228, 238, 235;
$white-sapphire-light: mix(#fff, $white-sapphire, 20%);
$white-sapphire-dark: mix(#000, $white-sapphire, 20%);
.element {
color: $white-sapphire;
box-shadow: 0 0 0 2px rgba($white-sapphire, 0.35);
}