Palette

Celestial Dawn Hues

A dreamy transition from deep space purples to the soft, ethereal pinks of a distant dawn.

coolelegant5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2F1A4E#5B3A7E#8E60B8#C38BDE#F3BAFD

Palette guide

How to use Celestial Dawn Hues

Overview

The Celestial Dawn Hues palette offers a dreamy transition from deep space purples to the soft, ethereal pinks of a distant dawn. It features a profound dark purple #2F1A4E, transitioning through richer purples like #5B3A7E and #8E60B8. The lighter lavender #C38BDE and the soft, glowing pink #F3BAFD complete this harmonious collection. This palette is ideal for designers and developers aiming for an elegant, mystical, and sophisticated aesthetic. It's perfect for projects requiring a sense of cosmic wonder, gentle beauty, and understated luxury, from artistic websites to high-end branding.

Best used for

Luxury fashion or beauty brands
Mystical or spiritual themed apps
Elegant digital art and illustrations
High-end event invitations
Dreamy lifestyle blogs
Sophisticated mobile app interfaces

Suggested color roles

primary

#2F1A4E - A deep, dark purple, ideal for foundational backgrounds, headers, or main structural elements, providing depth and elegance.

secondary

#5B3A7E - Use for subheadings, navigation, or large content blocks, offering a rich purple that adds sophistication.

accent

#F3BAFD - A soft, glowing pink, perfect for subtle highlights, interactive elements, or decorative details that need to shimmer.

background

#F3BAFD - A very light, airy pink-purple, providing an ethereal canvas, or use #2F1A4E for a darker, more dramatic background.

text

White or a very light gray - The palette lacks a sufficiently light color for primary text on dark backgrounds; white offers optimal contrast.

Accessibility notes

Ensure white text on #2F1A4E or #5B3A7E background meets WCAG AAA contrast ratio.
#C38BDE text on #F3BAFD will have insufficient contrast; avoid for critical information.
For body text, stick to white or very light gray on darker backgrounds.
Use #8E60B8 sparingly for text, primarily for larger headings if the background is sufficiently dark.

Recommended combinations

Cosmic Dawn

Deep purple base, mid-purple for content, and glowing pink for accents.

#2F1A4E · #8E60B8 · #F3BAFD

Ethereal Gradient

Rich purple for main elements, lighter lavender for secondary, and deep purple for grounding.

#5B3A7E · #C38BDE · #2F1A4E

Mystic Blush

Strong dark background with a soft pink accent and a vibrant purple for highlights.

#2F1A4E · #F3BAFD · #8E60B8

CSS variables

:root {
  --celestial-dawn-hues-1: #2F1A4E;
  --celestial-dawn-hues-2: #5B3A7E;
  --celestial-dawn-hues-3: #8E60B8;
  --celestial-dawn-hues-4: #C38BDE;
  --celestial-dawn-hues-5: #F3BAFD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-dawn-hues": {
        1: "#2F1A4E",
        2: "#5B3A7E",
        3: "#8E60B8",
        4: "#C38BDE",
        5: "#F3BAFD",
      }
    }
  }
}

Hex values

Color 1#2F1A4E

Color 2#5B3A7E

Color 3#8E60B8

Color 4#C38BDE

Color 5#F3BAFD

Accessibility

Contrast checker

1.7:1Fail

3.3:1AA18

5.9:1AA

9.6:1AAA

1.7:1Fail

1.9:1Fail

3.4:1AA18

5.6:1AA

3.3:1AA18

1.9:1Fail

1.8:1Fail

2.9:1Fail

5.9:1AA

3.4:1AA18

1.8:1Fail

1.6:1Fail

9.6:1AAA

5.6:1AA

2.9:1Fail

1.6:1Fail

Similar palettes

More like Celestial Dawn Hues

View all cool

Celestial Nebula Glow

Astral Glow Nebula

Astral Glow Veil

Celestial Comet Dust

Celestial Dust Stream

Celestial Echo Nebula