Ice Desert to Acorn color palette

D7D8EAIce Desert 45332EDark Rum 7BA291Japanese Bonsai A5C0B2Meadow Morn 4C5472Intergalactic 80604EAcorn

Open in generator Export PNG, PDF, ASE…

About this palette

Ice Desert to Acorn is a 6-color muted palette: #D7D8EA (Ice Desert), #45332E (Dark Rum), #7BA291 (Japanese Bonsai), #A5C0B2 (Meadow Morn), #4C5472 (Intergalactic), #80604E (Acorn). It mixes gray, turquoise, green, blue, brown tones and feels cool overall. The strongest text pairing is #D7D8EA on #45332E with a contrast ratio of 8.44:1, and 3 of its 15 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Ice Desert	rgb(215, 216, 234)	hsl(237, 31%, 88%)
Dark Rum	rgb(69, 51, 46)	hsl(13, 20%, 23%)
Japanese Bonsai	rgb(123, 162, 145)	hsl(154, 17%, 56%)
Meadow Morn	rgb(165, 192, 178)	hsl(149, 18%, 70%)
Intergalactic	rgb(76, 84, 114)	hsl(227, 20%, 37%)
Acorn	rgb(128, 96, 78)	hsl(22, 24%, 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.

Aa8.44:1 Very good#D7D8EA on #45332E
Aa8.44:1 Very good#45332E on #D7D8EA
Aa6.11:1 Good#45332E on #A5C0B2
Aa6.11:1 Good#A5C0B2 on #45332E
Aa5.29:1 Good#D7D8EA on #4C5472
Aa5.29:1 Good#4C5472 on #D7D8EA
Aa4.20:1 Poor#45332E on #7BA291
Aa4.20:1 Poor#7BA291 on #45332E

Color blindness preview

CSS variables

/* Ice Desert to Acorn — https://swatchly.xyz/palette/d7d8ea-45332e-7ba291-a5c0b2-4c5472-80604e */
:root {
  --ice-desert: #d7d8ea;
  --dark-rum: #45332e;
  --japanese-bonsai: #7ba291;
  --meadow-morn: #a5c0b2;
  --intergalactic: #4c5472;
  --acorn: #80604e;
}

Tailwind CSS v4

/* Ice Desert to Acorn — https://swatchly.xyz/palette/d7d8ea-45332e-7ba291-a5c0b2-4c5472-80604e */
@theme {
  --color-ice-desert: #d7d8ea;
  --color-ice-desert-50: #f5f6ff;
  --color-ice-desert-100: #ebecf7;
  --color-ice-desert-200: #d7d8ea;
  --color-ice-desert-300: #c0c1d0;
  --color-ice-desert-400: #a0a1b2;
  --color-ice-desert-500: #858696;
  --color-ice-desert-600: #6a6b7a;
  --color-ice-desert-700: #545462;
  --color-ice-desert-800: #41414d;
  --color-ice-desert-900: #31323c;
  --color-ice-desert-950: #1e1e26;
  --color-dark-rum: #45332e;
  --color-dark-rum-50: #fff2ee;
  --color-dark-rum-100: #f6e7e3;
  --color-dark-rum-200: #e4d3ce;
  --color-dark-rum-300: #d0bcb7;
  --color-dark-rum-400: #b29d97;
  --color-dark-rum-500: #98837d;
  --color-dark-rum-600: #7e6964;
  --color-dark-rum-700: #67544f;
  --color-dark-rum-800: #53423e;
  --color-dark-rum-900: #45332e;
  --color-dark-rum-950: #2b201e;
  --color-japanese-bonsai: #7ba291;
  --color-japanese-bonsai-50: #e1f8ed;
  --color-japanese-bonsai-100: #d3ede1;
  --color-japanese-bonsai-200: #bad9cb;
  --color-japanese-bonsai-300: #9fc2b2;
  --color-japanese-bonsai-400: #7ba291;
  --color-japanese-bonsai-500: #628878;
  --color-japanese-bonsai-600: #4b6f60;
  --color-japanese-bonsai-700: #38594b;
  --color-japanese-bonsai-800: #2a473b;
  --color-japanese-bonsai-900: #1f372d;
  --color-japanese-bonsai-950: #11241c;
  --color-meadow-morn: #a5c0b2;
  --color-meadow-morn-50: #e5f5ed;
  --color-meadow-morn-100: #d8ebe1;
  --color-meadow-morn-200: #c1d6cb;
  --color-meadow-morn-300: #a5c0b2;
  --color-meadow-morn-400: #88a295;
  --color-meadow-morn-500: #6e887b;
  --color-meadow-morn-600: #566f62;
  --color-meadow-morn-700: #43594e;
  --color-meadow-morn-800: #33463d;
  --color-meadow-morn-900: #27372f;
  --color-meadow-morn-950: #16221c;
  --color-intergalactic: #4c5472;
  --color-intergalactic-50: #f2f5ff;
  --color-intergalactic-100: #e4eaff;
  --color-intergalactic-200: #cfd7f1;
  --color-intergalactic-300: #b7c0de;
  --color-intergalactic-400: #97a0c1;
  --color-intergalactic-500: #7c85a5;
  --color-intergalactic-600: #626b89;
  --color-intergalactic-700: #4c5472;
  --color-intergalactic-800: #3b415a;
  --color-intergalactic-900: #2c3246;
  --color-intergalactic-950: #1b1f2d;
  --color-acorn: #80604e;
  --color-acorn-50: #fff2eb;
  --color-acorn-100: #fde5d8;
  --color-acorn-200: #ebd0c0;
  --color-acorn-300: #d7b8a6;
  --color-acorn-400: #b89784;
  --color-acorn-500: #9c7b68;
  --color-acorn-600: #80604e;
  --color-acorn-700: #674b3b;
  --color-acorn-800: #523a2c;
  --color-acorn-900: #402c20;
  --color-acorn-950: #291a12;
}