Back to palettes

Palette

Celestial Dreamscape

A heavenly array of soft lavenders, pale pinks, and shimmering blues, like a tranquil view of a distant galaxy.

pastelelegant5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Celestial Dreamscape 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 Celestial Dreamscape.

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

Data visualization

#8B4D6B#B47BA8#E0B4E0#F4DAF4#FDF7FD

Palette guide

How to use Celestial Dreamscape

Overview

The Celestial Dreamscape palette offers a heavenly array of soft lavenders, pale pinks, and shimmering near-whites, evoking a tranquil view of a distant galaxy. With rich tones like #8B4D6B and #B47BA8, transitioning to the delicate #E0B4E0 and #F4DAF4, and culminating in the airy #FDF7FD, this collection embodies elegance and ethereal beauty. Designers and developers can utilize this palette to craft magical, soft, and inviting interfaces, branding, or digital art that exudes a gentle sophistication and a touch of fantasy.

Best used for

  • Bridal and wedding industry branding
  • High-end beauty product packaging
  • Boutique fashion e-commerce
  • Fantasy-themed digital illustrations
  • Elegant event invitations
  • Feminine lifestyle blogs and apps

Suggested color roles

primary

#8B4D6B serves as a deep, anchoring hue for headers, footers, or impactful graphic elements.

secondary

#B47BA8 or #E0B4E0 can be used for card backgrounds, navigation items, or subheadings, providing a softer contrast.

accent

#F4DAF4 or #FDF7FD are perfect for delicate highlights, hover states, or subtle background patterns.

background

#FDF7FD offers a pristine, almost white canvas, ideal for clean and spacious layouts.

text

For light backgrounds, a dark charcoal or black is essential for optimal readability. For darker elements, #FDF7FD provides clear contrast.

Accessibility notes

  • Text on #FDF7FD should be dark (e.g., black or charcoal) to ensure WCAG AA compliance.
  • #8B4D6B provides good contrast for text on #FDF7FD, as does #B47BA8 for larger text.
  • Avoid using #F4DAF4 or #E0B4E0 for body text, especially on light backgrounds, due to low contrast.
  • Ensure interactive elements have clear visual states, as many colors are close in luminance.

Recommended combinations

Romantic Elegance

A sophisticated pairing for dark text on a light background with a complementary accent.

#8B4D6B · #FDF7FD · #B47BA8

Soft Gradient

Ideal for subtle background transitions or large hero image overlays.

#B47BA8 · #E0B4E0 · #F4DAF4

Delicate UI

A clean and readable setup for content-heavy applications requiring a gentle aesthetic.

#FDF7FD · #8B4D6B · #E0B4E0

CSS variables

:root {
  --celestial-dreamscape-1: #8B4D6B;
  --celestial-dreamscape-2: #B47BA8;
  --celestial-dreamscape-3: #E0B4E0;
  --celestial-dreamscape-4: #F4DAF4;
  --celestial-dreamscape-5: #FDF7FD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-dreamscape": {
        1: "#8B4D6B",
        2: "#B47BA8",
        3: "#E0B4E0",
        4: "#F4DAF4",
        5: "#FDF7FD",
      }
    }
  }
}

Related searches

pastel pink purple paletteelegant fantasy colorsethereal branding schemesoft lavender web designmagical UI aesthetic

Palette colors

Hex values

Color 1#8B4D6B
·
Color 2#B47BA8
·
Color 3#E0B4E0
·
Color 4#F4DAF4
·
Color 5#FDF7FD
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.9:1Fail
3.5:1AA18
4.8:1AA
5.9:1AA
2
1.9:1Fail
1.9:1Fail
2.6:1Fail
3.1:1AA18
3
3.5:1AA18
1.9:1Fail
1.4:1Fail
1.7:1Fail
4
4.8:1AA
2.6:1Fail
1.4:1Fail
1.2:1Fail
5
5.9:1AA
3.1:1AA18
1.7:1Fail
1.2:1Fail

Similar palettes

More like Celestial Dreamscape

View all pastel
Celestial Opal Gleam
Dreamweaver's Veil
Pixie Dream Shimmer
Forest Nymph Glow
Starry Opal Iridescence
Aetherial Bloom