Earthy
Clay Oven color palette
Sand, ochre, burnt clay and dark brown for warm, handmade brands.
Open in the palette generatorLock colors, roll new variations with the space bar and export as image or code.
Colors
Click a value to copy it. Each swatch shows its value in the text color that reads best on it.
Color 1
Text in black, contrast 17.5:1
Color 2
Text in black, contrast 10.7:1
Color 3
Text in black, contrast 5.7:1
Color 4
Text in white, contrast 7.3:1
Color 5
Text in white, contrast 13.7:1
Code
The palette as CSS variables for any project and as a theme for Tailwind CSS v4.
CSS variables
:root {
--palette-1: #f4ead5;
--palette-2: #d8b38a;
--palette-3: #c0724f;
--palette-4: #7e4835;
--palette-5: #3e281b;
}
Tailwind theme
@theme {
--color-clay-oven-1: oklch(93.9% 0.03 85.6);
--color-clay-oven-2: oklch(79% 0.07 69.4);
--color-clay-oven-3: oklch(63% 0.11 44.5);
--color-clay-oven-4: oklch(46.1% 0.08 40);
--color-clay-oven-5: oklch(30% 0.04 51.3);
}
Gradients from this palette
The same colors as a gradient. Each card opens the editor with these colors.
Keep working with the palette
Edit the palette or build a full scale from its most colorful entry.
How to use this palette
Use the lightest color as the background and the darkest for text. The strong colors in between work for buttons, links and highlights. Always check the contrast for text; the notes on the swatches show whether black or white reads better.
Similar palettes
All color palettesAutumn Forest
Golden yellow, orange and rust with two forest greens.
Vineyard
Vine leaves, grape red and dark soil, like terraced vineyards in autumn.
Spice Market
Turmeric, paprika, cinnamon and a sprig of sage.
Sandstone
Five warm beige tones from light to dark, ideal for calm interfaces.
Moorland
Muted green, olive and peat brown.
Lemongrass
From lemon yellow through grass green to fir green.