Scampi to Copper Coin Color Palette

About this palette

Scampi to Copper Coin is a 5-color cool palette: #6F609B (Scampi), #005549 (Cape Verde), #A68DE9 (Dreamy Candy Forest), #94F6E1 (Turquoise Pearl), #DB9073 (Copper Coin). It mixes purple, turquoise, orange tones and feels cool overall. The strongest text pairing is #005549 on #94F6E1 with a contrast ratio of 6.90:1, and 1 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Scampi	rgb(111, 96, 155)	hsl(255, 24%, 49%)
Cape Verde	rgb(0, 85, 73)	hsl(172, 100%, 17%)
Dreamy Candy Forest	rgb(166, 141, 233)	hsl(256, 68%, 73%)
Turquoise Pearl	rgb(148, 246, 225)	hsl(167, 84%, 77%)
Copper Coin	rgb(219, 144, 115)	hsl(17, 59%, 65%)

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.

Aa6.90:1 Good#005549 on #94F6E1
Aa6.90:1 Good#94F6E1 on #005549
Aa4.32:1 Poor#6F609B on #94F6E1
Aa4.32:1 Poor#94F6E1 on #6F609B
Aa3.44:1 Poor#005549 on #DB9073
Aa3.44:1 Poor#DB9073 on #005549
Aa3.18:1 Poor#005549 on #A68DE9
Aa3.18:1 Poor#A68DE9 on #005549

Color blindness preview

CSS variables

/* Scampi to Copper Coin — https://swatchly.xyz/palette/6f609b-005549-a68de9-94f6e1-db9073 */
:root {
  --scampi: #6f609b;
  --cape-verde: #005549;
  --dreamy-candy-forest: #a68de9;
  --turquoise-pearl: #94f6e1;
  --copper-coin: #db9073;
}

Tailwind CSS v4

/* Scampi to Copper Coin — https://swatchly.xyz/palette/6f609b-005549-a68de9-94f6e1-db9073 */
@theme {
  --color-scampi: #6f609b;
  --color-scampi-50: #f5f3ff;
  --color-scampi-100: #ece7ff;
  --color-scampi-200: #dacfff;
  --color-scampi-300: #c4b7ef;
  --color-scampi-400: #a596d3;
  --color-scampi-500: #897ab8;
  --color-scampi-600: #6f609b;
  --color-scampi-700: #584b7f;
  --color-scampi-800: #453967;
  --color-scampi-900: #352b51;
  --color-scampi-950: #211935;
  --color-cape-verde: #005549;
  --color-cape-verde-50: #d9fff5;
  --color-cape-verde-100: #ccf6ec;
  --color-cape-verde-200: #b1e4d8;
  --color-cape-verde-300: #96d0c3;
  --color-cape-verde-400: #71b3a4;
  --color-cape-verde-500: #54988a;
  --color-cape-verde-600: #3a7e71;
  --color-cape-verde-700: #25675b;
  --color-cape-verde-800: #005549;
  --color-cape-verde-900: #0a4138;
  --color-cape-verde-950: #022a23;
  --color-dreamy-candy-forest: #a68de9;
  --color-dreamy-candy-forest-50: #f5f2ff;
  --color-dreamy-candy-forest-100: #ebe6ff;
  --color-dreamy-candy-forest-200: #d9ceff;
  --color-dreamy-candy-forest-300: #c4b1ff;
  --color-dreamy-candy-forest-400: #a68de9;
  --color-dreamy-candy-forest-500: #8b72cb;
  --color-dreamy-candy-forest-600: #7158ad;
  --color-dreamy-candy-forest-700: #5b4390;
  --color-dreamy-candy-forest-800: #473276;
  --color-dreamy-candy-forest-900: #37255e;
  --color-dreamy-candy-forest-950: #23153f;
  --color-turquoise-pearl: #94f6e1;
  --color-turquoise-pearl-50: #f0fffb;
  --color-turquoise-pearl-100: #cdfff3;
  --color-turquoise-pearl-200: #94f6e1;
  --color-turquoise-pearl-300: #8ddac9;
  --color-turquoise-pearl-400: #5fbaa8;
  --color-turquoise-pearl-500: #379d8b;
  --color-turquoise-pearl-600: #0a806f;
  --color-turquoise-pearl-700: #006557;
  --color-turquoise-pearl-800: #004e43;
  --color-turquoise-pearl-900: #003c33;
  --color-turquoise-pearl-950: #00261f;
  --color-copper-coin: #db9073;
  --color-copper-coin-50: #fff4f0;
  --color-copper-coin-100: #ffe8df;
  --color-copper-coin-200: #ffcebb;
  --color-copper-coin-300: #f4b39a;
  --color-copper-coin-400: #db9073;
  --color-copper-coin-500: #bc7458;
  --color-copper-coin-600: #9e593e;
  --color-copper-coin-700: #82432a;
  --color-copper-coin-800: #68321c;
  --color-copper-coin-900: #522411;
  --color-copper-coin-950: #351407;
}