Lavender Blue

HEX: #CCCCFF | Modern Palette

On White
1.54:1
FAIL
On Black
13.65:1
PASS

Color Specifications

HEX
#CCCCFF
RGB
204, 204, 255
HSL
240°, 100% ,90%
CMYK
20, 20, 0, 0

About Lavender Blue

Lavender Blue (#CCCCFF) is a color with RGB(204, 204, 255) and HSL(240°, 100%, 90%). It is commonly associated with Playful moods. In design, it fits Neon, Cool styles and is suitable for Text, Button, Background. Its complementary color is #FFFFCC, which creates strong contrast. Its triadic palette includes #FFCCCC and #CCFFCC. The name comes from Lavender Blue (English).

  • HEX: #CCCCFF
  • RGB: 204, 204, 255
  • HSL: 240°, 100%, 90%
  • Mood: Playful
  • Style: Neon, Cool
  • Use case: Text, Button, Background
  • Complementary color: #FFFFCC
  • Triadic colors: #FFCCCC, #CCFFCC
  • The name comes from Lavender Blue (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 #CCCCFF from deepest shade to lightest tint.

Color Characteristics

Mood
Playful
Style
Neon Cool

Accessibility Simulation

Deuteranopia #CCCCFF
Protanopia #CCCCFF
Tritanopia #C4D3D3
Achromatopsia #D0D0D0

Frequently Asked Questions

Lavender Blue (#CCCCFF) is a color with RGB(204, 204, 255) and HSL(240°, 100%, 90%).

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

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

#CCCCFF is commonly associated with Playful.

The name Lavender Blue is linked to Lavender Blue from English, meaning A shade of light purple, specifically referring to the color of lavender flowers, often with a bluish undertone..

Name, History & Etymology

Origin Word Lavender Blue
Meaning A shade of light purple, specifically referring to the color of lavender flowers, often with a bluish undertone.
Language English
First Recorded Use Late 18th - Early 19th Century

History

The color lavender, named after the plant, has been recognized for centuries. The addition of 'blue' to 'lavender' in 'lavender blue' emphasizes a specific hue within the lavender spectrum that leans more towards blue than pink. The folk song 'Lavender Blue (Dilly Dilly)' played a crucial role in popularizing this specific color description. The song's lyrics, 'Lavender's blue, dilly dilly, Lavender's green, When I am king, dilly dilly, You shall be queen,' suggest a long-standing association of the color with romance and royalty. Over time, 'lavender blue' has become a recognized color in fashion, interior design, and art, often associated with softness, tranquility, and nostalgia.

First Recorded Use

The phrase 'lavender blue' gained significant popular recognition through the English folk song 'Lavender Blue (Dilly Dilly)', which is believed to date back to at least the late 18th or early 19th century. While the color 'lavender' itself was recognized earlier, the specific 'lavender blue' combination as a named color shade became more prominent with the song's popularity.

Cultural Associations

The most significant cultural note for 'Lavender Blue' is its strong association with the folk song 'Lavender Blue (Dilly Dilly)'. This song has been a popular nursery rhyme and children's song for generations, ensuring the color's recognition across different age groups. It often evokes feelings of childhood, innocence, and traditional English culture. In broader cultural contexts, lavender shades, including lavender blue, are often linked to femininity, spring, and a sense of calm or spirituality. It's also sometimes used to represent uniqueness or creativity.

Similar Named Colors

Soap #CEC8EF ΔE 4.08
Pale Lavender #DCD0FF ΔE 4.27
Wild Blue Yonder #A2ADD0 ΔE 10.16
Light Steel Blue #B0C4DE ΔE 10.21

Code Snippets

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

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

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

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

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

// SCSS variable
$lavender-blue: #CCCCFF;

// With RGB channels (useful for rgba() usage)
$lavender-blue-r: 204;
$lavender-blue-g: 204;
$lavender-blue-b: 255;

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