Tan Background
#D2B48C · rgb(210, 180, 140)
About the tan background
Tan (#D2B48C) is brown lifted with white — rgb(210, 180, 140) — named for tanned leather. It's warm, natural and quiet: sand, kraft paper, oatmeal and suntanned skin all live in this range.
It works like a warm beige with more body, making it a favorite for rustic branding, packaging mockups and autumn palettes. Dark brown or charcoal text keeps it fully accessible.
What to use a tan background for
- Kraft-paper and artisan packaging design
- Rustic, western and outdoor branding
- Warm neutral backgrounds in interior mockups
- Autumn palettes with rust, olive and cream
How to use tan in CSS
Copy the snippet below, or click any code chip on this page to grab a single value.
/* Full-page tan background */
body {
margin: 0;
background-color: #D2B48C;
}
/* A single section or element */
.hero {
background-color: rgb(210, 180, 140);
} Tan shades and tints
Click any swatch to copy it. Tints mix tan with white; shades mix it with black.
Tan background FAQ
What is the hex code for tan?
CSS `tan` is #D2B48C — rgb(210, 180, 140), or hsl(34, 44%, 69%). Its moderate saturation separates it from flatter beiges.
Tan vs beige — what's the difference?
Beige #F5F5DC is paler and grayer; tan #D2B48C is darker, warmer and more saturated. Think of tan as beige with leather in it.
What is the hex code for tan?
Tan is #D2B48C in hexadecimal, rgb(210, 180, 140) in RGB and hsl(34, 44%, 69%) in HSL. Paste #D2B48C into any CSS background-color property to use it.
How do I set a tan background in CSS?
Add background-color: #D2B48C; to any element, or apply it to the whole page: body { background-color: #D2B48C; margin: 0; }. You can also use the CSS keyword or the rgb() form — rgb(210, 180, 140) — with identical results.