Earth Tones Palette

CSS variables

:root {
  --color-1: #A98467;
  --color-2: #6C584C;
  --color-3: #ADC178;
  --color-4: #DDE5B6;
  --color-5: #F0EAD2;
}

Tailwind config

// tailwind.config.js
colors: {
  "earth-tones-1": "#A98467",
  "earth-tones-2": "#6C584C",
  "earth-tones-3": "#ADC178",
  "earth-tones-4": "#DDE5B6",
  "earth-tones-5": "#F0EAD2",
}

About this palette

The Earth Tones palette is a curated set of 5 colors with their HEX, RGB and ready CSS-variable and Tailwind exports. Click any swatch for that color's full breakdown — conversions, contrast and harmonies.

More palettes