Misty Morning to Walkie Chalkie color palette

A5CAC6Misty Morning 192422Underworld 25524FHunter 91686BChocolate Temptation FFF6F7Walkie Chalkie

About this palette

Misty Morning to Walkie Chalkie is a 5-color muted palette: #A5CAC6 (Misty Morning), #192422 (Underworld), #25524F (Hunter), #91686B (Chocolate Temptation), #FFF6F7 (Walkie Chalkie). It mixes turquoise, gray, red, white tones and feels cool overall. The strongest text pairing is #192422 on #FFF6F7 with a contrast ratio of 15.02:1, and 4 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Misty Morning	rgb(165, 202, 198)	hsl(174, 26%, 72%)
Underworld	rgb(25, 36, 34)	hsl(169, 18%, 12%)
Hunter	rgb(37, 82, 79)	hsl(176, 38%, 23%)
Chocolate Temptation	rgb(145, 104, 107)	hsl(356, 16%, 49%)
Walkie Chalkie	rgb(255, 246, 247)	hsl(353, 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.

Aa15.02:1 Super#192422 on #FFF6F7
Aa15.02:1 Super#FFF6F7 on #192422
Aa9.01:1 Very good#A5CAC6 on #192422
Aa9.01:1 Very good#192422 on #A5CAC6
Aa8.25:1 Very good#25524F on #FFF6F7
Aa8.25:1 Very good#FFF6F7 on #25524F
Aa4.95:1 Good#A5CAC6 on #25524F
Aa4.95:1 Good#25524F on #A5CAC6

Color blindness preview

CSS variables

/* Misty Morning to Walkie Chalkie — https://swatchly.xyz/palette/a5cac6-192422-25524f-91686b-fff6f7 */
:root {
  --misty-morning: #a5cac6;
  --underworld: #192422;
  --hunter: #25524f;
  --chocolate-temptation: #91686b;
  --walkie-chalkie: #fff6f7;
}

Tailwind CSS v4

/* Misty Morning to Walkie Chalkie — https://swatchly.xyz/palette/a5cac6-192422-25524f-91686b-fff6f7 */
@theme {
  --color-misty-morning: #a5cac6;
  --color-misty-morning-50: #e6faf8;
  --color-misty-morning-100: #daf1ee;
  --color-misty-morning-200: #c3dedb;
  --color-misty-morning-300: #a5cac6;
  --color-misty-morning-400: #87aaa6;
  --color-misty-morning-500: #6b8e8b;
  --color-misty-morning-600: #527470;
  --color-misty-morning-700: #3d5c59;
  --color-misty-morning-800: #2d4846;
  --color-misty-morning-900: #213836;
  --color-misty-morning-950: #122321;
  --color-underworld: #192422;
  --color-underworld-50: #eff7f5;
  --color-underworld-100: #e4edec;
  --color-underworld-200: #d0dad8;
  --color-underworld-300: #b8c4c1;
  --color-underworld-400: #98a5a2;
  --color-underworld-500: #7d8a87;
  --color-underworld-600: #63706d;
  --color-underworld-700: #4e5957;
  --color-underworld-800: #3c4644;
  --color-underworld-900: #2e3735;
  --color-underworld-950: #192422;
  --color-hunter: #25524f;
  --color-hunter-50: #e1fbf9;
  --color-hunter-100: #d5f2ef;
  --color-hunter-200: #bde0dd;
  --color-hunter-300: #a4ccc8;
  --color-hunter-400: #82aeaa;
  --color-hunter-500: #679490;
  --color-hunter-600: #4e7a77;
  --color-hunter-700: #3a6461;
  --color-hunter-800: #25524f;
  --color-hunter-900: #1e3f3d;
  --color-hunter-950: #102826;
  --color-chocolate-temptation: #91686b;
  --color-chocolate-temptation-50: #fff1f2;
  --color-chocolate-temptation-100: #ffe6e7;
  --color-chocolate-temptation-200: #f3d1d3;
  --color-chocolate-temptation-300: #e1bbbd;
  --color-chocolate-temptation-400: #c59b9e;
  --color-chocolate-temptation-500: #ab8184;
  --color-chocolate-temptation-600: #91686b;
  --color-chocolate-temptation-700: #765154;
  --color-chocolate-temptation-800: #5e3d40;
  --color-chocolate-temptation-900: #492e30;
  --color-chocolate-temptation-950: #2f1b1d;
  --color-walkie-chalkie: #fff6f7;
  --color-walkie-chalkie-50: #fff6f7;
  --color-walkie-chalkie-100: #f2eced;
  --color-walkie-chalkie-200: #ded8d9;
  --color-walkie-chalkie-300: #c8c0c1;
  --color-walkie-chalkie-400: #a8a0a1;
  --color-walkie-chalkie-500: #8c8485;
  --color-walkie-chalkie-600: #716a6a;
  --color-walkie-chalkie-700: #5a5354;
  --color-walkie-chalkie-800: #474141;
  --color-walkie-chalkie-900: #363132;
  --color-walkie-chalkie-950: #221e1f;
}