# 404 Page Kit

> A not-found page people enjoy landing on, in your colours, fonts and words. Pick from five small scenes, each drawn in code on one canvas with no pictures: a satellite tumbling far from where it was expected while its signal breaks up, a page with 404 printed on it that folds itself into a paper plane and flies a loop away, a magnifier that follows the pointer over a city map with one tile missing, a vending machine that drops a 404 can into its tray, and the number blowing away into a sand dune and building itself back. Each scene gets its own headline and introduction, a visit gets one of them, and a button opens the next in an iris. Two layouts: a quiet split page with the copy beside the scene, or the scene full-bleed with the copy in a raised card. With it come a working search box, up to four links and the way home. Your agent writes one page.json; the build checks every length and writes one HTML file, and the check measures contrast against the real pixels behind the words at four widths.

- Output: Video, Branded 404 page · five animated scenes drawn in code, no images · search, links home and a 1080p video
- Price: $4.99 one-time, or included in Pro
- Page: https://lookbk.dev/skills/animated-404-kit

## What you need

- Node.js 18 or newer. Nothing to install.
- Chrome, Chromium or Edge for the check and the video (found automatically; set `CHROME_PATH` otherwise).
- ffmpeg, only for the video (`brew install ffmpeg`, `winget install ffmpeg`, `apt install ffmpeg`; or set `FFMPEG_PATH`).

## Install

```bash
curl -fsSL https://lookbk.dev/cli.js | node - add animated-404-kit
```

The first run prints a sign-in link; open it, approve, and run the command again. Pro skills install for accounts that bought them or have Pro.

Where it installs:

- Run by Claude Code: `~/.claude/skills/animated-404-kit` only, the one folder Claude Code reads.
- From your own terminal: `~/.agents/skills/animated-404-kit`, which Codex, Gemini CLI, Copilot CLI, Cursor and OpenCode read, and also `~/.claude/skills/animated-404-kit` when `~/.claude` exists.

Add `--claude` or `--shared` to write only one of those folders, or `--project` to install into the current folder instead. Start a new agent session afterwards so it picks up the skill.

Credits and licenses: NOTICE.md plus any LICENSE files inside the ZIP.

## Example request

> Make our 404 page with the 404 Page Kit: our colours and fonts, the map and satellite scenes, search going to /search, and links to docs, pricing and status.
