Shore to Walkie Chalkie Color Palette

About this palette

Shore to Walkie Chalkie is a 5-color pastel, light, cool palette: #7FD6C2 (Shore), #C1D89B (In Good Taste), #D5CDFF (Innocent Snowdrop), #E2F1B5 (Sour), #FCF4FF (Walkie Chalkie). It mixes turquoise, green, purple, white tones and feels cool overall. The strongest text pairing is #7FD6C2 on #FCF4FF with a contrast ratio of 1.59:1, and 0 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Shore	rgb(127, 214, 194)	hsl(166, 51%, 67%)
In Good Taste	rgb(193, 216, 155)	hsl(83, 44%, 73%)
Innocent Snowdrop	rgb(213, 205, 255)	hsl(250, 100%, 90%)
Sour	rgb(226, 241, 181)	hsl(75, 68%, 83%)
Walkie Chalkie	rgb(252, 244, 255)	hsl(284, 100%, 98%)

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

/* Shore to Walkie Chalkie — https://swatchly.xyz/palette/7fd6c2-c1d89b-d5cdff-e2f1b5-fcf4ff */
:root {
  --shore: #7fd6c2;
  --in-good-taste: #c1d89b;
  --innocent-snowdrop: #d5cdff;
  --sour: #e2f1b5;
  --walkie-chalkie: #fcf4ff;
}

Tailwind CSS v4

/* Shore to Walkie Chalkie — https://swatchly.xyz/palette/7fd6c2-c1d89b-d5cdff-e2f1b5-fcf4ff */
@theme {
  --color-shore: #7fd6c2;
  --color-shore-50: #dcfff6;
  --color-shore-100: #c6f9ec;
  --color-shore-200: #aae8d8;
  --color-shore-300: #7fd6c2;
  --color-shore-400: #62b5a2;
  --color-shore-500: #409987;
  --color-shore-600: #207d6c;
  --color-shore-700: #016455;
  --color-shore-800: #004f42;
  --color-shore-900: #003c32;
  --color-shore-950: #00261f;
  --color-in-good-taste: #c1d89b;
  --color-in-good-taste-50: #e7f5d0;
  --color-in-good-taste-100: #daeac1;
  --color-in-good-taste-200: #c1d89b;
  --color-in-good-taste-300: #aec28d;
  --color-in-good-taste-400: #90a56c;
  --color-in-good-taste-500: #768b51;
  --color-in-good-taste-600: #5e713a;
  --color-in-good-taste-700: #4a5b28;
  --color-in-good-taste-800: #3a491b;
  --color-in-good-taste-900: #2c3811;
  --color-in-good-taste-950: #1a2307;
  --color-innocent-snowdrop: #d5cdff;
  --color-innocent-snowdrop-50: #f3f1ff;
  --color-innocent-snowdrop-100: #e9e5ff;
  --color-innocent-snowdrop-200: #d5cdff;
  --color-innocent-snowdrop-300: #bfb8e3;
  --color-innocent-snowdrop-400: #a099c6;
  --color-innocent-snowdrop-500: #857dab;
  --color-innocent-snowdrop-600: #6c648f;
  --color-innocent-snowdrop-700: #564e75;
  --color-innocent-snowdrop-800: #433c5f;
  --color-innocent-snowdrop-900: #332e4b;
  --color-innocent-snowdrop-950: #201c30;
  --color-sour: #e2f1b5;
  --color-sour-50: #eff8d7;
  --color-sour-100: #e2f1b5;
  --color-sour-200: #d0dcb0;
  --color-sour-300: #bac694;
  --color-sour-400: #9aa871;
  --color-sour-500: #808c55;
  --color-sour-600: #66723c;
  --color-sour-700: #505b29;
  --color-sour-800: #3e471b;
  --color-sour-900: #2f3711;
  --color-sour-950: #1d2207;
  --color-walkie-chalkie: #fcf4ff;
  --color-walkie-chalkie-50: #fcf4ff;
  --color-walkie-chalkie-100: #f0ebf2;
  --color-walkie-chalkie-200: #dcd6de;
  --color-walkie-chalkie-300: #c6bfc8;
  --color-walkie-chalkie-400: #a69fa9;
  --color-walkie-chalkie-500: #8b848d;
  --color-walkie-chalkie-600: #706972;
  --color-walkie-chalkie-700: #59535b;
  --color-walkie-chalkie-800: #454047;
  --color-walkie-chalkie-900: #353137;
  --color-walkie-chalkie-950: #211e22;
}