Scampi to Imperial Lilac Color Palette

About this palette

Scampi to Imperial Lilac is a 5-color vintage palette: #7969A5 (Scampi), #162D28 (Swamp Thing), #F8CCAA (Polly), #61462D (Irish Coffee), #A39CC4 (Imperial Lilac). It mixes purple, gray, orange, brown tones and feels balanced overall. The strongest text pairing is #162D28 on #F8CCAA with a contrast ratio of 9.87:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Scampi	rgb(121, 105, 165)	hsl(256, 25%, 53%)
Swamp Thing	rgb(22, 45, 40)	hsl(167, 34%, 13%)
Polly	rgb(248, 204, 170)	hsl(26, 85%, 82%)
Irish Coffee	rgb(97, 70, 45)	hsl(29, 37%, 28%)
Imperial Lilac	rgb(163, 156, 196)	hsl(250, 25%, 69%)

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.

Aa9.87:1 Very good#162D28 on #F8CCAA
Aa9.87:1 Very good#F8CCAA on #162D28
Aa5.87:1 Good#F8CCAA on #61462D
Aa5.87:1 Good#61462D on #F8CCAA
Aa5.63:1 Good#162D28 on #A39CC4
Aa5.63:1 Good#A39CC4 on #162D28
Aa3.35:1 Poor#61462D on #A39CC4
Aa3.35:1 Poor#A39CC4 on #61462D

Color blindness preview

CSS variables

/* Scampi to Imperial Lilac — https://swatchly.xyz/palette/7969a5-162d28-f8ccaa-61462d-a39cc4 */
:root {
  --scampi: #7969a5;
  --swamp-thing: #162d28;
  --polly: #f8ccaa;
  --irish-coffee: #61462d;
  --imperial-lilac: #a39cc4;
}

Tailwind CSS v4

/* Scampi to Imperial Lilac — https://swatchly.xyz/palette/7969a5-162d28-f8ccaa-61462d-a39cc4 */
@theme {
  --color-scampi: #7969a5;
  --color-scampi-50: #f6f3ff;
  --color-scampi-100: #eee9ff;
  --color-scampi-200: #ddd4ff;
  --color-scampi-300: #c9bcf3;
  --color-scampi-400: #ac9dd9;
  --color-scampi-500: #9282c0;
  --color-scampi-600: #7969a5;
  --color-scampi-700: #605188;
  --color-scampi-800: #4c3e6e;
  --color-scampi-900: #3a2e57;
  --color-scampi-950: #241b39;
  --color-swamp-thing: #162d28;
  --color-swamp-thing-50: #eaf9f5;
  --color-swamp-thing-100: #dff0eb;
  --color-swamp-thing-200: #c8ddd7;
  --color-swamp-thing-300: #b0c7c1;
  --color-swamp-thing-400: #8fa8a1;
  --color-swamp-thing-500: #758e88;
  --color-swamp-thing-600: #5d756f;
  --color-swamp-thing-700: #49605a;
  --color-swamp-thing-800: #394e49;
  --color-swamp-thing-900: #2d3f3b;
  --color-swamp-thing-950: #162d28;
  --color-polly: #f8ccaa;
  --color-polly-50: #fff1e7;
  --color-polly-100: #ffe4d0;
  --color-polly-200: #f8ccaa;
  --color-polly-300: #dcb79b;
  --color-polly-400: #bf9778;
  --color-polly-500: #a47c5c;
  --color-polly-600: #886244;
  --color-polly-700: #6f4c31;
  --color-polly-800: #593b22;
  --color-polly-900: #462c17;
  --color-polly-950: #2d1b0b;
  --color-irish-coffee: #61462d;
  --color-irish-coffee-50: #fff3e8;
  --color-irish-coffee-100: #fce7d5;
  --color-irish-coffee-200: #e9d1bb;
  --color-irish-coffee-300: #d3b89f;
  --color-irish-coffee-400: #b4967c;
  --color-irish-coffee-500: #97795f;
  --color-irish-coffee-600: #795e45;
  --color-irish-coffee-700: #61462d;
  --color-irish-coffee-800: #4b3623;
  --color-irish-coffee-900: #3b2919;
  --color-irish-coffee-950: #25190d;
  --color-imperial-lilac: #a39cc4;
  --color-imperial-lilac-50: #f5f4ff;
  --color-imperial-lilac-100: #ece8ff;
  --color-imperial-lilac-200: #d8d3f3;
  --color-imperial-lilac-300: #c2bcdf;
  --color-imperial-lilac-400: #a39cc4;
  --color-imperial-lilac-500: #8881a7;
  --color-imperial-lilac-600: #6d668b;
  --color-imperial-lilac-700: #565071;
  --color-imperial-lilac-800: #433e5b;
  --color-imperial-lilac-900: #342f47;
  --color-imperial-lilac-950: #201c2e;
}