命名颜色 · #8F00F1
Electric Violet
Electric Violet 即 #8F00F1:rgb(143 0 241)、hsl(276 100% 47%)、oklch(0.535 0.283 301.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Purple mean? → · Electric Violet color name →
#8F00F1
oklch(0.535 0.283 301.5)
颜色转换
- HEX
- #8f00f1
- RGB
- rgb(143 0 241)
- HSL
- hsl(276 100% 47%)
- HWB
- hwb(276 0% 5%)
- OKLCH
- oklch(0.535 0.283 301.5)
- OKLab
- oklab(0.535 0.148 -0.241)
- CIE Lab
- lab(40.32 74.2 -85.89)
- LCH
- lch(40.32 113.5 310.8)
- CMYK
- cmyk(41% 100% 0% 5%)
浅色调 · 深色调 · 灰色调
浅色调
- 993CF5
- A35AF8
- AE72FA
- B888FD
- C49DFE
- CFB1FF
- DBC5FF
- E7D8FF
- F3ECFF
深色调
- 7C00D2
- 6900B3
- 570095
- 450079
- 34005D
- 240043
- 15002B
- 070014
- 010003
灰色调
- 8D2BE6
- 8B3EDC
- 894BD1
- 8856C6
- 865FBB
- 8567B0
- 836EA5
- 827599
- 817B8D
配色和谐
互补色 +180°
- 8F00F1
Electric Violet
- 627800
≈ Topiary Green
类似色 -30° +30°
- 8F00F1
Electric Violet
- 424BFF
≈ Pretentious Peacock
- B400AA
≈ Rosolanc Purple
三角配色 +120° +240°
- 8F00F1
Electric Violet
- 9F5900
≈ Sepia Wash
- 007F71
≈ Blue Green
分裂互补色 +150° +210°
- 8F00F1
Electric Violet
- 846A00
≈ Muddy Brown
- 008340
≈ Warpstone Glow
四角配色 +90° +180° +270°
- 8F00F1
Electric Violet
- C91E00
≈ Piment Piquant
- 627800
≈ Topiary Green
- 007B8C
≈ Biscay Bay
对比度与无障碍
Ag
AA白底
WCAG 6.10:1 · APCA Lc 78
Ag
Fail黑底
WCAG 3.43:1 · APCA Lc 24
最佳文字颜色: #FFFFFF
WCAG 6.10:1 (AA) · APCA Lc 78
Contrast pairs
代码片段
CSS
:root {
--electric-violet: #8f00f1;
--electric-violet-rgb: 143 0 241;
--electric-violet-oklch: oklch(0.535 0.283 301.5);
}
.element {
color: var(--electric-violet);
background-color: hsl(276 100% 47%);
border-color: oklch(0.535 0.283 301.5);
}Tailwind CSS v4
@theme {
--color-electric-violet: #8f00f1;
--color-electric-violet-50: #ffe1ff;
--color-electric-violet-100: #fcd0ff;
--color-electric-violet-200: #eeb3ff;
--color-electric-violet-300: #d78aff;
--color-electric-violet-400: #bf62ff;
--color-electric-violet-500: #ac24ff;
--color-electric-violet-600: #9224f0;
--color-electric-violet-700: #751ec1;
--color-electric-violet-800: #541593;
--color-electric-violet-900: #3a0e68;
--color-electric-violet-950: #250048;
}SCSS
$electric-violet: #8f00f1;
$electric-violet-rgb: 143, 0, 241;
$electric-violet-light: mix(#fff, $electric-violet, 20%);
$electric-violet-dark: mix(#000, $electric-violet, 20%);
.element {
color: $electric-violet;
box-shadow: 0 0 0 2px rgba($electric-violet, 0.35);
}