Palette

Arctic Aurora Glow

Shimmering greens and blues that capture the ethereal dance of the northern lights over ice.

coolnatural5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0F373E#2A686B#53A09F#8DD3CC#C7F6F3

Palette guide

How to use Arctic Aurora Glow

Overview

The "Arctic Aurora Glow" palette captures the ethereal dance of the northern lights over ice with shimmering greens and blues. This cool, mysterious collection features a gradient from the deep Dark Cyan #0F373E and the profound Teal Green #2A686B to the balanced Medium Aquamarine #53A09F. Lighter, more vibrant tones like Light Sea Green #8DD3CC and the very pale Aquamarine #C7F6F3 complete this harmonious set, evoking a sense of magic and natural wonder. Developers can utilize these shades for sophisticated, immersive interfaces that convey tranquility and a touch of mystique. Designers will find this palette ideal for projects related to nature, luxury travel, wellness, or any brand seeking a serene, elegant, and visually captivating aesthetic.

Best used for

Nature conservation websites
Ecotourism branding
Winter sports apparel
Wellness and meditation apps
Fantasy novel covers
High-end technology interfaces

Suggested color roles

primary

A very deep dark cyan #0F373E, providing a strong, sophisticated foundation for backgrounds, headers, or primary branding.

secondary

A rich teal green #2A686B that adds depth and elegance, suitable for large content blocks, sidebars, or secondary navigation.

accent

A balanced medium aquamarine #53A09F that offers a subtle yet distinct accent, perfect for calls to action, important highlights, or interactive elements.

background

A very light aquamarine #C7F6F3, offering a clean, expansive backdrop that enhances readability and maintains the icy, serene feel.

text

Use #C7F6F3 for body text and headings on dark backgrounds like #0F373E or #2A686B, or pure white for maximum contrast.

Accessibility notes

Ensure sufficient contrast for light text (e.g., #C7F6F3 or white) against dark backgrounds like #0F373E and #2A686B.
The lighter shades like #8DD3CC and #C7F6F3 are generally not suitable for small body text; use a dark neutral on these.
Use a very dark neutral (e.g., black or charcoal) for all body text on the lightest backgrounds to ensure wcag compliance.
Interactive elements should have clear visual feedback, potentially using the slightly brighter #53A09F for hover states.

Recommended combinations

Aurora Depths

For establishing a deep, calming base in websites or apps, with dark cyan as primary, light aquamarine as background, and teal green for panels.

#0F373E · #C7F6F3 · #2A686B

Mystic Shimmer

Ideal for gradients or visual effects that simulate the aurora's gentle glow, adding an ethereal and magical quality.

#53A09F · #8DD3CC · #C7F6F3

Northern Light

Effective for highlighting important information or calls to action, using teal green for buttons, medium aquamarine for text, and dark cyan for context.

#2A686B · #53A09F · #0F373E

CSS variables

:root {
  --arctic-aurora-glow-1: #0F373E;
  --arctic-aurora-glow-2: #2A686B;
  --arctic-aurora-glow-3: #53A09F;
  --arctic-aurora-glow-4: #8DD3CC;
  --arctic-aurora-glow-5: #C7F6F3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "arctic-aurora-glow": {
        1: "#0F373E",
        2: "#2A686B",
        3: "#53A09F",
        4: "#8DD3CC",
        5: "#C7F6F3",
      }
    }
  }
}

Hex values

Color 1#0F373E

Color 2#2A686B

Color 3#53A09F

Color 4#8DD3CC

Color 5#C7F6F3

Accessibility

Contrast checker

2:1Fail

4.2:1AA18

7.5:1AAA

10.9:1AAA

2:1Fail

2.1:1Fail

3.7:1AA18

5.4:1AA

4.2:1AA18

2.1:1Fail

1.8:1Fail

2.6:1Fail

7.5:1AAA

3.7:1AA18

1.8:1Fail

1.5:1Fail

10.9:1AAA

5.4:1AA

2.6:1Fail

1.5:1Fail

Similar palettes

More like Arctic Aurora Glow

View all cool

Cosmic Dust Shimmer

Mystical Aurora Borealis