Palette

Aurora Shimmer

Captivating and cool, mirroring the magical dance of the aurora borealis across a dark canvas.

coolenergetic5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Aurora Shimmer 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 Aurora Shimmer.

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

Data visualization

#008080#48D1CC#8A2BE2#8B008B#4B0082

Palette guide

How to use Aurora Shimmer

Overview

The "Aurora Shimmer" palette (ID: aurora-shimmer-2) is captivating and cool, mirroring the magical dance of the aurora borealis across a dark canvas. It features a deep teal #008080, a vibrant aquamarine #48D1CC, an ethereal blue-violet #8A2BE2, a rich dark magenta #8B008B, and a profound indigo #4B0082. This energetic and cool palette is ideal for designers looking to create mystical, sophisticated, or visually captivating experiences. The strong contrasts between the deep, dark tones and the luminous purples and teals make it perfect for digital interfaces, branding, or digital art that aims for a powerful and enchanting aesthetic. It offers depth, vibrancy, and a touch of magic.

Best used for

Luxury event invitations or decor
Cosmic or space-themed branding
High-end fashion or beauty websites
Digital art and fantasy illustrations
Mystical or spiritual content platforms
Nightlife or entertainment branding

Suggested color roles

primary

#4B0082 - A profound indigo, ideal for main brand elements, important headings, or sections that convey depth, luxury, and mystery.

secondary

#008080 - A deep teal, excellent for supporting panels, sub-sections, or subtle backgrounds, adding a layer of sophistication.

accent

#8A2BE2 - An ethereal blue-violet, perfect for calls-to-action, interactive states, or small decorative elements that need to glow and attract attention.

background

#008080 - A deep teal, providing a sophisticated and grounding foundation against which the luminous purples and lighter teal truly shimmer.

text

#48D1CC - A vibrant aquamarine that offers excellent readability on #008080 or #4B0082, or use a crisp white for general body text on darkest backgrounds.

Accessibility notes

Ensure #48D1CC has sufficient contrast when used for text on #008080 or #4B0082 backgrounds.
#8A2BE2 can be used for headings on #008080, but always verify contrast for smaller text.
Avoid using #8B008B text directly on #8A2BE2, as the contrast might be insufficient.
For optimal readability, use a very light color (like #48D1CC or white) for body text on the darkest palette shades.

Recommended combinations

Deep Cosmos

Elegant dark mode UI, sophisticated branding, or dramatic digital backgrounds.

#008080 · #4B0082 · #8B008B

Aurora Sparkle

Vibrant hero sections, celestial infographics, or ethereal artistic designs.

#48D1CC · #8A2BE2 · #8B008B

Night Sky Glow

Dynamic gradient backgrounds, futuristic UI elements, or striking event promotions.

#008080 · #8A2BE2 · #48D1CC

CSS variables

:root {
  --aurora-shimmer-2-1: #008080;
  --aurora-shimmer-2-2: #48D1CC;
  --aurora-shimmer-2-3: #8A2BE2;
  --aurora-shimmer-2-4: #8B008B;
  --aurora-shimmer-2-5: #4B0082;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "aurora-shimmer-2": {
        1: "#008080",
        2: "#48D1CC",
        3: "#8A2BE2",
        4: "#8B008B",
        5: "#4B0082",
      }
    }
  }
}

Hex values

Color 1#008080

Color 2#48D1CC

Color 3#8A2BE2

Color 4#8B008B

Color 5#4B0082

Accessibility

Contrast checker

2.6:1Fail

1.2:1Fail

1.8:1Fail

2.7:1Fail

2.6:1Fail

3.2:1AA18

4.6:1AA

6.9:1AA

1.2:1Fail

3.2:1AA18

1.4:1Fail

2.2:1Fail

1.8:1Fail

4.6:1AA

1.4:1Fail

1.5:1Fail

2.7:1Fail

6.9:1AA

2.2:1Fail

1.5:1Fail

Similar palettes

More like Aurora Shimmer

Arctic Aurora Shimmer