Palette

Aurora Borealis Glow

Inspired by the ethereal and dancing lights of the northern aurora against a night sky, full of wonder.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0D1C2E#0F4C5C#0F939D#43C78B#B8E32D

Palette guide

How to use Aurora Borealis Glow

Overview

The "Aurora Borealis Glow" palette (ID: aurora-borealis-glow-3) is inspired by the ethereal and dancing lights of the northern aurora against a night sky, full of wonder and energetic vibrancy. It spans from a deep, mysterious navy #0D1C2E to a rich teal #0F4C5C, a bright aquamarine #0F939D, a luminous seafoam #43C78B, and a striking chartreuse #B8E32D. This dynamic palette is ideal for designers looking to infuse energy, magic, and a strong connection to nature into their projects. The progression from dark, grounding tones to vivid, glowing shades allows for captivating visual compositions, perfect for branding, web design, or digital art that aims to be both sophisticated and lively.

Best used for

Environmental awareness campaigns
Outdoor adventure brands
Sci-fi or fantasy game interfaces
Modern tech company websites
Dynamic digital art and illustrations
Youthful and energetic product branding

Suggested color roles

primary

#0F939D - A bright aquamarine, ideal for main interactive elements, key calls-to-action, or prominent sections that convey clarity and dynamism.

secondary

#0F4C5C - A rich teal, excellent for supporting content, navigation backgrounds, or subheadings, adding depth and sophistication.

accent

#B8E32D - A striking chartreuse, perfect for highlights, hover states, or small decorative elements that need to pop with a vibrant, energetic glow.

background

#0D1C2E - A deep, mysterious navy, providing a sophisticated and grounding foundation against which the lighter, glowing colors can truly shine.

text

#B8E32D - A striking chartreuse that offers excellent readability on #0D1C2E or #0F4C5C, or use a crisp white for general body text on the darkest backgrounds.

Accessibility notes

Ensure #B8E32D or #43C78B has sufficient contrast when used for text on #0D1C2E or #0F4C5C backgrounds.
#0F939D can be used for headings on #0D1C2E, but always verify contrast for smaller text.
Avoid using #0F4C5C text directly on #0F939D, as the contrast might be insufficient.
For optimal readability, use a very light color (like #B8E32D or white) for body text on the darkest palette shades.

Recommended combinations

Deep Ocean

Robust website footers, elegant dashboards, or professional presentations.

#0D1C2E · #0F4C5C · #0F939D

Northern Glow

Vibrant hero sections, engaging infographics, or serene app interfaces.

#0F939D · #43C78B · #B8E32D

Mystic Twilight

Dynamic gradient backgrounds, celestial-themed graphics, or impactful presentations.

#0D1C2E · #43C78B · #B8E32D

CSS variables

:root {
  --aurora-borealis-glow-3-1: #0D1C2E;
  --aurora-borealis-glow-3-2: #0F4C5C;
  --aurora-borealis-glow-3-3: #0F939D;
  --aurora-borealis-glow-3-4: #43C78B;
  --aurora-borealis-glow-3-5: #B8E32D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "aurora-borealis-glow-3": {
        1: "#0D1C2E",
        2: "#0F4C5C",
        3: "#0F939D",
        4: "#43C78B",
        5: "#B8E32D",
      }
    }
  }
}

Hex values

Color 1#0D1C2E

Color 2#0F4C5C

Color 3#0F939D

Color 4#43C78B

Color 5#B8E32D

Accessibility

Contrast checker

1.8:1Fail

4.6:1AA

8:1AAA

11.5:1AAA

1.8:1Fail

2.6:1Fail

4.4:1AA18

6.4:1AA

4.6:1AA

2.6:1Fail

1.7:1Fail

2.5:1Fail

8:1AAA

4.4:1AA18

1.7:1Fail

1.4:1Fail

11.5:1AAA

6.4:1AA

2.5:1Fail

1.4:1Fail

Similar palettes

More like Aurora Borealis Glow

View all vibrant

Celestial Arctic Dance

Northern Lights Magic

Abstract Expression Burst

Aurora Borealis

Aurora Borealis Hues

Aurora Sky Shimmer