Squid’s Ink to Peacock Pride color palette

070E2ESquid’s Ink 001B08Memorial Black 172255Dark Soul 194537Everglade 005750Cape Verde 006B62Peacock Pride

Open in generator Export PNG, PDF, ASE…

About this palette

Squid’s Ink to Peacock Pride is a 6-color dark, cool palette: #070E2E (Squid’s Ink), #001B08 (Memorial Black), #172255 (Dark Soul), #194537 (Everglade), #005750 (Cape Verde), #006B62 (Peacock Pride). It mixes blue, black, turquoise tones and feels cool overall. The strongest text pairing is #070E2E on #006B62 with a contrast ratio of 2.95:1, and 0 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Squid’s Ink	rgb(7, 14, 46)	hsl(229, 74%, 10%)
Memorial Black	rgb(0, 27, 8)	hsl(138, 100%, 5%)
Dark Soul	rgb(23, 34, 85)	hsl(229, 57%, 21%)
Everglade	rgb(25, 69, 55)	hsl(161, 47%, 18%)
Cape Verde	rgb(0, 87, 80)	hsl(175, 100%, 17%)
Peacock Pride	rgb(0, 107, 98)	hsl(175, 100%, 21%)

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.

Color blindness preview

CSS variables

/* Squid’s Ink to Peacock Pride — https://swatchly.xyz/palette/070e2e-001b08-172255-194537-005750-006b62 */
:root {
  --squid-s-ink: #070e2e;
  --memorial-black: #001b08;
  --dark-soul: #172255;
  --everglade: #194537;
  --cape-verde: #005750;
  --peacock-pride: #006b62;
}

Tailwind CSS v4

/* Squid’s Ink to Peacock Pride — https://swatchly.xyz/palette/070e2e-001b08-172255-194537-005750-006b62 */
@theme {
  --color-squid-s-ink: #070e2e;
  --color-squid-s-ink-50: #f1f5ff;
  --color-squid-s-ink-100: #e3ebff;
  --color-squid-s-ink-200: #cad7f8;
  --color-squid-s-ink-300: #b2c0e6;
  --color-squid-s-ink-400: #91a0c9;
  --color-squid-s-ink-500: #7382ab;
  --color-squid-s-ink-600: #57658b;
  --color-squid-s-ink-700: #404c6d;
  --color-squid-s-ink-800: #2d3753;
  --color-squid-s-ink-900: #1e263b;
  --color-squid-s-ink-950: #070e2e;
  --color-memorial-black: #001b08;
  --color-memorial-black-50: #e8fbec;
  --color-memorial-black-100: #dcf2e1;
  --color-memorial-black-200: #c6dfcb;
  --color-memorial-black-300: #adcab3;
  --color-memorial-black-400: #8bab92;
  --color-memorial-black-500: #6d8d74;
  --color-memorial-black-600: #527059;
  --color-memorial-black-700: #3c5742;
  --color-memorial-black-800: #2a4130;
  --color-memorial-black-900: #1c2e21;
  --color-memorial-black-950: #001b08;
  --color-dark-soul: #172255;
  --color-dark-soul-50: #f1f5ff;
  --color-dark-soul-100: #e4ebff;
  --color-dark-soul-200: #c8d6ff;
  --color-dark-soul-300: #adbff5;
  --color-dark-soul-400: #8c9fda;
  --color-dark-soul-500: #7285c1;
  --color-dark-soul-600: #5a6ca5;
  --color-dark-soul-700: #47578c;
  --color-dark-soul-800: #384675;
  --color-dark-soul-900: #2c3861;
  --color-dark-soul-950: #172255;
  --color-everglade: #194537;
  --color-everglade-50: #e3fcf2;
  --color-everglade-100: #d6f3e7;
  --color-everglade-200: #bee1d3;
  --color-everglade-300: #a3cabb;
  --color-everglade-400: #7faa99;
  --color-everglade-500: #618d7d;
  --color-everglade-600: #477162;
  --color-everglade-700: #32584b;
  --color-everglade-800: #194537;
  --color-everglade-900: #18342a;
  --color-everglade-950: #0c2019;
  --color-cape-verde: #005750;
  --color-cape-verde-50: #d9fef9;
  --color-cape-verde-100: #cbf6ef;
  --color-cape-verde-200: #b0e4dc;
  --color-cape-verde-300: #95d0c8;
  --color-cape-verde-400: #71b3ab;
  --color-cape-verde-500: #549991;
  --color-cape-verde-600: #397f77;
  --color-cape-verde-700: #256962;
  --color-cape-verde-800: #005750;
  --color-cape-verde-900: #08433d;
  --color-cape-verde-950: #012b27;
  --color-peacock-pride: #006b62;
  --color-peacock-pride-50: #d7fff9;
  --color-peacock-pride-100: #c5f7ef;
  --color-peacock-pride-200: #abe7de;
  --color-peacock-pride-300: #8ed3c9;
  --color-peacock-pride-400: #67b6ac;
  --color-peacock-pride-500: #479c91;
  --color-peacock-pride-600: #2a8178;
  --color-peacock-pride-700: #006b62;
  --color-peacock-pride-800: #00544d;
  --color-peacock-pride-900: #00413b;
  --color-peacock-pride-950: #002925;
}