Hierarchy

A visual design principle that orders elements on a page and classifies them by their level of importance

Why it matters

Each size and weight is a claim about importance. Past four or five levels the claims stop being distinguishable, and the reader has to work out the ranking themselves — the job the screen was supposed to do for them.

See it

Four sizes, four jobs — title, section, body, caption. The ranking reads before the words do.

The numbers

  • 4 — text sizes per screen is a good ceiling
  • Title, section, body, caption — the four roles that cover most screens

Measured by the Figma plugin

Screens carrying more than four distinct text sizes are flagged — counted per screen, not per page.

Put the coach in your canvas

Related terms

Go deeper in Learn UX

On the checklists

Ask your assistant

Define "Hierarchy" using uxspot.

Works in Claude, Cursor or any MCP client — connect the uxspot MCP.

Think it stuck? A 20-second round of Spot Check will tell you.