Skip to content

Work / Scrvio / Wiki / Surfaces

not-found

Surfacecanonicalverified 2026-10-04

SURFACE.WEB.NOT-FOUND

Summary

The 404 page Next.js renders for any route that does not exist.

Raw wireframe

  • .context/designs/web/states/404.html

Why it is drawn this way

The 404 is text, not an icon. not-found.tsx puts the string 404 in a red tile. The text has no colour class, so it stays ink on red.

My Library is offered to everyone. The second button links to /library. That page is behind RequireAuth, so a signed-out visitor is sent on to /auth/login?redirect=/library. The drawing links straight to the library.

"Contact support" is not a link. The last line is plain text. The page never links to /contact-us.

The header is the signed-out one. The header follows auth state. The drawing shows the signed-out face because that is who lands here most.

Related

Sources

  • apps/website/src/app/not-found.tsx
  • packages/ui/src/components/ui/page-header.tsx