Skip to main content

Search rules

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

design@Ibelick

Empty States Need Clear Actions

MUST

MUST: Give empty states one clear next action. "No results" with a button to adjust filters. "No items" with a button to create first item. Never leave users stuck.

Every empty state should have one clear action to guide users forward

Bad

Good

Why it matters

Verbatim from the baseline-ui skill — one line under "Design". Our reasoning: an empty state is the first screen a new user sees, and "No items" is a dead end dressed up as information. It reports a fact the user can already see and withholds the only thing they need, which is what to do about it. Give it three parts — what this space is for, why it is empty right now, and one primary action that fills it — and note the word "one": two competing buttons hand the decision straight back.

Distinguish the empty cases, too, because they need different actions: nothing created yet is an invitation, no search results is a prompt to widen the filter, and a load failure is a retry.

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.