Off-White Background
#FAF9F6 · rgb(250, 249, 246)
About the off-white background
Off-white (#FAF9F6) is pure white with a whisper of warmth. That tiny reduction in brightness — rgb(250, 249, 246) — takes the glare out of large empty areas, which is why so many modern sites and e-readers use off-white instead of #FFFFFF for page backgrounds.
Designers reach for off-white when they want the cleanliness of white without the clinical feel. It pairs beautifully with black text at WCAG-friendly contrast levels and hides fingerprint-level dirt in photography backdrops far better than pure white.
What to use a off-white background for
- Website and app backgrounds that are gentler on the eyes
- E-readers, note apps and long-form reading surfaces
- Photography backdrops with a soft, natural white
- Premium packaging and stationery mockups
How to use off-white in CSS
Copy the snippet below, or click any code chip on this page to grab a single value.
/* Full-page off-white background */
body {
margin: 0;
background-color: #FAF9F6;
}
/* A single section or element */
.hero {
background-color: rgb(250, 249, 246);
} Off-White shades and tints
Click any swatch to copy it. Tints mix off-white with white; shades mix it with black.
Off-White background FAQ
Why use off-white instead of pure white?
At rgb(250, 249, 246), off-white cuts glare on large screens and in dim rooms while still reading as white. It's the standard trick for reducing eye strain on content-heavy pages.
What text color works on an off-white background?
Off-white #FAF9F6 scores about 20:1 contrast against black — far beyond WCAG AAA — so black or near-black text is always the right choice.
What is the hex code for off-white?
Off-White is #FAF9F6 in hexadecimal, rgb(250, 249, 246) in RGB and hsl(45, 29%, 97%) in HSL. Paste #FAF9F6 into any CSS background-color property to use it.
How do I set a off-white background in CSS?
Add background-color: #FAF9F6; to any element, or apply it to the whole page: body { background-color: #FAF9F6; margin: 0; }. You can also use the CSS keyword or the rgb() form — rgb(250, 249, 246) — with identical results.