Palette

Cosmic Cloud Bloom

Imagine distant cosmic clouds blossoming with otherworldly purples and lavenders, creating a serene, magical vista.

vibrantelegant5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cosmic Cloud Bloom 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 Cosmic Cloud Bloom.

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

Data visualization

#2B073A#4E1F6B#8D4CA9#C29FD4#F1E6F7

Palette guide

How to use Cosmic Cloud Bloom

Overview

The Cosmic Cloud Bloom palette offers an elegant journey from profound purples to ethereal lavenders, featuring shades like the deep #2B073A, the rich #4E1F6B, and the serene #F1E6F7. This collection captures the essence of otherworldly cosmic clouds blossoming with magical vistas, providing a sophisticated and calming aesthetic. Designers can leverage the darker tones for grounding elements and the lighter hues to create an expansive, airy feel. Developers will find these hex codes excellent for crafting immersive digital experiences, from elegant website themes to serene mobile applications, ensuring visual harmony and user engagement across various platforms with a touch of cosmic mystery.

Best used for

Luxury lifestyle brand websites
Meditation or wellness app interfaces
Ethereal photography and art portfolios
High-end event branding and invitations
Fashion editorial layouts and lookbooks
Interior design inspiration for serene spaces

Suggested color roles

primary

Designate #4E1F6B as a sophisticated primary, ideal for main navigation, key headings, or defining brand elements.

secondary

Utilize #8D4CA9 as a versatile secondary color, suitable for subheadings, active states, or background sections that need depth.

accent

Apply #C29FD4 as a luminous accent, perfect for highlights, interactive elements, or small details that require a gentle glow.

background

Use the deep #2B073A for an immersive dark background, or #F1E6F7 for a very light, ethereal background for contrast.

text

White or a very light gray is highly recommended for text on #2B073A or #4E1F6B. Use #2B073A for text on #F1E6F7.

Accessibility notes

Ensure white text on #2B073A and #4E1F6B meets WCAG AA contrast standards for readability.
Avoid placing #F1E6F7 text on #C29FD4 as their contrast may be insufficient for accessibility; reserve for larger graphics.
The light #F1E6F7 provides excellent contrast for darker palette colors like #2B073A, making it suitable for backgrounds with dark text.
For body text on #C29FD4, consider using #4E1F6B or a standard dark charcoal for better legibility.

Recommended combinations

Mystic Depth

Combine the deepest shade for backgrounds, a mid-tone for key elements, and the lightest for highlights or text.

#2B073A · #4E1F6B · #F1E6F7

Lavender Bloom

Create soft gradients or layered visual effects, mimicking the gentle transition of cosmic clouds.

#4E1F6B · #8D4CA9 · #C29FD4

Ethereal Contrast

Use #F1E6F7 as a light background with #2B073A for primary text and #8D4CA9 for secondary information or links.

#F1E6F7 · #2B073A · #8D4CA9

CSS variables

:root {
  --cosmic-cloud-bloom-1: #2B073A;
  --cosmic-cloud-bloom-2: #4E1F6B;
  --cosmic-cloud-bloom-3: #8D4CA9;
  --cosmic-cloud-bloom-4: #C29FD4;
  --cosmic-cloud-bloom-5: #F1E6F7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-cloud-bloom": {
        1: "#2B073A",
        2: "#4E1F6B",
        3: "#8D4CA9",
        4: "#C29FD4",
        5: "#F1E6F7",
      }
    }
  }
}

Hex values

Color 1#2B073A

Color 2#4E1F6B

Color 3#8D4CA9

Color 4#C29FD4

Color 5#F1E6F7

Accessibility

Contrast checker

1.5:1Fail

3.1:1AA18

7.7:1AAA

14.6:1AAA

1.5:1Fail

2.2:1Fail

5.3:1AA

10:1AAA

3.1:1AA18

2.2:1Fail

2.5:1Fail

4.7:1AA

7.7:1AAA

5.3:1AA

2.5:1Fail

1.9:1Fail

14.6:1AAA

10:1AAA

4.7:1AA

1.9:1Fail

Similar palettes

More like Cosmic Cloud Bloom

View all vibrant

Nebula Veil Glimmer

Cosmic Dust Swirl

Cosmic Iridescent Shine

Cosmic Nebula Hues

Celestial Opal Glow

Celestial Stardust Glaze