Back to palettes

Palette

Celestial Dreamscape

A soft, otherworldly blend of lavenders and grays, evoking a serene celestial dream.

coolcalm5 colors
More cool 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

#3E3B5C#6A678E#9C99BE#CFCDE1#2A2840

Palette guide

How to use Celestial Dreamscape

Overview

The Celestial Dreamscape palette offers a serene and sophisticated blend of cool purples and grays, evoking a calm, otherworldly ambiance. Starting with the deep #2A2840 and #3E3B5C, it transitions through the balanced #6A678E and #9C99BE, concluding with the soft, almost pearlescent #CFCDE1. This collection is perfect for designers and developers seeking to create subtle yet impactful experiences, providing a harmonious range for minimalist interfaces, elegant branding, or atmospheric digital environments. Its muted tones ensure a sense of quiet luxury and thoughtful design.

Best used for

  • High-end corporate branding
  • Minimalist web interfaces
  • Luxury product packaging
  • Art gallery websites
  • Serene meditation app designs
  • Sophisticated editorial layouts

Suggested color roles

primary

#2A2840 or #3E3B5C establish a strong, elegant foundation for backgrounds, headers, or main navigation.

secondary

#6A678E provides a balanced mid-tone for secondary content, subheadings, or card backgrounds.

accent

#CFCDE1 can be used for subtle highlights, interactive states, or delicate graphic elements to add a touch of luminosity.

background

#CFCDE1 offers a light, clean canvas, ensuring excellent readability for darker text.

text

For dark backgrounds, #CFCDE1 offers excellent contrast. For light backgrounds, a dark charcoal or #2A2840 ensures readability.

Accessibility notes

  • #2A2840 and #3E3B5C provide strong contrast against #CFCDE1 for text, meeting WCAG AA.
  • Be cautious when using #6A678E or #9C99BE for small text on #CFCDE1, as contrast might be borderline.
  • Avoid placing similar mid-tones for text and background; ensure sufficient luminance difference.
  • For interactive elements, ensure hover/focus states have clear contrast changes.

Recommended combinations

Elegant Depth

A classic dark background, light text, and subtle accent combination for sophisticated UIs.

#2A2840 · #CFCDE1 · #6A678E

Subtle Gradient

Ideal for background fills or section dividers that require a smooth, refined transition.

#3E3B5C · #6A678E · #9C99BE

Clean Readability

Excellent for content-heavy pages, providing a light base with clear, distinct headings.

#CFCDE1 · #3E3B5C · #9C99BE

CSS variables

:root {
  --celestial-dreamscape-2-1: #3E3B5C;
  --celestial-dreamscape-2-2: #6A678E;
  --celestial-dreamscape-2-3: #9C99BE;
  --celestial-dreamscape-2-4: #CFCDE1;
  --celestial-dreamscape-2-5: #2A2840;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-dreamscape-2": {
        1: "#3E3B5C",
        2: "#6A678E",
        3: "#9C99BE",
        4: "#CFCDE1",
        5: "#2A2840",
      }
    }
  }
}

Related searches

cool purple grey paletteminimalist celestial colorselegant UI design schemeserene branding pastelssubtle space aesthetic

Palette colors

Hex values

Color 1#3E3B5C
·
Color 2#6A678E
·
Color 3#9C99BE
·
Color 4#CFCDE1
·
Color 5#2A2840
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
3.9:1AA18
6.8:1AA
1.3:1Fail
2
2:1Fail
2:1Fail
3.4:1AA18
2.7:1Fail
3
3.9:1AA18
2:1Fail
1.7:1Fail
5.2:1AA
4
6.8:1AA
3.4:1AA18
1.7:1Fail
9.1:1AAA
5
1.3:1Fail
2.7:1Fail
5.2:1AA
9.1:1AAA

Similar palettes

More like Celestial Dreamscape

View all cool
Desert Sky Starlight
Galactic Stardust Trail
Cosmic Cloud Dream
Mystic Celestial Dust
Celestial Ocean Gaze
Cloudy Dawn Whisper