Empty State vs. Skeleton
A skeleton means content is COMING — gray pulsing shapes hold the layout while real content lands. An empty state means there's NOTHING here, and says what to do about it: a line of guidance plus a call to action. Loading gets a skeleton; zero items gets an empty state.
How to tell them apart
- Pulsing gray placeholder shapes → skeleton.
- A friendly message and a "Create your first…" button → empty state.
- A skeleton that pulses forever over a truly empty list is the classic bug — it should resolve to an empty state.
The full entries — names, anatomy, paste-ready prompts
No projects yet
Empty Stateweb
<section>
Purposeful guidance shown when a view has no content yet
Skeleton
Spinner
Skeleton vs. Spinnerweb
aria-busy="true"
Two loading indicators for predictable layouts and indeterminate waits
Still a different pair on your mind? See every commonly confused pair