Not Found & Empty States

Styled 404/500, loading skeletons, and empty states matched to the app's design.

npx skills add drmrduck/skills@notfound
View SKILL.md on GitHub ↗drmrduck/skills@notfound

404 & Empty States

Make the neglected states look finished, matched to the existing design.

Steps

  1. Infer the design system — read the app`s components, spacing, colors and typography so the new pages do not look bolted on.
  2. Generate the set: not-found (404), an error boundary (500), loading skeletons for the main routes, and reusable empty-state components (no data, no results, first-run).
  3. Each gives the user a way forward (link home, retry, primary action).
  4. Land them as real routes/components in the project.

Verify

Related skills