Nature to Muddy Rose Color Palette

About this palette

Nature to Muddy Rose is a 4-color pastel, light, warm palette: #C1D7B7 (Nature), #FFD5C8 (Cinderella), #EDF1CE (Race the Sun), #E0BDB0 (Muddy Rose). It mixes green, pink, white, orange tones and feels warm overall. The strongest text pairing is #EDF1CE on #E0BDB0 with a contrast ratio of 1.50:1, and 0 of its 6 color pairs pass WCAG AA for normal text.

Color codes

Color	RGB	HSL
Nature	rgb(193, 215, 183)	hsl(101, 29%, 78%)
Cinderella	rgb(255, 213, 200)	hsl(14, 100%, 89%)
Race the Sun	rgb(237, 241, 206)	hsl(67, 56%, 88%)
Muddy Rose	rgb(224, 189, 176)	hsl(16, 44%, 78%)

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

/* Nature to Muddy Rose — https://swatchly.xyz/palette/c1d7b7-ffd5c8-edf1ce-e0bdb0 */
:root {
  --nature: #c1d7b7;
  --cinderella: #ffd5c8;
  --race-the-sun: #edf1ce;
  --muddy-rose: #e0bdb0;
}

Tailwind CSS v4

/* Nature to Muddy Rose — https://swatchly.xyz/palette/c1d7b7-ffd5c8-edf1ce-e0bdb0 */
@theme {
  --color-nature: #c1d7b7;
  --color-nature-50: #e7f4e1;
  --color-nature-100: #dbe9d4;
  --color-nature-200: #c1d7b7;
  --color-nature-300: #aec1a5;
  --color-nature-400: #8fa386;
  --color-nature-500: #75896c;
  --color-nature-600: #5d7054;
  --color-nature-700: #495a41;
  --color-nature-800: #384831;
  --color-nature-900: #2a3724;
  --color-nature-950: #192215;
  --color-cinderella: #ffd5c8;
  --color-cinderella-50: #fff9f8;
  --color-cinderella-100: #ffeee9;
  --color-cinderella-200: #ffd5c8;
  --color-cinderella-300: #e1bfb5;
  --color-cinderella-400: #c29d91;
  --color-cinderella-500: #a68074;
  --color-cinderella-600: #886459;
  --color-cinderella-700: #6e4d43;
  --color-cinderella-800: #563b32;
  --color-cinderella-900: #442c25;
  --color-cinderella-950: #2b1a15;
  --color-race-the-sun: #edf1ce;
  --color-race-the-sun-50: #f7f9e6;
  --color-race-the-sun-100: #edf1ce;
  --color-race-the-sun-200: #d9dcc3;
  --color-race-the-sun-300: #c2c5a9;
  --color-race-the-sun-400: #a2a686;
  --color-race-the-sun-500: #878a6a;
  --color-race-the-sun-600: #6c6f51;
  --color-race-the-sun-700: #55583c;
  --color-race-the-sun-800: #42452c;
  --color-race-the-sun-900: #333520;
  --color-race-the-sun-950: #1f2112;
  --color-muddy-rose: #e0bdb0;
  --color-muddy-rose-50: #fff5f2;
  --color-muddy-rose-100: #ffe9e1;
  --color-muddy-rose-200: #efd5cc;
  --color-muddy-rose-300: #e0bdb0;
  --color-muddy-rose-400: #bd9d91;
  --color-muddy-rose-500: #a18175;
  --color-muddy-rose-600: #85665a;
  --color-muddy-rose-700: #6b4f45;
  --color-muddy-rose-800: #553d34;
  --color-muddy-rose-900: #422d26;
  --color-muddy-rose-950: #2a1b16;
}