NodlumeNeutral · Linear
Paper gradient
Paper is a ramp from a warm off-white to a cream, and it is the gradient you use when a page should not be pure white but should not be a color either. The temperature does the work: warm neutrals read as paper and feel physical, while cool neutrals read as screens and feel clinical. Nothing in it is saturated enough to be named a color.
It is a document background — long-form reading, a blog, documentation — where a full-page gradient would be a distraction and a flat white would be harsh. Dark text holds everywhere. Because both stops are so close, the angle barely matters; set it to 180° so the page is very slightly lighter at the top, the way a lit sheet is.
Card on the gradient
Reading-size text, for contrast.
Gradient border
A solid over the padding box, the gradient under the border box.
Colors
- #fffbeb0%
- #fef3c7100%
CSS
.paper {
background-image: linear-gradient(180deg in oklab, #fffbeb 0%, #fef3c7 100%);
}Tailwind
bg-[image:linear-gradient(180deg_in_oklab,_#fffbeb_0%,_#fef3c7_100%)]
Token
--gradient-paper: linear-gradient(180deg in oklab, #fffbeb 0%, #fef3c7 100%);
Paper, answered
- What are the CSS colors in the Paper gradient?
- Paper uses 2 colors: #fffbeb, #fef3c7. It is a linear gradient, so the angle sets which way it runs. The full value is linear-gradient(180deg in oklab, #fffbeb 0%, #fef3c7 100%) — copy the CSS rule, the Tailwind class or the custom property above, or open it in the playground to change any stop.
- How do I use the Paper gradient in Tailwind CSS?
- Copy the Tailwind tab: it is an arbitrary-value class of the form bg-[image:…], with the spaces in the gradient written as underscores, which Tailwind v3 and v4 both accept for a one-off value. For a value you reuse across the site, register the Token tab's custom property in your theme instead and reference it from a utility.
- Why is the Paper gradient interpolated in oklab?
- Two colors interpolated in sRGB pass through a grayer, darker middle than either end; in oklab the midpoint is perceptually between them, so the ramp stays clean. Every gradient function accepts an in <space> keyword, and oklab is the right default for a color-to-color ramp.