Vivid Violet

HEX: #9F00FF | Modern Palette

On White
5.36:1
PASS
On Black
3.92:1
FAIL

Color Specifications

HEX
#9F00FF
RGB
159, 0, 255
HSL
277°, 100% ,100%
CMYK
37.65, 100, 0, 0

About Vivid Violet

Vivid Violet (#9F00FF) is a color with RGB(159, 0, 255) and HSL(277.41°, 100%, 100%). It is commonly associated with Playful moods. In design, it fits Neon styles and is suitable for Text, Button, Background. Its complementary color is #60FF00, which creates strong contrast. Its triadic palette includes Orange Peel (#FF9F00) and #00FF9F. The name comes from Vivid Violet (English).

  • HEX: #9F00FF
  • RGB: 159, 0, 255
  • HSL: 277.41°, 100%, 100%
  • Mood: Playful
  • Style: Neon
  • Use case: Text, Button, Background
  • Complementary color: #60FF00
  • Triadic colors: Orange Peel (#FF9F00), #00FF9F
  • The name comes from Vivid Violet (English).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
Analogous Five hues drifting across a 60° arc — naturally harmonious and pleasing to the eye.
3 + 1 + 1 Three analogous base colors, one complementary accent, one dark anchor — bold yet balanced.

Color Harmonies

Complementary

The color directly opposite on the color wheel — creates maximum contrast and vibrance.

Analogous

Colors adjacent on the wheel — naturally harmonious and pleasing to the eye.

Triadic

Three colors equally spaced 120° apart — bold, balanced, and visually rich.

Split-Complementary

Two colors flanking the complement — high contrast with less tension than full complementary.

Tetradic (Square)

Four colors at 90° intervals — rich variety, best when one color dominates.

Monochromatic

Shades and tints of the same hue — cohesive, elegant, and easy to work with.

Shades & Tints

A seamless scale of #9F00FF from deepest shade to lightest tint.

Color Characteristics

Mood
Playful
Style
Neon
Use case
Text Button Background

Accessibility Simulation

Deuteranopia #5959FE
Protanopia #3737FF
Tritanopia #7F6464
Achromatopsia #6B6B6B

Frequently Asked Questions

Vivid Violet (#9F00FF) is a color with RGB(159, 0, 255) and HSL(277.41°, 100%, 100%).

#9F00FF pairs strongly with #60FF00 as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#9F00FF is suitable for Text, Button, Background and works well with Neon styles.

#9F00FF is commonly associated with Playful.

The name Vivid Violet is linked to Vivid Violet from English, meaning A bright, intense shade of violet..

Name, History & Etymology

Origin Word Vivid Violet
Meaning A bright, intense shade of violet.
Language English
First Recorded Use Late 20th Century

History

The word 'vivid' comes from Latin 'vividus' meaning 'lively, animated,' from 'vivere' 'to live.' 'Violet' comes from Old French 'violette,' a diminutive of 'viole' 'violet,' ultimately from Latin 'viola.' The color violet itself has been recognized and used since antiquity, often associated with royalty, spirituality, and magic. The precise naming 'Vivid Violet' distinguishes it from other shades of violet, emphasizing its brightness and saturation. It is often represented by the hexadecimal color code #9F00FF.

First Recorded Use

The specific color name 'Vivid Violet' likely gained traction with the advent of digital color systems and standardized color charts (e.g., X11 color names, web colors) in the late 20th century. While 'vivid' and 'violet' have much older origins, their combination as a specific color name is more recent.

Cultural Associations

In digital and web design, 'Vivid Violet' (or its hex code #9F00FF) is a recognized color. It evokes feelings of creativity, luxury, and sometimes a futuristic or neon aesthetic due to its intensity. It can be seen in branding, fashion, and digital art where a strong, vibrant purple is desired. It's a more energetic shade than traditional, darker violets.

Similar Named Colors
Veronica #A020F0 ΔE 1.95
Electric Violet #8F00FF ΔE 2.56
Blue Violet #8A2BE2 ΔE 4.33
Violet (color Wheel) #7F00FF ΔE 4.89

Code Snippets

/* Background */
.element {
    background-color: #9F00FF;
}

/* Text */
.element {
    color: #9F00FF;
}

/* Border */
.element {
    border: 1px solid #9F00FF;
}

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #9F00FF,
        #FFFFFF
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #9F00FF,
        #FFFFFF
    );
}

// SCSS variable
$vivid-violet: #9F00FF;

// With RGB channels (useful for rgba() usage)
$vivid-violet-r: 159;
$vivid-violet-g: 0;
$vivid-violet-b: 255;

// Usage
.element {
    background-color: $vivid-violet;
    color: rgba($vivid-violet-r, $vivid-violet-g, $vivid-violet-b, 0.8);
}