Back to palettes

Palette

Arctic Serenity Drift

A soothing palette inspired by vast, calm arctic landscapes, evoking a sense of tranquil isolation.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#B0D0E3#8EB8D7#699EC9#D9EBF5#EAF4F9

Palette guide

How to use Arctic Serenity Drift

Overview

The Arctic Serenity Drift palette offers a soothing collection of blues, inspired by vast, calm arctic landscapes and evoking a sense of tranquil isolation. Starting with the soft, muted #B0D0E3, it deepens through #8EB8D7 and #699EC9, providing a gentle progression of cool tones. The palette is balanced by the very light, almost white #D9EBF5 and #EAF4F9, which add an airy, pristine quality. This color scheme is perfectly suited for designers and developers aiming to create experiences that are calming, sophisticated, and clean. It’s ideal for conveying purity and spaciousness in digital interfaces, branding, or editorial content.

Best used for

  • Meditation and mindfulness apps
  • Luxury travel agency branding
  • Environmental research websites
  • Minimalist interior design concepts
  • High-end skincare product packaging
  • Art gallery digital presence

Suggested color roles

primary

The mid-tone #699EC9 provides a solid primary color for headings, buttons, or key informational text, offering good readability.

secondary

Use the slightly lighter #8EB8D7 for secondary text, subheadings, or inactive states, maintaining a harmonious flow.

accent

The very light #D9EBF5 or #EAF4F9 can serve as subtle accents for hover states or delicate highlights, maintaining luminosity.

background

The pristine #EAF4F9 or #D9EBF5 makes an excellent, clean background, ensuring content stands out with clarity.

text

For primary text, a deep charcoal or black is recommended. #699EC9 can be used for secondary text against the lightest backgrounds.

Accessibility notes

  • Ensure sufficient contrast between the darker blues (#699EC9, #8EB8D7) and the lightest backgrounds (#D9EBF5, #EAF4F9) for text.
  • Avoid using the very light blues for text against each other, as their contrast will be insufficient for readability.
  • Verify that all interactive elements meet WCAG AA contrast standards, especially for smaller UI components.
  • Consider using a slightly darker grey or black for body text to guarantee legibility across all screens and devices.

Recommended combinations

Calm Horizon

Excellent for clean layouts, using the mid-blue for titles and the lightest for expansive content areas.

#699EC9 · #8EB8D7 · #EAF4F9

Soft Layers

Ideal for subtle gradients or background textures that need to convey depth without high contrast.

#B0D0E3 · #D9EBF5 · #EAF4F9

Drift & Focus

Use for data representation or progress indicators where a gentle yet clear distinction is needed.

#8EB8D7 · #699EC9 · #D9EBF5

CSS variables

:root {
  --arctic-serenity-drift-1: #B0D0E3;
  --arctic-serenity-drift-2: #8EB8D7;
  --arctic-serenity-drift-3: #699EC9;
  --arctic-serenity-drift-4: #D9EBF5;
  --arctic-serenity-drift-5: #EAF4F9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "arctic-serenity-drift": {
        1: "#B0D0E3",
        2: "#8EB8D7",
        3: "#699EC9",
        4: "#D9EBF5",
        5: "#EAF4F9",
      }
    }
  }
}

Related searches

calm blue color schemeserene cool brandingminimalist blue UIarctic landscape palettetranquil website design

Palette colors

Hex values

Color 1#B0D0E3
·
Color 2#8EB8D7
·
Color 3#699EC9
·
Color 4#D9EBF5
·
Color 5#EAF4F9
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.8:1Fail
1.3:1Fail
1.4:1Fail
2
1.3:1Fail
1.4:1Fail
1.7:1Fail
1.9:1Fail
3
1.8:1Fail
1.4:1Fail
2.3:1Fail
2.6:1Fail
4
1.3:1Fail
1.7:1Fail
2.3:1Fail
1.1:1Fail
5
1.4:1Fail
1.9:1Fail
2.6:1Fail
1.1:1Fail

Similar palettes

More like Arctic Serenity Drift

View all cool