最接近的命名颜色 · #C3A9F3
#C3A9F3
最接近的命名颜色: Violet Heaven
#C3A9F3(rgb(195 169 243)、hsl(261 76% 81%)、oklch(0.784 0.107 300.1))最接近命名颜色 Violet Heaven。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#C3A9F3
oklch(0.784 0.107 300.1)
颜色转换
- HEX
- #c3a9f3
- RGB
- rgb(195 169 243)
- HSL
- hsl(261 76% 81%)
- HWB
- hwb(261 66% 5%)
- OKLCH
- oklch(0.784 0.107 300.1)
- OKLab
- oklab(0.784 0.053 -0.092)
- CIE Lab
- lab(73.56 20.7 -33.67)
- LCH
- lch(73.56 39.52 301.6)
- CMYK
- cmyk(20% 30% 0% 5%)
浅色调 · 深色调 · 灰色调
浅色调
- C9B2F5
- CFBAF6
- D4C3F8
- DACBF9
- E0D4FA
- E6DDFB
- ECE5FC
- F3EEFD
- F9F6FE
深色调
- A992D3
- 907CB4
- 786797
- 60537A
- 4A3F5E
- 342C44
- 201B2B
- 0E0A14
- 020103
灰色调
- BCA5E7
- B5A1DB
- AE9DD0
- A799C4
- A195B9
- 9A91AD
- 938DA2
- 8D8897
- 86848B
配色和谐
互补色 +180°
- C3A9F3
Violet Heaven
- B0C373
≈ Valley View
类似色 -30° +30°
- C3A9F3
Violet Heaven
- 9EB5FE
≈ Truesky Gloxym
- E0A0D9
≈ Plum Juice
三角配色 +120° +240°
- C3A9F3
Violet Heaven
- EBA871
≈ Old Plaster
- 5FCFBB
≈ Sweet Garden
分裂互补色 +150° +210°
- C3A9F3
Violet Heaven
- D3B664
≈ Wax Way
- 85CC94
≈ Good Luck Charm
四角配色 +90° +180° +270°
- C3A9F3
Violet Heaven
- F59E90
≈ Fruit Shake
- B0C373
≈ Valley View
- 58CBDE
≈ Watercourse
对比度与无障碍
Ag
Fail白底
WCAG 2.04:1 · APCA Lc 40
Ag
AAA黑底
WCAG 10.28:1 · APCA Lc 63
最佳文字颜色: #000000
WCAG 10.28:1 (AAA) · APCA Lc 63
Contrast pairs
代码片段
CSS
:root {
--violet-heaven: #c3a9f3;
--violet-heaven-rgb: 195 169 243;
--violet-heaven-oklch: oklch(0.784 0.107 300.1);
}
.element {
color: var(--violet-heaven);
background-color: hsl(261 76% 81%);
border-color: oklch(0.784 0.107 300.1);
}Tailwind CSS v4
@theme {
--color-violet-heaven: #c3a9f3;
--color-violet-heaven-50: #fbefff;
--color-violet-heaven-100: #eee0ff;
--color-violet-heaven-200: #dccafb;
--color-violet-heaven-300: #c1abe5;
--color-violet-heaven-400: #a890d4;
--color-violet-heaven-500: #9175c2;
--color-violet-heaven-600: #7b63a4;
--color-violet-heaven-700: #624f83;
--color-violet-heaven-800: #473a62;
--color-violet-heaven-900: #312845;
--color-violet-heaven-950: #1d152d;
}SCSS
$violet-heaven: #c3a9f3;
$violet-heaven-rgb: 195, 169, 243;
$violet-heaven-light: mix(#fff, $violet-heaven, 20%);
$violet-heaven-dark: mix(#000, $violet-heaven, 20%);
.element {
color: $violet-heaven;
box-shadow: 0 0 0 2px rgba($violet-heaven, 0.35);
}