White Smoke
#f5f5f5
A cooler, grayer off-white for clean layouts
About White Smoke
On my monitor, White Smoke looks like a sheet of printer paper that's been sitting under soft light. It has that gentle gray hush, but it never goes fully invisible the way Doctor does against pure white.
Compared to Dr. White, you'll notice it's a touch less "clinical blank." The undertone reads slightly more neutral, not quite as cool or deliberate, so it shows up with a calm certainty even when the surrounding surface is bright. I use it for secondary UI like helper text, subtle panel backgrounds, and light dividers in docs-heavy products, especially dashboards and finance apps where you want clarity without the glare. In publishing workflows, it's handy for margins, footnotes, and background fields that need to stay lighter than the main content but still feel real.
One quirk: because it's not as near-white as Doctor, it can show faint texture when paired with thick, pure-white elements. Keep your typographic contrast consistent and it behaves.
Code snippets
Copy this color into your project.
Contrast checker
WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.
On White #ffffff
On Gray 100 #f5f5f5
On Gray 900 #18181b
On Black #000000
Variations
Shades
Darker variations, created by mixing toward black.
Tints
Lighter variations, created by mixing toward white.
Tones
Muted variations, created by reducing saturation.
Hues
Hue rotations around the color wheel.
Temperatures
Warm and cool shifts of this color.
Color harmonies
Suggested palettes
Palettes built around this color.
Community palettes
Published palettes that include this color.