最接近的命名颜色 · #DCF0EA
#DCF0EA
最接近的命名颜色: Shattered Ice
#DCF0EA(rgb(220 240 234)、hsl(162 40% 90%)、oklch(0.939 0.023 175.9))最接近命名颜色 Shattered Ice。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#DCF0EA
oklch(0.939 0.023 175.9)
颜色转换
- HEX
- #dcf0ea
- RGB
- rgb(220 240 234)
- HSL
- hsl(162 40% 90%)
- HWB
- hwb(162 86% 6%)
- OKLCH
- oklch(0.939 0.023 175.9)
- OKLab
- oklab(0.939 -0.022 0.002)
- CIE Lab
- lab(93.18 -7.65 0.54)
- LCH
- lch(93.18 7.67 176)
- CMYK
- cmyk(8% 0% 3% 6%)
浅色调 · 深色调 · 灰色调
浅色调
- E0F2EC
- E3F3EE
- E7F5F0
- EAF6F2
- EEF8F4
- F1F9F7
- F5FBF9
- F8FCFB
- FCFEFD
深色调
- BFD1CB
- A3B2AE
- 889591
- 6E7875
- 545D5A
- 3C4341
- 262A29
- 111413
- 020303
灰色调
- D2E4DF
- C9D9D4
- C0CDC9
- B6C2BE
- ADB6B4
- A4ABA9
- 9BA09F
- 929594
- 898B8A
配色和谐
互补色 +180°
- DCF0EA
Shattered Ice
- F8E5EB
≈ Pink Tutu
类似色 -30° +30°
- DCF0EA
Shattered Ice
- E2EFE2
≈ Soothing Vapour
- DAEFF2
≈ Let It Snow
三角配色 +120° +240°
- DCF0EA
Shattered Ice
- ECE8F9
≈ Bright Dusk
- F7E7DD
≈ Grandma’s Cameo
分裂互补色 +150° +210°
- DCF0EA
Shattered Ice
- F3E6F3
≈ Holographic Lavender
- FAE5E3
≈ Rose Sugar
四角配色 +90° +180° +270°
- DCF0EA
Shattered Ice
- E4EBFA
≈ Husky
- F8E5EB
≈ Pink Tutu
- F1EADA
≈ Ivory Steam
对比度与无障碍
Ag
Fail白底
WCAG 1.18:1 · APCA Lc 9
Ag
AAA黑底
WCAG 17.69:1 · APCA Lc 95
最佳文字颜色: #000000
WCAG 17.69:1 (AAA) · APCA Lc 95
Contrast pairs
代码片段
CSS
:root {
--shattered-ice: #dcf0ea;
--shattered-ice-rgb: 220 240 234;
--shattered-ice-oklch: oklch(0.939 0.023 175.9);
}
.element {
color: var(--shattered-ice);
background-color: hsl(162 40% 90%);
border-color: oklch(0.939 0.023 175.9);
}Tailwind CSS v4
@theme {
--color-shattered-ice: #dcf0ea;
--color-shattered-ice-50: #eff7f5;
--color-shattered-ice-100: #e0eae8;
--color-shattered-ice-200: #cbd8d4;
--color-shattered-ice-300: #acbbb7;
--color-shattered-ice-400: #91a39e;
--color-shattered-ice-500: #778b85;
--color-shattered-ice-600: #657671;
--color-shattered-ice-700: #515e5a;
--color-shattered-ice-800: #3b4542;
--color-shattered-ice-900: #28302d;
--color-shattered-ice-950: #161c1a;
}SCSS
$shattered-ice: #dcf0ea;
$shattered-ice-rgb: 220, 240, 234;
$shattered-ice-light: mix(#fff, $shattered-ice, 20%);
$shattered-ice-dark: mix(#000, $shattered-ice, 20%);
.element {
color: $shattered-ice;
box-shadow: 0 0 0 2px rgba($shattered-ice, 0.35);
}