Palette

Glimmering Pixie Dust

Delicate and ethereal shades that evoke a magical, whimsical world full of soft light and gentle enchantment.

pastelplayful5 colors

More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Glimmering Pixie Dust reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Glimmering Pixie Dust.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#D1FFEA#FFEFD5#E6E6FA#F0F8FF#DDA0DD

Palette guide

How to use Glimmering Pixie Dust

Overview

The Glimmering Pixie Dust palette offers a delightful array of soft, ethereal pastels perfect for evoking a whimsical and magical atmosphere. Featuring gentle hues like the minty #D1FFEA, the creamy #FFEFD5, and the delicate lavender #E6E6FA, this collection is ideal for designers creating lighthearted, dreamy experiences. Its understated charm makes it suitable for projects requiring a touch of fantasy or a soft, inviting feel. Developers will find these colors easy to implement for UI elements that need to feel light and unobtrusive, while still conveying a distinct playful mood. The touch of deeper purple #DDA0DD adds a subtle accent without overwhelming the overall softness, making it versatile for enchanting digital and print mediums.

Best used for

Children's book illustrations
Fairy tale themed websites or apps
Baby product branding and packaging
Wedding invitations and decor
Boutique confectionery design
Soft, whimsical digital art

Suggested color roles

primary

#E6E6FA - A soft lavender, excellent for main sections or large backgrounds, providing a calming and ethereal base.

secondary

#FFEFD5 - A warm, creamy peach, perfect for content blocks, cards, or supporting elements that need a gentle contrast.

accent

#DDA0DD - A vibrant yet soft purple, ideal for calls-to-action, interactive elements, or small decorative details that require a magical pop.

background

#F0F8FF - A near-white, airy blue, serving as a clean, expansive canvas for content, ensuring lightness and breathability.

text

#D1FFEA - A very light mint green. For body text, consider a dark grey like #333333 for readability. Use #D1FFEA for large headings or decorative text against darker backgrounds within the palette.

Accessibility notes

Ensure sufficient contrast when pairing light pastels like #D1FFEA or #FFEFD5 with white text; a dark text is generally required.
For interactive elements, use #DDA0DD against lighter backgrounds for better visibility and clear distinction.
Avoid using #F0F8FF as a background for light text; it's too subtle and will fail contrast guidelines.
Check color contrast ratios for all text and UI elements, especially with the very light colors, to ensure readability.

Recommended combinations

Whimsical UI

A base of #F0F8FF with #E6E6FA for content panels and #DDA0DD for interactive buttons or highlights.

#F0F8FF · #E6E6FA · #DDA0DD

Dreamy Illustration

Use #D1FFEA and #FFEFD5 for large areas and blend #DDA0DD for magical details or focal points.

#D1FFEA · #FFEFD5 · #DDA0DD

Soft Branding

A pastel gradient or layered approach for brand identity, using #F0F8FF as negative space.

#E6E6FA · #FFEFD5 · #F0F8FF

CSS variables

:root {
  --glimmering-pixie-dust-1: #D1FFEA;
  --glimmering-pixie-dust-2: #FFEFD5;
  --glimmering-pixie-dust-3: #E6E6FA;
  --glimmering-pixie-dust-4: #F0F8FF;
  --glimmering-pixie-dust-5: #DDA0DD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "glimmering-pixie-dust": {
        1: "#D1FFEA",
        2: "#FFEFD5",
        3: "#E6E6FA",
        4: "#F0F8FF",
        5: "#DDA0DD",
      }
    }
  }
}

Hex values

Color 1#D1FFEA

Color 2#FFEFD5

Color 3#E6E6FA

Color 4#F0F8FF

Color 5#DDA0DD

Accessibility

Contrast checker

1:1Fail

1.1:1Fail

1:1Fail

1.9:1Fail

1:1Fail

1.1:1Fail

1.8:1Fail

1.1:1Fail

1.7:1Fail

1:1Fail

1.1:1Fail

1.9:1Fail

1.8:1Fail

1.7:1Fail

1.9:1Fail

Similar palettes

More like Glimmering Pixie Dust

Glimmering Pixie Dust

See it in context.

Ready when you are.

Built with Glimmering Pixie Dust.

How to use Glimmering Pixie Dust

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Whimsical UI

Dreamy Illustration

Soft Branding

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Glimmering Pixie Dust