Empty State With Illustration
Two variants — nothing created yet, versus filters excluded everything — because offering "create your first" to a bad filter is the classic bug.
All blocksProduct
Empty & Error States
8 blocks in this category, each rendered live below. Open any of them for the full source and a copy button.
A block is one finished section of a page — a pricing table, a hero, a footer.
Error State With Retry
Failed-to-load panel with a visible retry, a copyable error reference and the stack tucked behind a disclosure.
404 With Search & Suggestions
A 404 that helps: a real GET search form that works without JavaScript, likely destinations, and home as the fallback rather than the headline.
Shimmer Skeleton List
Loading placeholders with varied row widths and a sweep that is motion-safe only, falling back to a flat tint under reduced motion.
Permission Denied (403)
The state where the page exists and the account is not on the list: names who can grant access, sends the request, and leaks nothing about what is inside.
Offline With Queued Changes
Leads with what still works — three edits saved on this device — instead of with the failure. The retry backoff counts down in the open, and the three things that genuinely cannot work offline are named rather than discovered.
Empty Because of Filters
The empty state for a list emptied by its own filters: every active filter shown as a removable chip ordered by how many results it would restore, with clear-all deliberately second.
Scheduled Maintenance Window
Planned downtime with a live countdown, an end time in the reader’s timezone, what still works — and a different sentence once the window overruns rather than a negative timer.