Heliotrope

#DF73FF

What color is Heliotrope?

Heliotrope is a soft, pinkish-purple with a bright, almost glowing violet quality, hex #DF73FF, close to the color of a heliotrope flower in full bloom. The color leans more pink than violet, with enough blue in it to keep it from reading as a warm rose.

What is the meaning of the color Heliotrope?

Named after the heliotrope plant, a fragrant flower known for turning toward the sun, the color entered English usage in the late 19th century as a fashionable descriptor for pinkish-purple dyes. Synthetic aniline dyes of the 1860s and 1870s made this shade producible at scale, and it became associated with refined Victorian dress fabrics. Crayola included Heliotrope in its expanded color sets as early as the mid-20th century, giving the name broader public recognition beyond the botanical world.

RGB
223, 115, 255
HSL
286°, 100%, 73%
CMYK
13, 55, 0, 0
HSV
286°, 55%, 100%
Heliotrope color

What colors go with Heliotrope?

Colors that pair well with Heliotrope include:
Mint Green: cool, refreshing contrast
Deep Indigo: rich, grounding depth
Soft Gold: warm, luminous balance
White: clean, airy softness
Charcoal Gray: sharp, modern anchor

Similar Colors

Conversions & Codes

Format Value CSS
HEX #DF73FF color: #DF73FF;
RGB 223, 115, 255 color: rgb(223, 115, 255);
RGB Percentage 87%, 45%, 100% color: rgb(87%, 45%, 100%);
CMYK 13%, 55%, 0%, 0% Not supported in CSS
HSL 286°, 100%, 73% color: hsl(286, 100%, 73%);
HSV 286°, 55%, 100% Not supported in CSS
CIE-LAB 58, 22, -47 color: lab(58% 22 -47);
Decimal 14644223 Not supported in CSS

Color Variations

Shades

#DF75FF
#D650FF
#CD2BFF
#C506FF
#AB00DF
#8F00BA
#720095
#560070

Tints

#F5D6FF
#F2C8FF
#EFBAFF
#ECACFF
#E99FFF
#E591FF
#E283FF
#DF75FF

Tones

#DF75FF
#DB7CF8
#D883F1
#D48AEA
#D091E3
#CD98DD
#C99FD6
#C5A5CF

Hues

#DF75FF
#FF75B8
#FF9A75
#FDFF75
#95FF75
#75FFBC
#75DAFF
#7875FF

Color Harmonies

Analogous

#9A75FF
Click to copy
#DF73FF
Click to copy
#FF75DA
Click to copy

Complementary

#DF73FF
Click to copy
#95FF75
Click to copy

Split Complementary

#DF73FF
Click to copy
#DAFF75
Click to copy
#75FF9A
Click to copy

Triadic

#DF73FF
Click to copy
#FFDF75
Click to copy
#75FFDF
Click to copy

Tetradic

#DF73FF
Click to copy
#FF9A75
Click to copy
#95FF75
Click to copy
#75DAFF
Click to copy

Square

#DF73FF
Click to copy
#FF9A75
Click to copy
#95FF75
Click to copy
#75DAFF
Click to copy

CSS & Dev Snippets

CSS
.heliotrope {
  color: #DF73FF;
}
SCSS
$heliotrope: #DF73FF;
RGB
rgb(223, 115, 255)

Accessibility & Contrast

White background

2.61:1
2.61
contrast ratio on a white background
Element
AA
AAA
Small text
Large text
UI element

Black background

8.03:1
8.03
contrast ratio on a black background
Element
AA
AAA
Small text
Large text
UI element

Popular Tags