Klarhimmel UI

Error prompt

Not found, server error and maintenance pages that do not strand people.

Prompt

Prompt

Use the klarhimmel-design skill. Build the {kind} page for {site}. Install: npx shadcn add @klarhimmel/error-links @klarhimmel/error-page @klarhimmel/error-status @klarhimmel/error-maintenance (remove what you do not use) Pick: - error-links: 404 with described places to go next; the default - error-page: a code, a headline and two ways out - error-status: our fault: retry, status, a reference id - error-maintenance: planned downtime with timed updates Props: code as text ("404"), title, description, primary { label, href }; error-status adds a reference id; maintenance adds back (text) and updates. Copy: Say what happened in plain words, whose fault it is if it is ours, and what to do next. No jokes about their problem. Accessibility: These blocks carry the page's h1. Return the matching HTTP status from the server. Make the primary link the obvious way back. Never: viewport variants (md:, lg:), style=, text or images outside Text and Media, fields the schema lacks. Shorten copy to fit the limits. Done when: one h1; a way out within one click; status code returned by the server.

Variables

VariableWhat to fill inExample
{kind}404, 500 or maintenance404
{site}The siteExempelhotellet

A good result

One h1. A way out within one click. Status code returned by the server.

checklist.md
- [ ] one h1
- [ ] a way out within one click
- [ ] status code returned by the server