A light 404 page with a cracked retro monitor that prints a crash log, then leaves a working shell. Visitors can type help, ls, cd and home with history and tab completion, or use quick command buttons.
The page you asked for is not in our route table. The shell survived though: list the pages, or jump straight home.
Take me homeTip: click the screen and type. Tab completes, Up recalls.
npx shadcn@latest add https://hyperblur.dev/r/notfound-terminal-shell.jsonWorks in any React project set up with the shadcn CLI. The file lands in components/hyperblur/notfound-terminal-shell.tsx.
import { NotfoundTerminalShell } from "@/components/hyperblur/notfound-terminal-shell"
<NotfoundTerminalShell onNavigate={(href) => router.push(href)} />| Prop | Type | Default | Description |
|---|---|---|---|
| title | string | "This path crashed the terminal" | Main heading. |
| message | string | Paragraph under the heading. | |
| path | string | "/blog/2023/q3-roadmap" | Missing path printed in the crash log. |
| host | string | "northbeam" | Host name in the prompt. |
| routes | { name: string; href: string; description: string }[] | 5 routes | Pages listed by ls and reachable with cd. |
| homeHref | string | "/" | Target of home and the main button. |
| onNavigate | (href: string) => void | Called by cd, home and listed links. Without it the page navigates with location.assign. | |
| accent | string | "#ffb000" | Phosphor color of the screen. |
| className | string | "" | Extra classes for the section element. |
| style | CSSProperties | Inline styles merged after the accent variable. |