Skip to main content

Search rules

Search all UI Guides rules by name, category, or source

design@Ibelick

Avoid Gradients Unless Requested

NEVER

NEVER: Use gradients unless explicitly requested. Solid colors are easier to maintain, more accessible, and don't clash with content.

Solid colors are cleaner and more maintainable - only use gradients when explicitly asked

Bad

Good

Why it matters

That is the rule verbatim from the baseline-ui skill — one RFC-2119 line under "Design". Our reasoning: a gradient is a decision nobody asked for that then has to be maintained in every theme, and it quietly breaks the things around it. Text on a gradient has no single contrast ratio, so it passes at one end and fails at the other; a gradient surface has no single token, so dark mode has to re-author it rather than re-map it.

Solid colours are cheaper, testable, and themable. If the brand genuinely calls for a gradient, that is an explicit request — build it once, as a token, and keep text off it.

Built by Gleb Stroganov, design engineer at Evil Martians.

The rules come from other people's skills and guidelines — Vercel, Rauno Freiberg, @Ibelick, impeccable, Emil Kowalski, Tailwind, RAMS — each one credited on the Sources page. The work here is extraction and wiring: every rule is pulled into one corpus, given a good and a bad example you can operate, a MUST/SHOULD/NEVER rule an agent can paste, and a link back to where it came from.