Gray Background
#808080 · rgb(128, 128, 128)
About the gray background
Gray (#808080) is the exact midpoint of the display range — rgb(128, 128, 128) — and the reference point for all of display calibration. Because half of every channel is lit, it's the standard background for gamma and grayscale test charts.
As a page background, mid-gray is darker and moodier than its lighter siblings. It flatters both black and white text at large sizes, gives photographic content a neutral stage, and never competes with a brand color.
What to use a gray background for
- Display calibration and gamma reference charts
- Moody, neutral backdrops for photo galleries
- Mid-tone UI surfaces, overlays and disabled states
- Balanced canvas for black-and-white typography
How to use gray in CSS
Copy the snippet below, or click any code chip on this page to grab a single value.
/* Full-page gray background */
body {
margin: 0;
background-color: #808080;
}
/* A single section or element */
.hero {
background-color: rgb(128, 128, 128);
} Gray shades and tints
Click any swatch to copy it. Tints mix gray with white; shades mix it with black.
Gray background FAQ
What is the hex code for gray?
Plain gray is #808080 — rgb(128, 128, 128) — exactly 50% on every channel. CSS also accepts the keyword `gray`, which resolves to this same value.
Is gray 50% good for eye strain?
Mid-gray backgrounds reduce the extreme luminance jumps of black-on-white, which some users find more comfortable in dark rooms. Keep text high-contrast (near-white on #808080 measures about 4:1, so use it for large text) and consider lighter grays for long reading.
What is the hex code for gray?
Gray is #808080 in hexadecimal, rgb(128, 128, 128) in RGB and hsl(0, 0%, 50%) in HSL. Paste #808080 into any CSS background-color property to use it.
How do I set a gray background in CSS?
Add background-color: #808080; to any element, or apply it to the whole page: body { background-color: #808080; margin: 0; }. You can also use the CSS keyword or the rgb() form — rgb(128, 128, 128) — with identical results.