Palette

Astral Bloom Vision

A deep, otherworldly blend of dark purples and soft pinks, evoking blossoms unfolding in a cosmic dreamscape.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Astral Bloom Vision 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 Astral Bloom Vision.

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

Data visualization

#000000#4B0082#8A2BE2#DA70D6#FFC0CB

Palette guide

How to use Astral Bloom Vision

Overview

The Astral Bloom Vision palette is a deep, otherworldly blend of dark purples and soft pinks, evoking blossoms unfolding in a cosmic dreamscape. Featuring pure black #000000 as its foundation, it transitions through the deep indigo of #4B0082, vibrant blue violet #8A2BE2, and ethereal orchid #DA70D6, culminating in the soft light pink of #FFC0CB. This mystical and dreamy palette is perfect for designers and developers aiming to create enchanting, fantasy-driven, or luxury digital experiences. It offers dramatic contrast and a sense of magical wonder, ideal for immersive visuals and captivating branding.

Best used for

Fantasy game art and themes
Mystical brand identities
Spiritual and wellness websites
Luxury event design
Abstract digital art
Enchanting app themes

Suggested color roles

primary

#000000 serves as a deep, immersive primary background, providing dramatic contrast for lighter elements.

secondary

#4B0082 adds a mysterious depth, ideal for secondary backgrounds or prominent sections.

accent

#DA70D6 offers a soft, ethereal glow, perfect for delicate accents, interactive elements, or decorative details.

background

#000000 creates a dramatic, immersive dark background, allowing the vibrant purples and pinks to truly bloom.

text

#FFC0CB ensures excellent readability for primary text on dark backgrounds, or use a crisp white for maximum contrast and elegance.

Accessibility notes

Ensure high contrast for text, especially #FFC0CB on #000000, to meet WCAG AA standards.
Avoid using #DA70D6 or #FFC0CB for small text on similar light backgrounds due to low contrast.
Test color blindness compatibility, as purple and pink shades can be challenging for some users.
Provide clear interactive states using distinct colors to guide users effectively.

Recommended combinations

Cosmic Bloom

A striking combination for dark backgrounds, highlighting ethereal elements with depth.

#000000 · #4B0082 · #DA70D6

Dreamy Glow

Creates a vibrant yet soft glow, ideal for artistic illustrations or atmospheric UI components.

#8A2BE2 · #FFC0CB · #000000

Mystic Depth

A harmonious blend that evokes mystery and subtle beauty, suitable for layered designs.

#4B0082 · #DA70D6 · #FFC0CB

CSS variables

:root {
  --astral-bloom-vision-1: #000000;
  --astral-bloom-vision-2: #4B0082;
  --astral-bloom-vision-3: #8A2BE2;
  --astral-bloom-vision-4: #DA70D6;
  --astral-bloom-vision-5: #FFC0CB;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "astral-bloom-vision": {
        1: "#000000",
        2: "#4B0082",
        3: "#8A2BE2",
        4: "#DA70D6",
        5: "#FFC0CB",
      }
    }
  }
}

Hex values

Color 1#000000

Color 2#4B0082

Color 3#8A2BE2

Color 4#DA70D6

Color 5#FFC0CB

Accessibility

Contrast checker

1.6:1Fail

3.5:1AA18

7.3:1AAA

13.7:1AAA

1.6:1Fail

2.2:1Fail

4.5:1AA18

8.4:1AAA

3.5:1AA18

2.2:1Fail

2.1:1Fail

3.9:1AA18

7.3:1AAA

4.5:1AA18

2.1:1Fail

1.9:1Fail

13.7:1AAA

8.4:1AAA

3.9:1AA18

1.9:1Fail

Similar palettes

More like Astral Bloom Vision

View all dark

Celestial Glimmer Dust

Space Cadet Dreams

Starlight Nebula Dream

Celestial Lanterns

Celestial Night Bloom

Celestial Night Sky