最接近的命名颜色 · #DFF1E1
#DFF1E1
最接近的命名颜色: Vanishing Point
#DFF1E1(rgb(223 241 225)、hsl(127 39% 91%)、oklch(0.94 0.029 148.6))最接近命名颜色 Vanishing Point。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#DFF1E1
oklch(0.94 0.029 148.6)
颜色转换
- HEX
- #dff1e1
- RGB
- rgb(223 241 225)
- HSL
- hsl(127 39% 91%)
- HWB
- hwb(127 87% 5%)
- OKLCH
- oklch(0.94 0.029 148.6)
- OKLab
- oklab(0.94 -0.024 0.015)
- CIE Lab
- lab(93.47 -8.32 5.62)
- LCH
- lch(93.47 10.04 146)
- CMYK
- cmyk(7% 0% 7% 5%)
浅色调 · 深色调 · 灰色调
浅色调
- E2F2E4
- E5F4E7
- E9F5EA
- ECF7ED
- EFF8F0
- F2F9F3
- F5FBF6
- F9FCF9
- FCFEFC
深色调
- C2D2C4
- A5B3A7
- 8A958B
- 6F7970
- 565D56
- 3D433E
- 272B27
- 121412
- 020302
灰色调
- D5E5D7
- CBD9CD
- C2CEC3
- B8C2B9
- AEB7AF
- A5ACA6
- 9CA19C
- 929693
- 898B89
配色和谐
互补色 +180°
- DFF1E1
Vanishing Point
- F7E5F5
≈ Soft Lavender
类似色 -30° +30°
- DFF1E1
Vanishing Point
- E9EED9
≈ Blissful Serenity
- D8F2EB
≈ Green Frosting
三角配色 +120° +240°
- DFF1E1
Vanishing Point
- E3EBFF
≈ Husky
- FEE5E1
≈ Misty Rose
分裂互补色 +150° +210°
- DFF1E1
Vanishing Point
- EDE8FC
≈ Bright Dusk
- FDE4EB
≈ Hepatica
四角配色 +90° +180° +270°
- DFF1E1
Vanishing Point
- DBEFFD
≈ Calcareous Sinter
- F7E5F5
≈ Soft Lavender
- FBE7D9
≈ Aria Ivory
对比度与无障碍
Ag
Fail白底
WCAG 1.17:1 · APCA Lc 9
Ag
AAA黑底
WCAG 17.80:1 · APCA Lc 96
最佳文字颜色: #000000
WCAG 17.80:1 (AAA) · APCA Lc 96
Contrast pairs
代码片段
CSS
:root {
--vanishing-point: #dff1e1;
--vanishing-point-rgb: 223 241 225;
--vanishing-point-oklch: oklch(0.94 0.029 148.6);
}
.element {
color: var(--vanishing-point);
background-color: hsl(127 39% 91%);
border-color: oklch(0.94 0.029 148.6);
}Tailwind CSS v4
@theme {
--color-vanishing-point: #dff1e1;
--color-vanishing-point-50: #f0f8f1;
--color-vanishing-point-100: #e1ebe3;
--color-vanishing-point-200: #ccd8ce;
--color-vanishing-point-300: #adbcb0;
--color-vanishing-point-400: #93a395;
--color-vanishing-point-500: #7a8c7c;
--color-vanishing-point-600: #677669;
--color-vanishing-point-700: #525f54;
--color-vanishing-point-800: #3c453d;
--color-vanishing-point-900: #29302a;
--color-vanishing-point-950: #171c17;
}SCSS
$vanishing-point: #dff1e1;
$vanishing-point-rgb: 223, 241, 225;
$vanishing-point-light: mix(#fff, $vanishing-point, 20%);
$vanishing-point-dark: mix(#000, $vanishing-point, 20%);
.element {
color: $vanishing-point;
box-shadow: 0 0 0 2px rgba($vanishing-point, 0.35);
}