Earth Tone Color Palette

Earth tones are the colours of soil, clay and stone — warm browns, ochres and sand. On this page they all sit between 11° and 39° hue, the narrow band between red and yellow. Copy the HEX codes from any scheme below, or generate a harmonious earth-tone palette anchored to your own base colour.

Earth Tone Palette Ideas & HEX Codes

Natural Earth is built around a sienna #A0522D and spans the widest lightness range, 21% to 71%. Earthy Neutrals runs deeper and browner, from #582F0E up to #C2A878. Warm Earth is the lightest and gives you two usable background tones, #DDB892 and #E6CCB2.

Natural Earth

#4A3220
#6F4E37
#A0522D
#C08552
#DAB78F

Earthy Neutrals

#582F0E
#7F4F24
#936639
#A68A64
#C2A878

Warm Earth

#4E342E
#7F5539
#B08968
#DDB892
#E6CCB2

Anchored to an earth tone base — press Space or Generate to roll more schemes. Click a swatch to copy its HEX, lock one to keep it while the rest re-roll, then export as CSS, JSON or HEX.

Free, no sign-up Generated in your browser CSS, JSON & HEX export

Drag in the colour area or the hue bar, or type a HEX / RGB value, then build a scheme anchored to it.

Where Earth Tones Work

Earth tones are all warm, so a second warm hue adds nothing — the useful additions are a cool green or a near-black for contrast. Sage green and olive green are the natural companions; terracotta is the accent when the set needs more red. Sustainable packaging, ceramics, boho interiors and outdoor brands are the usual homes.

Frequently Asked Questions

What HEX codes make an earth tone palette?
Earth tones are warm, natural browns and tans: a deep soil anchor (#4A3220, #582F0E), a mid brown or sienna (#A0522D, #936639) and light sand tints (#DAB78F, #E6CCB2). Keeping the whole set warm and slightly muted gives the grounded, organic feel. The three sets above are worked examples of that: Natural Earth, Earthy Neutrals and Warm Earth, five codes each. The deepest value on this page is #4A3220 and the palest is #E6CCB2; put one on the other and you get 7.7:1, enough for body text at any size under WCAG AA and AAA.
What counts as an earth tone?
Any colour you could dig out of the ground: browns from #4A3220 to #B08968, ochres and siennas such as #A0522D and #936639, and sand tints such as #DAB78F and #E6CCB2. Muted greens and grey-browns qualify too — the test is warmth and restraint, not one specific hue. The Natural Earth row above walks that range in five steps, #4A3220 through #DAB78F, and the other two sets shift the same idea warmer or lighter without leaving the family.
How do I use these colours in CSS?
Click Copy CSS for a ready-to-paste :root block with each colour as a custom property (--color-1, --color-2 and so on), or copy a single HEX straight from any swatch above. Because the picker is seeded with #A0522D, an export taken without changing the base stays inside the earth tone range. The JSON and HEX buttons hand back the same five values as an array and as a comma-separated line, which suit design tokens and quick pasting respectively. Lock a swatch to pin it, then re-roll the other four and export again without losing it.
What is the base HEX, RGB and HSL for this earth tone palette?
The base colour this page is anchored to is #A0522D, which is rgb(160, 82, 45) and hsl(19, 56%, 40%). A hue of 19 degrees puts it in the oranges, and 40% lightness with 56% saturation makes it a mid tone. The colour picker above accepts HEX or R, G and B numbers directly, so you can type any of those in and rebuild the palette around it. The sets above are deliberately not all one hue — that is what the look is built on — but each stays inside the same lightness and saturation range as this base.

More palettes: Autumn palette  ·  Terracotta palette  ·  Rust palette  ·  all colours

Related color tools

Color Palette Generator

Roll random harmonious palettes, or build one from any base colour.

Color tools

→

Image Color Picker

Pick exact HEX, RGB and HSL colors from any image with an eyedropper.

Color tools

→