Back to palettes

Palette

Arctic Sea Ice

Crisp blues and whites capture the stark, breathtaking beauty of glacial ice against a vast arctic sea.

coolminimal5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2A526E#5B8AA3#8FC2D1#D1EDF5#1F3B4E

Palette guide

How to use Arctic Sea Ice

Overview

The Arctic Sea Ice palette captures the stark, breathtaking beauty of glacial ice against a vast arctic sea, featuring a range from deep, mysterious blues to crisp, ethereal whites. It includes the profound dark blue #2A526E and an even deeper #1F3B4E for grounding. Mid-tones like #5B8AA3 and #8FC2D1 offer balance, while the lightest shade, #D1EDF5, evokes fresh snow. This palette is highly effective for designers and developers aiming for a sophisticated, cool, and minimalist aesthetic. Its natural progression of tones makes it suitable for creating depth and visual hierarchy in user interfaces, branding, and environmental storytelling projects.

Best used for

  • High-end tech product interfaces
  • Environmental conservation websites
  • Winter sports apparel branding
  • Documentary film aesthetics
  • Minimalist architectural rendering
  • Cold weather travel promotions

Suggested color roles

primary

The deep #1F3B4E serves as a strong primary for foundational elements, navigation, or powerful headings.

secondary

Use #2A526E for secondary actions, subheadings, or as a contrasting dark shade to #1F3B4E.

accent

The lighter #8FC2D1 can be used for interactive elements or subtle highlights, providing a refreshing touch.

background

Employ the very light #D1EDF5 as a clean, expansive background to maximize readability and evoke openness.

text

For body text, #1F3B4E or #2A526E offers excellent readability on light backgrounds. For dark backgrounds, use #D1EDF5.

Accessibility notes

  • Ensure strong contrast between dark colors (#1F3B4E, #2A526E) and light colors (#D1EDF5) for all text.
  • Be cautious when using mid-tones like #5B8AA3 and #8FC2D1 for text, verify WCAG AA compliance against their backgrounds.
  • Interactive elements should have distinct hover/focus states to guide users, especially if using similar blue shades.
  • Prioritize #1F3B4E or black for critical information against #D1EDF5 to ensure maximum readability.

Recommended combinations

Deep Freeze

Excellent for dramatic hero sections, with the dark blues for text/elements and the light for background.

#1F3B4E · #2A526E · #D1EDF5

Glacial Shift

Ideal for softer gradients or layered UI elements, creating a sense of depth and transition.

#5B8AA3 · #8FC2D1 · #D1EDF5

Arctic Contrast

Use for data visualization where distinct categories need to be shown with clear, cool differentiation.

#2A526E · #8FC2D1 · #D1EDF5

CSS variables

:root {
  --arctic-sea-ice-1: #2A526E;
  --arctic-sea-ice-2: #5B8AA3;
  --arctic-sea-ice-3: #8FC2D1;
  --arctic-sea-ice-4: #D1EDF5;
  --arctic-sea-ice-5: #1F3B4E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "arctic-sea-ice": {
        1: "#2A526E",
        2: "#5B8AA3",
        3: "#8FC2D1",
        4: "#D1EDF5",
        5: "#1F3B4E",
      }
    }
  }
}

Related searches

dark blue and white paletteminimalist cool tonesglacial color schemesophisticated blue UIwinter ocean colors

Palette colors

Hex values

Color 1#2A526E
·
Color 2#5B8AA3
·
Color 3#8FC2D1
·
Color 4#D1EDF5
·
Color 5#1F3B4E
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.2:1Fail
4.3:1AA18
6.8:1AA
1.4:1Fail
2
2.2:1Fail
1.9:1Fail
3.1:1AA18
3.1:1AA18
3
4.3:1AA18
1.9:1Fail
1.6:1Fail
6:1AA
4
6.8:1AA
3.1:1AA18
1.6:1Fail
9.6:1AAA
5
1.4:1Fail
3.1:1AA18
6:1AA
9.6:1AAA

Similar palettes

More like Arctic Sea Ice

View all cool