Pastel palette

Chalk Garden

Washed greens over a dark olive base. High key without losing legibility.

Chalk Garden swatches

5 colors · 6 of 20 pairs carry body text

Pastel

#3B3D24

dark muted yellow

#556342

dark muted lime

#7E9274

mid muted lime

#9CBD9D

light muted green

#D3F3D4

very light vivid green

CSS

:root {
  --chalk_garden-1: #3b3d24;
  --chalk_garden-2: #556342;
  --chalk_garden-3: #7e9274;
  --chalk_garden-4: #9cbd9d;
  --chalk_garden-5: #d3f3d4;
}

Drop these into :root and reference them anywhere. The names follow the palette so a second palette will not collide with this one.

Take it further

This palette is a starting point. Open it in the generator to change the harmony rule, lock the colors you like and shuffle the rest.

Open in the palette generator Check the first pair for contrast

Which color can sit on which

6 of 20 pairs reach 4.5:1

Contrast ratio of every color in this palette against every other.
On ↓ / text → #3B3D24#556342#7E9274#9CBD9D#D3F3D4
#3B3D24 Same 1.73 3.33 5.42 9.34
#556342 1.73 Same 1.92 3.13 5.4
#7E9274 3.33 1.92 Same 1.63 2.81
#9CBD9D 5.42 3.13 1.63 Same 1.72
#D3F3D4 9.34 5.4 2.81 1.72 Same

Read a row as the background and a column as the text on it. Anything at 4.5:1 or above carries body text; 3:1 covers large text and interface parts.