Scandinavian Liquorice to Blizzard Blue color palette

1D1116Scandinavian Liquorice 6B3600Brown 7E4358Nocturne Red 4B9F9ELagoon DE9263Summer’s End A6E3ECBlizzard Blue

Open in generator Export PNG, PDF, ASE…

About this palette

Scandinavian Liquorice to Blizzard Blue is a 6-color vintage palette: #1D1116 (Scandinavian Liquorice), #6B3600 (Brown), #7E4358 (Nocturne Red), #4B9F9E (Lagoon), #DE9263 (Summer’s End), #A6E3EC (Blizzard Blue). It mixes black, brown, red, turquoise, orange tones and feels warm overall. The strongest text pairing is #1D1116 on #A6E3EC with a contrast ratio of 12.95:1, and 5 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Scandinavian Liquorice	rgb(29, 17, 22)	hsl(335, 26%, 9%)
Brown	rgb(107, 54, 0)	hsl(30, 100%, 21%)
Nocturne Red	rgb(126, 67, 88)	hsl(339, 31%, 38%)
Lagoon	rgb(75, 159, 158)	hsl(179, 36%, 46%)
Summer’s End	rgb(222, 146, 99)	hsl(23, 65%, 63%)
Blizzard Blue	rgb(166, 227, 236)	hsl(188, 65%, 79%)

Accessible color pairs

Pairs with at least 3:1 contrast (large text and UI components); 4.5:1 or more passes WCAG AA for body text.

Aa12.95:1 Super#1D1116 on #A6E3EC
Aa12.95:1 Super#A6E3EC on #1D1116
Aa7.34:1 Very good#1D1116 on #DE9263
Aa7.34:1 Very good#DE9263 on #1D1116
Aa6.88:1 Good#6B3600 on #A6E3EC
Aa6.88:1 Good#A6E3EC on #6B3600
Aa5.90:1 Good#1D1116 on #4B9F9E
Aa5.90:1 Good#4B9F9E on #1D1116

Color blindness preview

CSS variables

/* Scandinavian Liquorice to Blizzard Blue — https://swatchly.xyz/palette/1d1116-6b3600-7e4358-4b9f9e-de9263-a6e3ec */
:root {
  --scandinavian-liquorice: #1d1116;
  --brown: #6b3600;
  --nocturne-red: #7e4358;
  --lagoon: #4b9f9e;
  --summer-s-end: #de9263;
  --blizzard-blue: #a6e3ec;
}

Tailwind CSS v4

/* Scandinavian Liquorice to Blizzard Blue — https://swatchly.xyz/palette/1d1116-6b3600-7e4358-4b9f9e-de9263-a6e3ec */
@theme {
  --color-scandinavian-liquorice: #1d1116;
  --color-scandinavian-liquorice-50: #fcf2f6;
  --color-scandinavian-liquorice-100: #f3e8ec;
  --color-scandinavian-liquorice-200: #e1d3d8;
  --color-scandinavian-liquorice-300: #cbbcc2;
  --color-scandinavian-liquorice-400: #ad9ca3;
  --color-scandinavian-liquorice-500: #8f7f85;
  --color-scandinavian-liquorice-600: #726369;
  --color-scandinavian-liquorice-700: #584b50;
  --color-scandinavian-liquorice-800: #42373b;
  --color-scandinavian-liquorice-900: #30272a;
  --color-scandinavian-liquorice-950: #1d1116;
  --color-brown: #6b3600;
  --color-brown-50: #fff2ea;
  --color-brown-100: #ffe6d4;
  --color-brown-200: #fcccab;
  --color-brown-300: #ebb58e;
  --color-brown-400: #cf9469;
  --color-brown-500: #b4794c;
  --color-brown-600: #975f33;
  --color-brown-700: #7d4a20;
  --color-brown-800: #6b3600;
  --color-brown-900: #512b08;
  --color-brown-950: #351902;
  --color-nocturne-red: #7e4358;
  --color-nocturne-red-50: #fff1f5;
  --color-nocturne-red-100: #ffe3eb;
  --color-nocturne-red-200: #fcc8d8;
  --color-nocturne-red-300: #eaafc2;
  --color-nocturne-red-400: #ce8ea3;
  --color-nocturne-red-500: #b27388;
  --color-nocturne-red-600: #96596e;
  --color-nocturne-red-700: #7e4358;
  --color-nocturne-red-800: #643345;
  --color-nocturne-red-900: #4f2634;
  --color-nocturne-red-950: #331620;
  --color-lagoon: #4b9f9e;
  --color-lagoon-50: #dcfffe;
  --color-lagoon-100: #caf9f8;
  --color-lagoon-200: #b0e9e8;
  --color-lagoon-300: #93d6d4;
  --color-lagoon-400: #6cb9b8;
  --color-lagoon-500: #4b9f9e;
  --color-lagoon-600: #2b8281;
  --color-lagoon-700: #0e6868;
  --color-lagoon-800: #005151;
  --color-lagoon-900: #003e3e;
  --color-lagoon-950: #002726;
  --color-summer-s-end: #de9263;
  --color-summer-s-end-50: #fff5ef;
  --color-summer-s-end-100: #ffe9dc;
  --color-summer-s-end-200: #ffd0b4;
  --color-summer-s-end-300: #f6b58d;
  --color-summer-s-end-400: #de9263;
  --color-summer-s-end-500: #bf7647;
  --color-summer-s-end-600: #a05a2c;
  --color-summer-s-end-700: #844416;
  --color-summer-s-end-800: #6a3206;
  --color-summer-s-end-900: #532400;
  --color-summer-s-end-950: #351500;
  --color-blizzard-blue: #a6e3ec;
  --color-blizzard-blue-50: #defbff;
  --color-blizzard-blue-100: #cdf2f8;
  --color-blizzard-blue-200: #a6e3ec;
  --color-blizzard-blue-300: #98cbd2;
  --color-blizzard-blue-400: #73acb4;
  --color-blizzard-blue-500: #569199;
  --color-blizzard-blue-600: #3c767e;
  --color-blizzard-blue-700: #285e66;
  --color-blizzard-blue-800: #194a51;
  --color-blizzard-blue-900: #0f393f;
  --color-blizzard-blue-950: #052428;
}