Named color · #8F00F1
Electric Violet
Electric Violet is #8F00F1: rgb(143 0 241), hsl(276 100% 47%), oklch(0.535 0.283 301.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Purple mean? → · Electric Violet color name →
#8F00F1
oklch(0.535 0.283 301.5)
Color conversions
- 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%)
Tints · Shades · Tones
Tints
- 993CF5
- A35AF8
- AE72FA
- B888FD
- C49DFE
- CFB1FF
- DBC5FF
- E7D8FF
- F3ECFF
Shades
- 7C00D2
- 6900B3
- 570095
- 450079
- 34005D
- 240043
- 15002B
- 070014
- 010003
Tones
- 8D2BE6
- 8B3EDC
- 894BD1
- 8856C6
- 865FBB
- 8567B0
- 836EA5
- 827599
- 817B8D
Color harmonies
Complementary +180°
- 8F00F1
Electric Violet
- 627800
≈ Topiary Green
Analogous -30° +30°
- 8F00F1
Electric Violet
- 424BFF
≈ Pretentious Peacock
- B400AA
≈ Rosolanc Purple
Triadic +120° +240°
- 8F00F1
Electric Violet
- 9F5900
≈ Sepia Wash
- 007F71
≈ Blue Green
Split-complementary +150° +210°
- 8F00F1
Electric Violet
- 846A00
≈ Muddy Brown
- 008340
≈ Warpstone Glow
Tetradic +90° +180° +270°
- 8F00F1
Electric Violet
- C91E00
≈ Piment Piquant
- 627800
≈ Topiary Green
- 007B8C
≈ Biscay Bay
Contrast & accessibility
Ag
AAOn white
WCAG 6.10:1 · APCA Lc 78
Ag
FailOn black
WCAG 3.43:1 · APCA Lc 24
Best text color: #FFFFFF
WCAG 6.10:1 (AA) · APCA Lc 78
Contrast pairs
Code snippets
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);
}