命名颜色 · #DCDCE5
Violet Breeze
Violet Breeze 即 #DCDCE5：rgb(220 220 229)、hsl(240 15% 88%)、oklch(0.897 0.012 286.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Violet Breeze color name →
#DCDCE5
oklch(0.897 0.012 286.2)
颜色转换
- HEX
- #dcdce5
- RGB
- rgb(220 220 229)
- HSL
- hsl(240 15% 88%)
- HWB
- hwb(240 86% 10%)
- OKLCH
- oklch(0.897 0.012 286.2)
- OKLab
- oklab(0.897 0.003 -0.012)
- CIE Lab
- lab(87.96 1.23 -4.42)
- LCH
- lch(87.96 4.59 285.6)
- CMYK
- cmyk(4% 4% 0% 10%)
浅色调 · 深色调 · 灰色调
浅色调
- DFDFE8
- E3E3EA
- E6E6ED
- EAEAEF
- EDEDF2
- F1F1F5
- F4F4F7
- F8F8FA
- FBFBFC
深色调
- BFBFC7
- A3A3AA
- 88888E
- 6E6E72
- 545458
- 3C3C3F
- 262628
- 111112
- 020203
灰色调
- D2D2DA
- C9C9D0
- BFBFC6
- B6B6BB
- ADADB1
- A4A4A7
- 9B9B9D
- 929293
- 89898A
配色和谐
互补色 +180°
- DCDCE5
Violet Breeze
- DEDED5
≈ Gulf Breeze
类似色 -30° +30°
- DCDCE5
Violet Breeze
- D8DEE5
≈ Billowing Clouds
- E0DBE3
≈ He Loves Me
三角配色 +120° +240°
- DCDCE5
Violet Breeze
- E4DBD6
≈ Grim Grey
- D6E0DB
≈ Rapier Silver
分裂互补色 +150° +210°
- DCDCE5
Violet Breeze
- E2DCD4
≈ Milky
- D9DFD7
≈ White Sash
四角配色 +90° +180° +270°
- DCDCE5
Violet Breeze
- E5DADA
≈ Lavender Bikini
- DEDED5
≈ Gulf Breeze
- D4E0E0
≈ Pristine Petal
对比度与无障碍
Ag
Fail白底
WCAG 1.36:1 · APCA Lc 18
Ag
AAA黑底
WCAG 15.41:1 · APCA Lc 86
最佳文字颜色: #000000
WCAG 15.41:1 (AAA) · APCA Lc 86
Contrast pairs
代码片段
CSS
:root {
--violet-breeze: #dcdce5;
--violet-breeze-rgb: 220 220 229;
--violet-breeze-oklch: oklch(0.897 0.012 286.2);
}
.element {
color: var(--violet-breeze);
background-color: hsl(240 15% 88%);
border-color: oklch(0.897 0.012 286.2);
}Tailwind CSS v4
@theme {
--color-violet-breeze: #dcdce5;
--color-violet-breeze-50: #f5f5f8;
--color-violet-breeze-100: #e7e7ec;
--color-violet-breeze-200: #d4d3d9;
--color-violet-breeze-300: #b7b6bd;
--color-violet-breeze-400: #9d9da5;
--color-violet-breeze-500: #85858e;
--color-violet-breeze-600: #717178;
--color-violet-breeze-700: #5a5a60;
--color-violet-breeze-800: #424247;
--color-violet-breeze-900: #2d2d31;
--color-violet-breeze-950: #1a1a1d;
}SCSS
$violet-breeze: #dcdce5;
$violet-breeze-rgb: 220, 220, 229;
$violet-breeze-light: mix(#fff, $violet-breeze, 20%);
$violet-breeze-dark: mix(#000, $violet-breeze, 20%);
.element {
color: $violet-breeze;
box-shadow: 0 0 0 2px rgba($violet-breeze, 0.35);
}