最接近的命名颜色 · #EDDDDD
#EDDDDD
最接近的命名颜色: Hyper Light Drifter
#EDDDDD（rgb(237 221 221)、hsl(0 31% 90%)、oklch(0.91 0.018 17.5)）最接近命名颜色 Hyper Light Drifter。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#EDDDDD
oklch(0.91 0.018 17.5)
颜色转换
- HEX
- #eddddd
- RGB
- rgb(237 221 221)
- HSL
- hsl(0 31% 90%)
- HWB
- hwb(0 87% 7%)
- OKLCH
- oklch(0.91 0.018 17.5)
- OKLab
- oklab(0.91 0.017 0.005)
- CIE Lab
- lab(89.42 5.67 2.08)
- LCH
- lch(89.42 6.04 20.1)
- CMYK
- cmyk(0% 7% 7% 7%)
浅色调 · 深色调 · 灰色调
浅色调
- EFE0E0
- F1E4E4
- F2E7E7
- F4EBEA
- F6EEEE
- F8F1F1
- FAF5F5
- FBF8F8
- FDFCFC
深色调
- CEC0C0
- B0A4A4
- 938888
- 776E6E
- 5C5555
- 423D3D
- 2A2626
- 141111
- 030202
灰色调
- E2D3D3
- D6CACA
- CBC0C0
- C0B7B7
- B5ADAD
- AAA4A4
- 9F9B9B
- 959292
- 8A8989
配色和谐
互补色 +180°
- EDDDDD
Hyper Light Drifter
- D5E5E5
≈ Lauren’s Surprise
类似色 -30° +30°
- EDDDDD
Hyper Light Drifter
- EBDDE3
≈ Weak Mauve
- ECDED8
≈ Berry Frost
三角配色 +120° +240°
- EDDDDD
Hyper Light Drifter
- DCE4D9
≈ Mineral White
- DAE2ED
≈ Blooming Aster
分裂互补色 +150° +210°
- EDDDDD
Hyper Light Drifter
- D7E5DF
≈ Fizzle
- D6E4EB
≈ Ethereal Moonlight
四角配色 +90° +180° +270°
- EDDDDD
Hyper Light Drifter
- E2E2D5
≈ Divine Cream
- D5E5E5
≈ Lauren’s Surprise
- E0E0ED
≈ Imagination
对比度与无障碍
Ag
Fail白底
WCAG 1.31:1 · APCA Lc 16
Ag
AAA黑底
WCAG 15.98:1 · APCA Lc 88
最佳文字颜色: #000000
WCAG 15.98:1 (AAA) · APCA Lc 88
Contrast pairs
代码片段
CSS
:root {
--hyper-light-drifter: #eddddd;
--hyper-light-drifter-rgb: 237 221 221;
--hyper-light-drifter-oklch: oklch(0.91 0.018 17.5);
}
.element {
color: var(--hyper-light-drifter);
background-color: hsl(0 31% 90%);
border-color: oklch(0.91 0.018 17.5);
}Tailwind CSS v4
@theme {
--color-hyper-light-drifter: #eddddd;
--color-hyper-light-drifter-50: #faf3f3;
--color-hyper-light-drifter-100: #eee6e5;
--color-hyper-light-drifter-200: #dcd1d1;
--color-hyper-light-drifter-300: #c0b4b4;
--color-hyper-light-drifter-400: #a99a9a;
--color-hyper-light-drifter-500: #928282;
--color-hyper-light-drifter-600: #7b6e6e;
--color-hyper-light-drifter-700: #635858;
--color-hyper-light-drifter-800: #484040;
--color-hyper-light-drifter-900: #322c2c;
--color-hyper-light-drifter-950: #1e1919;
}SCSS
$hyper-light-drifter: #eddddd;
$hyper-light-drifter-rgb: 237, 221, 221;
$hyper-light-drifter-light: mix(#fff, $hyper-light-drifter, 20%);
$hyper-light-drifter-dark: mix(#000, $hyper-light-drifter, 20%);
.element {
color: $hyper-light-drifter;
box-shadow: 0 0 0 2px rgba($hyper-light-drifter, 0.35);
}