System Pages
Every sitemd site ships with styled error and status pages that match your theme across all three modes.
Included pages
Four system pages are generated alongside your regular content:
| Page | File | Purpose |
|---|---|---|
| 404 | pages/404.md |
Shown when a visitor hits a URL that doesn't exist |
| 500 | Auto-generated | Shown when the hosting platform returns a server error |
| Access Denied | pages/access-denied.md |
Shown when a visitor lacks permission to view a gated page |
| Maintenance | pages/maintenance.md |
A "coming soon" page, shipped as a draft |
The 404, access denied, and maintenance pages use the default layout — header, navigation, theme toggle, and footer are all present. They inherit your accent color, fonts, and mode palette automatically.
The 500 page is generated automatically during production builds. It uses your theme and brand but has a minimal layout (no header/footer navigation) since the site may be in a broken state. See Site Diagnostics for details on what it contains and how it helps debug deploy issues.
404 page
The 404 page gets special treatment in the build. Instead of outputting to site/404/index.html like a normal page, the engine writes it as site/404.html — a flat file at the site root. This is the standard location that all major hosts look for:
- Cloudflare Pages — serves
404.htmlautomatically - Netlify — serves
404.htmlautomatically - Vercel — serves
404.htmlautomatically - GitHub Pages — serves
404.htmlautomatically
No configuration needed. Deploy your site and the styled 404 just works.
The dev server also serves the styled 404. Visit any nonexistent path on localhost:4747 and you'll see it with the dev panel attached.
Access denied
The access denied page is used by the auth and gating system. When a visitor tries to reach a gated page without the right permissions, they're redirected to /access-denied.
The redirect target is configurable in settings/auth.md:
# settings/auth.md
accessDeniedPage: /access-denied
Change this to any slug if you want a custom access denied experience.
Maintenance mode
The maintenance page ships with draft: true in its frontmatter. It won't appear in production builds until you enable it.
To put your site in maintenance mode, edit pages/maintenance.md and remove the draft flag:
# pages/maintenance.md
draft: false
The page is then live at /maintenance. To direct all traffic there, configure a redirect rule in your hosting provider (Cloudflare, Netlify, or Vercel all support redirect rules).
Customizing
The 404, access denied, and maintenance pages are regular markdown files. Edit them like any other page — change the copy, add your brand voice, include images, or swap the buttons.
The 500 page is auto-generated and cannot be customized directly. It always reflects your current theme, brand name, and favicon.
The default design uses a centered layout with a large status code, a heading, and action buttons:
<div style="text-align:center;padding:80px 20px 120px;max-width:480px;margin:0 auto">
<p style="font-size:96px;font-weight:700;line-height:1;margin:0;color:var(--color-text-secondary)">404</p>
## Page not found
The page you're looking for doesn't exist or has been moved.
button: Go home: /
</div>
The var(--color-text-secondary) reference ensures the status code adapts to light, dark, and paper modes. Use any theme color token to style your system pages.
Search and SEO
System pages are excluded from search results and search engines by default:
search: exclude
seo.noIndex: true
The 404 page is also always included in builds regardless of the deployPages filter.
Related
- Site Diagnostics — The 500 error page, inline diagnostic overlay, and console logging
- Themes — The three modes that system pages inherit
- Colors — Color tokens available for customizing system pages
- User Auth & Gating — How access denied redirects work
- Deploy — Deploying to hosts that serve 404.html automatically
- Selective Deployment — The 404 page bypasses this filter