Brilliant Lavender

HEX: #F4BBFF | Modern Palette

On White
1.57:1
FAIL
On Black
13.40:1
PASS

Color Specifications

HEX
#F4BBFF
RGB
244, 187, 255
HSL
290°, 100% ,86%
CMYK
4, 27, 0, 0

About Brilliant Lavender

Brilliant Lavender (#F4BBFF) is a color with RGB(244, 187, 255) and HSL(290.3°, 100%, 86.7%). It is commonly associated with Playful moods. In design, it fits Neon styles and is suitable for Text, Button, Background. Its complementary color is #C6FFBB, which creates strong contrast. Its triadic palette includes #FFF4BB and #BBFFF4. The name comes from Brilliant Lavender (English).

  • HEX: #F4BBFF
  • RGB: 244, 187, 255
  • HSL: 290.3°, 100%, 86.7%
  • Mood: Playful
  • Style: Neon
  • Use case: Text, Button, Background
  • Complementary color: #C6FFBB
  • Triadic colors: #FFF4BB, #BBFFF4
  • The name comes from Brilliant Lavender (English).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Brilliant Lavender #F4BBFF is used in Monochromatic, Neutral + Accent, Analogous, 3 + 1 + 1 palettes, giving designers ready-made combinations for backgrounds, surfaces, accents, and interface elements.

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
 
 
 
 
BRILLIANT LAVENDER
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
 
 
BRILLIANT LAVENDER
 
 
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

Brilliant Lavender #F4BBFF pairs with #C6FFBB as its complementary color, and #FFF4BB and #BBFFF4 in triadic combinations. These harmony relationships help create balanced color combinations for UI, branding, and design work.

Complementary

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

BRILLIANT LAVENDER
Analogous

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

BRILLIANT LAVENDER
Triadic

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

BRILLIANT LAVENDER
Split-Complementary

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

BRILLIANT LAVENDER
Tetradic (Square)

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

BRILLIANT LAVENDER
Monochromatic

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

BRILLIANT LAVENDER

Shades & Tints

The shade and tint range for Brilliant Lavender #F4BBFF moves from dark #15001A tones through the base color to lighter #FBE6FF tones, making it useful for depth, hierarchy, and background variation.

BRILLIANT LAVENDER

Color Characteristics

Mood
Playful
Style
Neon
Use case
Text Button Background

Accessibility Simulation

Deuteranopia #CECEFE
Protanopia #C2C2FF
Tritanopia #ECC5C5
Achromatopsia #CECECE

Frequently Asked Questions

Brilliant Lavender (#F4BBFF) is a color with RGB(244, 187, 255) and HSL(290.3°, 100%, 86.7%).

#F4BBFF pairs strongly with #C6FFBB as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

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

#F4BBFF is commonly associated with Playful.

The name Brilliant Lavender is linked to Brilliant Lavender from English, meaning A vivid and bright shade of light purple, reminiscent of lavender flowers but with increased intensity and luminosity..

Name, History & Etymology

Origin Word Brilliant Lavender
Meaning A vivid and bright shade of light purple, reminiscent of lavender flowers but with increased intensity and luminosity.
Language English
First Recorded Use Late 20th Century - Early 21st Century

History

The word 'brilliant' comes from the French 'brillant', meaning 'shining' or 'sparkling', and entered English in the 17th century. 'Lavender' as a color name derives from the plant of the same name, known for its pale purple flowers, and has been used to describe a color since at least the early 19th century. The combination 'Brilliant Lavender' emphasizes a more vibrant, less muted version of traditional lavender. Its popularization is tied to digital media and commercial product naming where descriptive and appealing color names are common.

First Recorded Use

The specific color name 'Brilliant Lavender' as a distinct named color, especially with a precise hex code like #f4bbff, likely emerged with the advent of digital color systems, web design, and standardized color palettes in the late 20th or early 21st century. While 'brilliant' and 'lavender' have older origins, their combination as a specific color name is more modern.

Cultural Associations

Lavender shades are often associated with calmness, tranquility, femininity, and grace. 'Brilliant Lavender' adds an element of vibrancy and modernity to these associations, suggesting creativity, uniqueness, and a lively spirit. It can be seen in fashion, interior design, and digital aesthetics where a cheerful yet sophisticated purple is desired. It might also evoke feelings of spring, new beginnings, or a whimsical fantasy.

Similar Named Colors
Mauve #E0B0FF ΔE 4.77
Rich Brilliant Lavender #F1A7FE ΔE 4.97
Plum #DDA0DD ΔE 7.05
Light Orchid #E6A8D7 ΔE 7.42

Code Snippets

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

/* Text */
.element {
    color: #F4BBFF;
}

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

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

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #F4BBFF,
        #C6FFBB
    );
}

// SCSS variable
$brilliant-lavender: #F4BBFF;

// With RGB channels (useful for rgba() usage)
$brilliant-lavender-r: 244;
$brilliant-lavender-g: 187;
$brilliant-lavender-b: 255;

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