CSS named color

Violet

#EE82EE
HEX#ee82ee
RGBrgb(238, 130, 238)
HSLhsl(300, 76%, 72%)
OKLCHoklch(76.19% 0.1861 327.21)
NAMEviolet

Palette

Complementary

180° on the color wheel
Complement
#81EE81

Analogous

±30° around the base hue
Left
#B881EE
Right
#EE81B8

Triadic

±120° for harmonic contrast
Triad 1
#EEEE81
Triad 2
#81EEEE

Shades

Lighter and darker variants
Lightest
#FEF6FE
Lighter
#FADBFA
Base
#EE82EE
Violet
Darker
#E228E2
Darkest
#A617A6

CSS usage

By name
color: violet;
background-color: violet;
By HEX
color: #ee82ee;
background-color: #ee82ee;
By RGB
color: rgb(238, 130, 238);
background-color: rgb(238, 130, 238);
By HSL
color: hsl(300, 76%, 72%);
background-color: hsl(300, 76%, 72%);

WCAG contrast vs white

Aa
2.32:1
Below minimum

WCAG contrast vs black

Aa
9.06:1
AAA

Related colors

FAQ — Violet

What is the HEX code for Violet?

The HEX code for Violet is #EE82EE. It's one of the 148 named CSS colors and can be used directly in CSS as color: violet; or color: #ee82ee;

What is Violet in RGB?

Violet in RGB is rgb(238, 130, 238) — red 238, green 130, blue 238.

What is Violet in HSL?

Violet in HSL is hsl(300, 76%, 72%) — hue 300°, saturation 76%, lightness 72%.

What is the complementary color of Violet?

The complementary color (directly opposite Violet on the color wheel) is #81EE81. The two together produce maximum contrast.

Is white text readable on Violet?

The WCAG contrast ratio against white (#FFFFFF) is 2.32:1, and against black (#000000) it's 9.06:1. White text is more readable. WCAG recommends at least 4.5:1 for body text.

← All colors & converter