Definition

An Empty State is the visual state displayed when there is no content available to show, such as a new user dashboard with no data or a cleared shopping cart. Empty states should provide helpful guidance, such as instructions, examples, or actions to encourage users to add content or engage with the product further.

Why it matters

Empty states are the most underinvested screen in most SaaS products — yet they're the first thing every new user sees. A blank canvas with no guidance tells users 'you're on your own,' leading to abandonment. A well-designed empty state is a mini-onboarding moment: it explains the value, shows what filled looks like, and gives a clear starting action. Empty states are one of the highest-leverage places to improve activation rates.

Real-world example

Figma Community's 'Nothing published yet' state shows a simple document icon with an encouraging message and an 'Explore' CTA — communicating what the space is for and giving users a clear next action before they've added anything.

Figma Community empty state nothing published yet
Confused about
Empty State
?
Design is fun, but it's not easy.
Get help from a senior designer.
Start your project with us!
Start a project