Palette

Alien Bloom Hues

A fantastical palette inspired by the glowing, otherworldly flora found on a distant alien planet.

vibrantplayful5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Alien Bloom 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 Alien Bloom Hues.

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

Data visualization

#6D3B6C#9C6CAE#CC9FE6#CCF5D0#FFC66C

Palette guide

How to use Alien Bloom Hues

Overview

The Alien Bloom Hues palette is a fantastical collection inspired by glowing, otherworldly flora found on distant planets. Featuring a deep #6D3B6C, vibrant #9C6CAE, ethereal #CC9FE6, soft #CCF5D0, and a radiant #FFC66C, this palette is perfect for designers and developers aiming to create playful, sci-fi, or whimsical aesthetics. These hex codes provide a unique and visually engaging foundation for projects that demand creativity, imagination, and a touch of the extraordinary, ideal for game design, fantasy art, or brands seeking a distinctive, vibrant identity.

Best used for

Sci-fi game design and environments
Fantasy book covers and illustrations
Children's media and animation
Whimsical brand identity
Cosmic or celestial art
Unique fashion accessories marketing

Suggested color roles

primary

Utilize #6D3B6C as the deep, mysterious base for grounding elements, large backgrounds, or primary branding.

secondary

Apply #9C6CAE for supporting sections, subheadings, or larger content blocks, offering a vibrant lavender.

accent

Highlight key information or interactive elements with #FFC66C, a bright, glowing orange-yellow that demands attention.

background

Choose #CCF5D0 for light, ethereal mint green backgrounds, providing a soft, otherworldly canvas for vibrant elements.

text

For optimal readability on light backgrounds, #6D3B6C provides strong contrast. On darker backgrounds like #9C6CAE, #CC9FE6 works well for text.

Accessibility notes

Ensure sufficient contrast between #CCF5D0 and lighter text colors like #CC9FE6 for readability.
The darkest color, #6D3B6C, provides strong contrast for text on #CCF5D0 or #CC9FE6.
Avoid using #CC9FE6 as text on #9C6CAE unless for very large, decorative headlines.
Prioritize contrast for interactive elements to ensure clear user feedback and usability.

Recommended combinations

Cosmic Contrast

Ideal for a strong, fantastical layout with deep purple text, an ethereal accent, and a soft, alien background.

#6D3B6C · #CC9FE6 · #CCF5D0

Glow & Bloom

Excellent for creating layered energetic effects, glowing flora, or vibrant graphic accents.

#9C6CAE · #FFC66C · #6D3B6C

Ethereal Gradient

Perfect for subtle transitions or soft, inviting sections, moving from a light background to vibrant, otherworldly details.

#CCF5D0 · #FFC66C · #9C6CAE

CSS variables

:root {
  --alien-bloom-hues-1: #6D3B6C;
  --alien-bloom-hues-2: #9C6CAE;
  --alien-bloom-hues-3: #CC9FE6;
  --alien-bloom-hues-4: #CCF5D0;
  --alien-bloom-hues-5: #FFC66C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "alien-bloom-hues": {
        1: "#6D3B6C",
        2: "#9C6CAE",
        3: "#CC9FE6",
        4: "#CCF5D0",
        5: "#FFC66C",
      }
    }
  }
}

Hex values

Color 1#6D3B6C

Color 2#9C6CAE

Color 3#CC9FE6

Color 4#CCF5D0

Color 5#FFC66C

Accessibility

Contrast checker

2.1:1Fail

3.9:1AA18

7:1AAA

5.4:1AA

2.1:1Fail

1.9:1Fail

3.4:1AA18

2.6:1Fail

3.9:1AA18

1.9:1Fail

1.8:1Fail

1.4:1Fail

7:1AAA

3.4:1AA18

1.8:1Fail

1.3:1Fail

5.4:1AA

2.6:1Fail

1.4:1Fail

1.3:1Fail

Similar palettes

More like Alien Bloom Hues

View all vibrant

Absinthe Spirit

Bauhaus Geometry Play

Berry Blossom

Berry Patch Bliss

Bohemian Bazaar Flair

Bohemian Rhapsody Bloom