cooldark
Nordic Frost Color Palette
Nordic Frost is a cool and dark color palette of 5 colors: Gunmetal (#2e3440), Charcoal (#3b4252), Sky Blue (#88c0d0), Cool Grey (#81a1c1) and White Smoke (#eceff4). Its dominant hue is blue.
The darkest color, Gunmetal, on the lightest, White Smoke, gives a 10.83:1 contrast ratio — enough for body text at WCAG AAA. 5 pairs in this palette pass AA for normal text. Sky Blue (#88c0d0) is its most saturated color and a natural choice for buttons and links.
Colors
- Gunmetal
- Charcoal
- Sky Blue
- Cool Grey
- White Smoke
CSS Output
:root {
--nordic-frost-1: #2e3440;
--nordic-frost-2: #3b4252;
--nordic-frost-3: #88c0d0;
--nordic-frost-4: #81a1c1;
--nordic-frost-5: #eceff4;
}Nordic Frost on a Website
A quick preview on a landing page: the most colorful colors become the primary and accent, a light one the surface. For a more realistic look across many designs, open it in the Palette Visualizer below.
See it on real designs
This is a single preview. The Palette Visualizer shows the palette on 11 designs — dashboards, mobile apps, pricing and blog pages, posters and business cards — lets you change which color plays which role, switch to dark mode and check contrast.
Accessible Color Combinations
Pairs from this palette that work as text on a background, with their WCAG contrast ratio. AA needs 4.5:1 for body text; large text needs 3:1.
- Gunmetal on White Smoke#2e3440 on #eceff410.83:1AAA
- Charcoal on White Smoke#3b4252 on #eceff48.72:1AAA
- Gunmetal on Sky Blue#2e3440 on #88c0d06.24:1AA
- Charcoal on Sky Blue#3b4252 on #88c0d05.02:1AA
- Gunmetal on Cool Grey#2e3440 on #81a1c14.63:1AA
- Charcoal on Cool Grey#3b4252 on #81a1c13.73:1AA Large