Skip to content

Blue violet

Blue violet is a medium, rich color from the purple family. Hex code #8A2BE2.

Blue violet#8A2BE2

Color codes

  • CSS nameblueviolet
  • HEX#8A2BE2
  • RGBrgb(138 43 226)
  • HSLhsl(271 76% 53%)
  • HSB / HSVhsb(271, 81%, 89%)
  • OKLCHoklch(53.4% 0.25 301.4)
  • CMYKcmyk(39%, 81%, 0%, 11%)

White text

5.95:1 · passes WCAG AA

Black text

3.52:1 · passes WCAG AA for large text only

Shades

50#F4EFFF
100#DCCAFC
200#C6A6F9
300#B17CFA
400#9F48FB
500#8522DC
600#6802B2
700#490F7C
800#2F0055

Complementary

#8A2BE2
#627716

Analogous

#8A2BE2
#424EFA
#B01CA6

Triadic

#8A2BE2
#9D5A0B
#1E7D70

About this color

Blue violet in CSS and design

Blue violet is a medium, rich color from the purple family. Blue violet is one of the extended color keywords, which CSS adopted from the X11 color names used on Unix workstations.

Use it in CSS by name or by any of its codes; these all give the same color:

color: blueviolet;
color: #8A2BE2;
color: rgb(138 43 226);
color: hsl(271 76% 53%);

For text on blue violet, white reads best. Check other combinations with the contrast checker, or browse all CSS color names.

Frequently asked questions

What is the hex code for blue violet?

#8A2BE2. In CSS you can also use the keyword blueviolet, which works in every browser.

What is blue violet in RGB and HSL?

In RGB it is rgb(138 43 226), in HSL hsl(271 76% 53%). For print, cmyk(39%, 81%, 0%, 11%) is a starting point, but CMYK depends on paper and ink, so check with your printer.

Should I use black or white text on blue violet?

White text works better: it has a contrast ratio of 5.95:1 and passes WCAG AA. Black text reaches 3.52:1.

Which colors go with blue violet?

Its complementary color is #627716, on the opposite side of the color wheel. For a calmer look, combine it with its analogous neighbors #424EFA and #B01CA6. The palette generator builds more combinations.