Tinted neutrals (chromatic grays)
Grays with a whisper of hue mixed in, so they feel warm or cool instead of flat and dead like default #808080.
See it
What it is
A pure gray has zero chroma: red, green, and blue are all the same number (#888888). A tinted neutral nudges it a few points off that line so it carries a faint hue, usually the same hue as your brand color. It still reads as gray, but it belongs to the palette instead of sitting next to it. Painters call these chromatic grays and mix them from complements rather than from black and white.
This is the single cheapest upgrade to a UI that looks 'off'. Build your neutral ramp in OKLCH or HSL, give every step the same hue angle as your primary, and set chroma to something tiny (roughly 0.005 to 0.02 in OKLCH, or 5 to 12 percent saturation in HSL). Warm tints (yellow, orange, red hues) feel like paper, wood, and editorial print. Cool tints (blue, cyan) feel like glass, software, and clinical precision. Stripe, Linear, and Apple all ship tinted neutrals, not #808080.
Gotcha: mixing tint directions inside one interface is where it falls apart. A warm beige card on a cool blue-gray background reads as a color bug, not a design choice. Pick one direction for the whole neutral ramp. Second trap: crank the chroma too far and it stops reading as neutral, so it starts competing with your accent color. If someone can name the hue, you went too far.
Ask AI for it
Rebuild the neutral palette as tinted neutrals instead of pure grays. Generate a 10-step ramp (50 to 900) in OKLCH where every step shares the same hue angle as the brand color and carries a very low chroma of 0.006 to 0.018, increasing slightly toward the darker steps. Keep the lightness steps perceptually even. Use these for all backgrounds, surfaces, borders, and body text. Never use #000000 or a pure channel-equal gray anywhere. Keep the tint direction consistent across the whole ramp, no warm and cool mixed.