Back to palettes

Palette

Arctic Whisper

Captures the serene silence of a polar landscape, with frosty blues and gentle icy greens.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#ADD8E6#87CEEB#4682B4#20B2AA#008B8B

Palette guide

How to use Arctic Whisper

Overview

The Arctic Whisper palette delivers a crisp, cool, and deeply serene aesthetic, perfectly capturing the essence of icy landscapes and tranquil waters. Dominated by blues and teals, from the soft #ADD8E6 to the rich #008B8B, this palette offers a refreshing yet profound visual experience. Shades like #87CEEB and #4682B4 provide excellent depth for various design applications, while #20B2AA introduces a vibrant, cool accent. Ideal for projects demanding clarity, trust, and a soothing presence, it's a versatile choice for digital interfaces, branding, and editorial content seeking a cool, professional touch.

Best used for

  • Tech and software company branding
  • Maritime or ocean-themed designs
  • Winter sport marketing materials
  • Clean, professional corporate websites
  • Environmental conservation initiatives
  • Spa and relaxation app interfaces

Suggested color roles

primary

Utilize #4682B4 as a strong, trustworthy primary color for headings, main buttons, or key informational blocks.

secondary

Employ #87CEEB for sub-sections, background elements, or supporting graphics, offering a lighter, harmonious complement.

accent

Use #008B8B or #20B2AA for impactful accents, interactive elements, or crucial calls to action, adding depth and vibrancy.

background

Apply #ADD8E6 for light, airy backgrounds, ensuring content stands out while maintaining a calm overall feel.

text

For optimal readability, use a dark charcoal (e.g., #222222) for body text. #4682B4 or #008B8B can work well for headings on light backgrounds.

Accessibility notes

  • Ensure sufficient contrast with #ADD8E6 backgrounds by using darker text like #4682B4 or #008B8B.
  • Text in #008B8B on #ADD8E6 provides excellent contrast, suitable for WCAG AA compliance.
  • Avoid placing #87CEEB text directly on #ADD8E6 for small font sizes due to potential contrast issues.
  • The darker shades, #4682B4 and #008B8B, offer strong readability against light backgrounds.

Recommended combinations

Icy Depths

Creates a profound and trustworthy impression, ideal for corporate or educational platforms.

#ADD8E6 · #4682B4 · #008B8B

Aqua Fresh

Perfect for refreshing and dynamic designs, suitable for tech startups or vibrant digital experiences.

#87CEEB · #20B2AA · #ADD8E6

Serene Flow

Offers a smooth, calming gradient for backgrounds or large visual elements, promoting tranquility.

#ADD8E6 · #87CEEB · #4682B4

CSS variables

:root {
  --arctic-whisper-1: #ADD8E6;
  --arctic-whisper-2: #87CEEB;
  --arctic-whisper-3: #4682B4;
  --arctic-whisper-4: #20B2AA;
  --arctic-whisper-5: #008B8B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "arctic-whisper": {
        1: "#ADD8E6",
        2: "#87CEEB",
        3: "#4682B4",
        4: "#20B2AA",
        5: "#008B8B",
      }
    }
  }
}

Related searches

cool blue green designarctic color schemeteal and blue palettewinter serenity colorscalm professional palette

Palette colors

Hex values

Color 1#ADD8E6
·
Color 2#87CEEB
·
Color 3#4682B4
·
Color 4#20B2AA
·
Color 5#008B8B
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
2.7:1Fail
1.7:1Fail
2.7:1Fail
2
1.1:1Fail
2.4:1Fail
1.5:1Fail
2.4:1Fail
3
2.7:1Fail
2.4:1Fail
1.6:1Fail
1:1Fail
4
1.7:1Fail
1.5:1Fail
1.6:1Fail
1.6:1Fail
5
2.7:1Fail
2.4:1Fail
1:1Fail
1.6:1Fail

Similar palettes

More like Arctic Whisper

View all cool