What are the hex codes in the Scandi Electric Blue & Cadet palette?

The Scandi Electric Blue & Cadet color palette consists of Cadet #6B9399, Dusty Blue #73B2C1, Sky Blue #95D5D9, Electric Blue #B2F9FD.

How should I use the Scandi Electric Blue & Cadet palette on a website?

Use Electric Blue #B2F9FD as the background, Cadet #6B9399 for text, Sky Blue #95D5D9 for buttons and links, and Dusty Blue #73B2C1 for accents. No pair inside the palette reaches 4.5:1, so add black or white for body text.

Which colors in Scandi Electric Blue & Cadet have enough contrast for text?

The highest-contrast pair is #6B9399 on #B2F9FD with a ratio of 2.85:1, which does not meet WCAG AA; add a darker or lighter neutral for body text.

#6B9399Cadet

#73B2C1Dusty Blue

#95D5D9Sky Blue

#B2F9FDElectric Blue

Scandi Electric Blue & Cadet color palette

Scandinavian Muted Cold Teal

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Cadet	`#6B9399`	`rgb(107, 147, 153)`	`hsl(188, 18%, 51%)`	`oklch(63.6% 0.045 208)`
Dusty Blue	`#73B2C1`	`rgb(115, 178, 193)`	`hsl(192, 39%, 60%)`	`oklch(72.6% 0.068 214)`
Sky Blue	`#95D5D9`	`rgb(149, 213, 217)`	`hsl(184, 47%, 72%)`	`oklch(83.1% 0.065 201)`
Electric Blue	`#B2F9FD`	`rgb(178, 249, 253)`	`hsl(183, 95%, 85%)`	`oklch(93.7% 0.070 200)`

Why it works and how to use it

Scandi Electric Blue & Cadet is a monochromatic color palette tagged scandinavian, muted, cold. A monochromatic set: the same hue family from Cadet down to Electric Blue. Saturation is moderate, which keeps it flexible for both interfaces and print. The overall temperature is cool.

With 4 chromatic colors, Sky Blue takes the lead while the rest support. Lightness runs from 51% to 85%. Well suited to websites, presentations and branding.

Background: Electric Blue (#B2F9FD) is the lightest color, so it belongs on large surfaces.
Text: Cadet (#6B9399) on #B2F9FD gives 2.85:1, so pair it with a darker neutral for body copy.
Primary: Sky Blue (#95D5D9) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Dusty Blue (#73B2C1) for highlights, badges and hover states.

No pair inside the palette reaches 4.5:1, so add black or white for body text.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Scandi Electric Blue & Cadet

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary

Card title

Roles are assigned by lightness.

Color blindness simulation

#6B9399

#73B2C1

#95D5D9

#B2F9FD

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#6B9399` on `#B2F9FD`	Aa	2.85:1	Fail
`#6B9399` on `#95D5D9`	Aa	2.04:1	Fail
`#73B2C1` on `#B2F9FD`	Aa	2.01:1	Fail
`#73B2C1` on `#95D5D9`	Aa	1.44:1	Fail
`#6B9399` on `#73B2C1`	Aa	1.42:1	Fail
`#95D5D9` on `#B2F9FD`	Aa	1.4:1	Fail

:root {
  --cadet: #6B9399;
  --dusty-blue: #73B2C1;
  --sky-blue: #95D5D9;
  --electric-blue: #B2F9FD;
}

$cadet: #6B9399;
$dusty-blue: #73B2C1;
$sky-blue: #95D5D9;
$electric-blue: #B2F9FD;

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'cadet': '#6B9399',
        'dusty-blue': '#73B2C1',
        'sky-blue': '#95D5D9',
        'electric-blue': '#B2F9FD',
      },
    },
  },
};

{
  "name": "Scandi Electric Blue & Cadet",
  "colors": [
    "#6B9399",
    "#73B2C1",
    "#95D5D9",
    "#B2F9FD"
  ]
}

background: linear-gradient(135deg, #6B9399, #73B2C1, #95D5D9, #B2F9FD);

Or ask about it in ChatGPT Claude Perplexity

Edit this palette in the generator →

Added 2025-01-03 · Free for commercial use, no attribution needed.

Similar palettes 24 more in this mood