Salt Mountain to Sumptuous Purple color palette

D7FFFESalt Mountain 79855BGreen Relict 2B1212Italian Roast 4CC2DBSkydive 604B82Sumptuous Purple

About this palette

Salt Mountain to Sumptuous Purple is a 5-color cool palette: #D7FFFE (Salt Mountain), #79855B (Green Relict), #2B1212 (Italian Roast), #4CC2DB (Skydive), #604B82 (Sumptuous Purple). It mixes white, green, brown, turquoise, purple tones and feels cool overall. The strongest text pairing is #D7FFFE on #2B1212 with a contrast ratio of 16.38:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Salt Mountain	rgb(215, 255, 254)	hsl(178, 100%, 92%)
Green Relict	rgb(121, 133, 91)	hsl(77, 19%, 44%)
Italian Roast	rgb(43, 18, 18)	hsl(0, 41%, 12%)
Skydive	rgb(76, 194, 219)	hsl(190, 67%, 58%)
Sumptuous Purple	rgb(96, 75, 130)	hsl(263, 27%, 40%)

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.

Aa16.38:1 Super#D7FFFE on #2B1212
Aa16.38:1 Super#2B1212 on #D7FFFE
Aa8.39:1 Very good#2B1212 on #4CC2DB
Aa8.39:1 Very good#4CC2DB on #2B1212
Aa6.94:1 Good#D7FFFE on #604B82
Aa6.94:1 Good#604B82 on #D7FFFE
Aa4.44:1 Poor#79855B on #2B1212
Aa4.44:1 Poor#2B1212 on #79855B

Color blindness preview

CSS variables

/* Salt Mountain to Sumptuous Purple — https://swatchly.xyz/palette/d7fffe-79855b-2b1212-4cc2db-604b82 */
:root {
  --salt-mountain: #d7fffe;
  --green-relict: #79855b;
  --italian-roast: #2b1212;
  --skydive: #4cc2db;
  --sumptuous-purple: #604b82;
}

Tailwind CSS v4

/* Salt Mountain to Sumptuous Purple — https://swatchly.xyz/palette/d7fffe-79855b-2b1212-4cc2db-604b82 */
@theme {
  --color-salt-mountain: #d7fffe;
  --color-salt-mountain-50: #d7fffe;
  --color-salt-mountain-100: #d9f1f1;
  --color-salt-mountain-200: #c2dfde;
  --color-salt-mountain-300: #a8c9c8;
  --color-salt-mountain-400: #86aaa9;
  --color-salt-mountain-500: #6a8e8e;
  --color-salt-mountain-600: #507373;
  --color-salt-mountain-700: #3c5c5c;
  --color-salt-mountain-800: #2c4848;
  --color-salt-mountain-900: #1f3837;
  --color-salt-mountain-950: #112323;
  --color-green-relict: #79855b;
  --color-green-relict-50: #f0f8de;
  --color-green-relict-100: #e4edd0;
  --color-green-relict-200: #ced9b7;
  --color-green-relict-300: #b6c29b;
  --color-green-relict-400: #95a278;
  --color-green-relict-500: #79855b;
  --color-green-relict-600: #606c44;
  --color-green-relict-700: #4c5632;
  --color-green-relict-800: #3b4324;
  --color-green-relict-900: #2d341a;
  --color-green-relict-950: #1c210d;
  --color-italian-roast: #2b1212;
  --color-italian-roast-50: #fff1f1;
  --color-italian-roast-100: #fce5e4;
  --color-italian-roast-200: #ebd0cf;
  --color-italian-roast-300: #d7b8b7;
  --color-italian-roast-400: #b99897;
  --color-italian-roast-500: #9d7c7a;
  --color-italian-roast-600: #806160;
  --color-italian-roast-700: #664a49;
  --color-italian-roast-800: #4f3837;
  --color-italian-roast-900: #3c2928;
  --color-italian-roast-950: #2b1212;
  --color-skydive: #4cc2db;
  --color-skydive-50: #f3fdff;
  --color-skydive-100: #dff9ff;
  --color-skydive-200: #abefff;
  --color-skydive-300: #88ddf1;
  --color-skydive-400: #4cc2db;
  --color-skydive-500: #24a3bb;
  --color-skydive-600: #008399;
  --color-skydive-700: #006779;
  --color-skydive-800: #00505e;
  --color-skydive-900: #003c47;
  --color-skydive-950: #00242c;
  --color-sumptuous-purple: #604b82;
  --color-sumptuous-purple-50: #f7f3ff;
  --color-sumptuous-purple-100: #eee7ff;
  --color-sumptuous-purple-200: #dfcffe;
  --color-sumptuous-purple-300: #c9b7ec;
  --color-sumptuous-purple-400: #ab97d1;
  --color-sumptuous-purple-500: #917bb6;
  --color-sumptuous-purple-600: #76619a;
  --color-sumptuous-purple-700: #604b82;
  --color-sumptuous-purple-800: #4b3a67;
  --color-sumptuous-purple-900: #3a2b51;
  --color-sumptuous-purple-950: #241a35;
}