Dainty Peach to Earthworm Color Palette

About this palette

Dainty Peach to Earthworm is a 5-color warm, earthy, vintage palette: #FDD0BF (Dainty Peach), #5F658E (Haunt Mist), #1A1701 (Noir Mystique), #00566C (Sea Creature), #C18365 (Earthworm). It mixes orange, purple, brown, blue tones and feels warm overall. The strongest text pairing is #FDD0BF on #1A1701 with a contrast ratio of 12.81:1, and 3 of its 10 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Dainty Peach	rgb(253, 208, 191)	hsl(16, 94%, 87%)
Haunt Mist	rgb(95, 101, 142)	hsl(232, 20%, 46%)
Noir Mystique	rgb(26, 23, 1)	hsl(53, 93%, 5%)
Sea Creature	rgb(0, 86, 108)	hsl(192, 100%, 21%)
Earthworm	rgb(193, 131, 101)	hsl(20, 43%, 58%)

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.

Aa12.81:1 Super#FDD0BF on #1A1701
Aa12.81:1 Super#1A1701 on #FDD0BF
Aa5.87:1 Good#FDD0BF on #00566C
Aa5.87:1 Good#00566C on #FDD0BF
Aa5.74:1 Good#1A1701 on #C18365
Aa5.74:1 Good#C18365 on #1A1701
Aa4.00:1 Poor#FDD0BF on #5F658E
Aa4.00:1 Poor#5F658E on #FDD0BF

Color blindness preview

CSS variables

/* Dainty Peach to Earthworm — https://swatchly.xyz/palette/fdd0bf-5f658e-1a1701-00566c-c18365 */
:root {
  --dainty-peach: #fdd0bf;
  --haunt-mist: #5f658e;
  --noir-mystique: #1a1701;
  --sea-creature: #00566c;
  --earthworm: #c18365;
}

Tailwind CSS v4

/* Dainty Peach to Earthworm — https://swatchly.xyz/palette/fdd0bf-5f658e-1a1701-00566c-c18365 */
@theme {
  --color-dainty-peach: #fdd0bf;
  --color-dainty-peach-50: #fff5f2;
  --color-dainty-peach-100: #ffe9e1;
  --color-dainty-peach-200: #fdd0bf;
  --color-dainty-peach-300: #e0bbad;
  --color-dainty-peach-400: #c29a8a;
  --color-dainty-peach-500: #a67d6e;
  --color-dainty-peach-600: #896354;
  --color-dainty-peach-700: #6f4c3f;
  --color-dainty-peach-800: #583a2e;
  --color-dainty-peach-900: #452c22;
  --color-dainty-peach-950: #2c1a13;
  --color-haunt-mist: #5f658e;
  --color-haunt-mist-50: #f2f4ff;
  --color-haunt-mist-100: #e5e9ff;
  --color-haunt-mist-200: #ced4f7;
  --color-haunt-mist-300: #b6bce4;
  --color-haunt-mist-400: #959cc7;
  --color-haunt-mist-500: #7980ab;
  --color-haunt-mist-600: #5f658e;
  --color-haunt-mist-700: #4a4f74;
  --color-haunt-mist-800: #393d5d;
  --color-haunt-mist-900: #2b2f49;
  --color-haunt-mist-950: #1a1d30;
  --color-noir-mystique: #1a1701;
  --color-noir-mystique-50: #f8f6e5;
  --color-noir-mystique-100: #eeecd9;
  --color-noir-mystique-200: #dbd9c3;
  --color-noir-mystique-300: #c5c2a9;
  --color-noir-mystique-400: #a6a387;
  --color-noir-mystique-500: #88866a;
  --color-noir-mystique-600: #6c694f;
  --color-noir-mystique-700: #54513a;
  --color-noir-mystique-800: #3f3d29;
  --color-noir-mystique-900: #2d2c1c;
  --color-noir-mystique-950: #1a1701;
  --color-sea-creature: #00566c;
  --color-sea-creature-50: #e8f8ff;
  --color-sea-creature-100: #cff2ff;
  --color-sea-creature-200: #acdff2;
  --color-sea-creature-300: #8dc8de;
  --color-sea-creature-400: #65a8bf;
  --color-sea-creature-500: #468ba2;
  --color-sea-creature-600: #2a6e84;
  --color-sea-creature-700: #00566c;
  --color-sea-creature-800: #074354;
  --color-sea-creature-900: #013442;
  --color-sea-creature-950: #00202a;
  --color-earthworm: #c18365;
  --color-earthworm-50: #ffece3;
  --color-earthworm-100: #ffdbcb;
  --color-earthworm-200: #f5c1a8;
  --color-earthworm-300: #e0a68a;
  --color-earthworm-400: #c18365;
  --color-earthworm-500: #a66a4d;
  --color-earthworm-600: #8b5338;
  --color-earthworm-700: #724027;
  --color-earthworm-800: #5d311b;
  --color-earthworm-900: #4b2512;
  --color-earthworm-950: #321708;
}