最接近的命名颜色 · #9E509E
#9E509E
最接近的命名颜色: Vicious Violet
#9E509E（rgb(158 80 158)、hsl(300 33% 47%)、oklch(0.555 0.144 327.3)）最接近命名颜色 Vicious Violet。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#9E509E
oklch(0.555 0.144 327.3)
颜色转换
- HEX
- #9e509e
- RGB
- rgb(158 80 158)
- HSL
- hsl(300 33% 47%)
- HWB
- hwb(300 31% 38%)
- OKLCH
- oklch(0.555 0.144 327.3)
- OKLab
- oklab(0.555 0.122 -0.078)
- CIE Lab
- lab(46.22 41.41 -28.25)
- LCH
- lch(46.22 50.13 325.7)
- CMYK
- cmyk(0% 49% 0% 38%)
浅色调 · 深色调 · 灰色调
浅色调
- A862A8
- B273B2
- BD84BB
- C696C5
- D0A7CF
- DAB8D8
- E3CAE2
- EDDBEC
- F6EDF5
深色调
- 894489
- 743974
- 602E60
- 4D244D
- 3A1A3A
- 291029
- 180718
- 090209
- 010001
灰色调
- 9C569B
- 995B98
- 966196
- 946693
- 916A90
- 8E6F8D
- 8B738A
- 877887
- 847C83
配色和谐
互补色 +180°
- 9E509E
Vicious Violet
- 25893C
≈ Cold Green
类似色 -30° +30°
- 9E509E
Vicious Violet
- 7D5DBC
≈ Fuchsia Blue
- B24874
≈ Royal Heath
三角配色 +120° +240°
- 9E509E
Vicious Violet
- 8F6E00
≈ Honey Yellow Green
- 00828F
≈ True Teal
分裂互补色 +150° +210°
- 9E509E
Vicious Violet
- 6E7C00
≈ Topiary Garden
- 008672
≈ Summer Turquoise
四角配色 +90° +180° +270°
- 9E509E
Vicious Violet
- AB5B00
≈ Raw Umber
- 25893C
≈ Cold Green
- 007CB1
≈ Nice Blue
对比度与无障碍
Ag
AA白底
WCAG 5.12:1 · APCA Lc 75
Ag
Fail黑底
WCAG 4.09:1 · APCA Lc 27
最佳文字颜色: #FFFFFF
WCAG 5.12:1 (AA) · APCA Lc 75
Contrast pairs
代码片段
CSS
:root {
--vicious-violet: #9e509e;
--vicious-violet-rgb: 158 80 158;
--vicious-violet-oklch: oklch(0.555 0.144 327.3);
}
.element {
color: var(--vicious-violet);
background-color: hsl(300 33% 47%);
border-color: oklch(0.555 0.144 327.3);
}Tailwind CSS v4
@theme {
--color-vicious-violet: #9e509e;
--color-vicious-violet-50: #ffe7ff;
--color-vicious-violet-100: #ffd7ff;
--color-vicious-violet-200: #f8bef3;
--color-vicious-violet-300: #e19cdb;
--color-vicious-violet-400: #cb7eca;
--color-vicious-violet-500: #b75fb7;
--color-vicious-violet-600: #9b519a;
--color-vicious-violet-700: #7c407c;
--color-vicious-violet-800: #5b2e5d;
--color-vicious-violet-900: #401f41;
--color-vicious-violet-950: #280f2a;
}SCSS
$vicious-violet: #9e509e;
$vicious-violet-rgb: 158, 80, 158;
$vicious-violet-light: mix(#fff, $vicious-violet, 20%);
$vicious-violet-dark: mix(#000, $vicious-violet, 20%);
.element {
color: $vicious-violet;
box-shadow: 0 0 0 2px rgba($vicious-violet, 0.35);
}