命名颜色 · #D6B4FC
Light Violet
Light Violet 即 #D6B4FC：rgb(214 180 252)、hsl(268 92% 85%)、oklch(0.824 0.105 305.8)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Purple mean? → · Light Violet color name →
#D6B4FC
oklch(0.824 0.105 305.8)
颜色转换
- HEX
- #d6b4fc
- RGB
- rgb(214 180 252)
- HSL
- hsl(268 92% 85%)
- HWB
- hwb(268 71% 1%)
- OKLCH
- oklch(0.824 0.105 305.8)
- OKLab
- oklab(0.824 0.061 -0.085)
- CIE Lab
- lab(78.22 22.71 -31.19)
- LCH
- lch(78.22 38.58 306.1)
- CMYK
- cmyk(15% 29% 0% 1%)
浅色调 · 深色调 · 灰色调
浅色调
- DABCFD
- DEC3FD
- E2CBFE
- E6D2FE
- EADAFF
- EEE1FF
- F3E9FF
- F7F0FF
- FBF8FF
深色调
- BA9CDB
- 9E85BB
- 846E9C
- 6A587E
- 524462
- 3B3047
- 251D2D
- 100C16
- 020203
灰色调
- CDAFEF
- C4AAE2
- BBA5D6
- B39FC9
- AA9ABD
- A195B0
- 9990A4
- 918B98
- 88858C
配色和谐
互补色 +180°
- D6B4FC
Light Violet
- B5D286
≈ Lettuce Green
类似色 -30° +30°
- D6B4FC
Light Violet
- B5C1FF
≈ Dried Lilac
- F1ABE0
≈ Hanami Pink
三角配色 +120° +240°
- D6B4FC
Light Violet
- F4B87A
≈ Rosy Skin
- 6BDCCF
≈ Hammam Blue
分裂互补色 +150° +210°
- D6B4FC
Light Violet
- DAC573
≈ Grassroots
- 8BDAA9
≈ Jovial Jade
四角配色 +90° +180° +270°
- D6B4FC
Light Violet
- FFAE98
≈ Pink Persimmon
- B5D286
≈ Lettuce Green
- 6BD7F1
≈ Electric Lemonade
对比度与无障碍
Ag
Fail白底
WCAG 1.78:1 · APCA Lc 33
Ag
AAA黑底
WCAG 11.79:1 · APCA Lc 70
最佳文字颜色: #000000
WCAG 11.79:1 (AAA) · APCA Lc 70
Contrast pairs
代码片段
CSS
:root {
--light-violet: #d6b4fc;
--light-violet-rgb: 214 180 252;
--light-violet-oklch: oklch(0.824 0.105 305.8);
}
.element {
color: var(--light-violet);
background-color: hsl(268 92% 85%);
border-color: oklch(0.824 0.105 305.8);
}Tailwind CSS v4
@theme {
--color-light-violet: #d6b4fc;
--color-light-violet-50: #fdeeff;
--color-light-violet-100: #f1dfff;
--color-light-violet-200: #e0c9f8;
--color-light-violet-300: #c6a9e1;
--color-light-violet-400: #ae8ed0;
--color-light-violet-500: #9773bd;
--color-light-violet-600: #8061a0;
--color-light-violet-700: #664e80;
--color-light-violet-800: #4a3960;
--color-light-violet-900: #332743;
--color-light-violet-950: #1f152b;
}SCSS
$light-violet: #d6b4fc;
$light-violet-rgb: 214, 180, 252;
$light-violet-light: mix(#fff, $light-violet, 20%);
$light-violet-dark: mix(#000, $light-violet, 20%);
.element {
color: $light-violet;
box-shadow: 0 0 0 2px rgba($light-violet, 0.35);
}