Back to palettes

Palette

Mystical Aurora Borealis

Vibrant and enchanting hues mirroring the dancing lights of the mystical aurora in the polar night sky.

coolnatural5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#003366#0066CC#00CCFF#33FFCC#66FF66

Palette guide

How to use Mystical Aurora Borealis

Overview

The Mystical Aurora Borealis palette captures the vibrant and enchanting essence of the northern lights with its striking cool tones. This collection features a deep midnight blue #003366, a brilliant azure #0066CC, and a radiant sky blue #00CCFF, transitioning into luminous greens like #33FFCC and #66FF66. It's a dynamic palette, ideal for projects requiring a sense of wonder, energy, and digital sophistication. Designers and developers can leverage these hues to create captivating visual experiences that evoke magic, technology, or expansive natural phenomena.

Best used for

  • High-tech and futuristic branding
  • Gaming interfaces and visual effects
  • Digital art and animation projects
  • Event promotions for concerts or festivals
  • Science and technology education platforms
  • Abstract or cosmic-themed website designs

Suggested color roles

primary

A deep, commanding navy blue, excellent for main backgrounds, large headers, or foundational brand elements, providing a sense of depth and mystery (#003366).

secondary

A vibrant blue, perfect for calls to action, important links, or graphical accents that need to stand out with energy (#0066CC).

accent

A luminous aqua green, serving as a bright, attention-grabbing highlight for interactive elements, progress indicators, or dynamic visual effects (#33FFCC).

background

A bright, ethereal sky blue, suitable for lighter backgrounds in sections requiring a vibrant, open feel, or as a gradient base (#00CCFF).

text

A vivid lime green, offering high visibility for headings, titles, or short, impactful text on dark backgrounds, conveying energy (#66FF66). Alternatively, a crisp white for general body text on dark colors like #003366.

Accessibility notes

  • Ensure sufficient contrast for text, especially when using lighter greens like #66FF66 on blues like #0066CC; a darker text color (e.g., white or #003366 if background is light) may be needed.
  • #003366 offers excellent contrast for white text, making it a good choice for primary text on dark backgrounds.
  • Be cautious when combining #00CCFF and #33FFCC for text and background, as contrast may be low.
  • Test visual hierarchy and color blindness compatibility, as some vibrant combinations might be challenging.

Recommended combinations

Deep Sky

A gradient-like blend perfect for creating depth in backgrounds, hero sections, or illustrative elements.

#003366 · #0066CC · #00CCFF

Electric Glow

A high-energy combination ideal for interactive UI elements, progress bars, or vibrant graphic accents.

#0066CC · #33FFCC · #66FF66

Cosmic Contrast

Provides strong visual contrast for impactful headlines, call-to-action buttons, or dark-themed interfaces with bright highlights.

#003366 · #33FFCC · #66FF66

CSS variables

:root {
  --mystical-aurora-borealis-1: #003366;
  --mystical-aurora-borealis-2: #0066CC;
  --mystical-aurora-borealis-3: #00CCFF;
  --mystical-aurora-borealis-4: #33FFCC;
  --mystical-aurora-borealis-5: #66FF66;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mystical-aurora-borealis": {
        1: "#003366",
        2: "#0066CC",
        3: "#00CCFF",
        4: "#33FFCC",
        5: "#66FF66",
      }
    }
  }
}

Related searches

aurora borealis color schemevibrant blue green palettefuturistic UI colorsneon fantasy colorscool digital aesthetics

Palette colors

Hex values

Color 1#003366
·
Color 2#0066CC
·
Color 3#00CCFF
·
Color 4#33FFCC
·
Color 5#66FF66
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.3:1Fail
6.7:1AA
9.8:1AAA
9.6:1AAA
2
2.3:1Fail
2.9:1Fail
4.3:1AA18
4.3:1AA18
3
6.7:1AA
2.9:1Fail
1.5:1Fail
1.4:1Fail
4
9.8:1AAA
4.3:1AA18
1.5:1Fail
1:1Fail
5
9.6:1AAA
4.3:1AA18
1.4:1Fail
1:1Fail

Similar palettes

More like Mystical Aurora Borealis

View all cool
Deep Sea Coral
Emerald Coast Sparkle
Mediterranean Tile Art
Rainforest Jewel Canopy
Aurora Borealis Glow
Azure Coast Relic