# Pixel Grid Reveal

> A website hero that is a wall of two-sided ceramic flip tiles. Each tile's glazed face is its patch of a picture fired in one glaze, so the wall reads as the picture in big pixels; its back carries the same patch printed at full resolution. When the pointer or a scripted hand rests, the tiles turn over as a ripple, opening a clean window onto the fine picture with a band of tiles caught mid-turn at its rim, and then they turn back one by one. Two pictures are drawn in code: an engraved coastal chart in printed tints, and a night river city in black glass and gold leaf. The headline sits on a glass pane in front of the wall, in the same light, casting its shadow on the tiles. It loops every 16 seconds.

- Output: Web, WebGL flip-tile wall hero · page + embed · 1080p loop
- Price: $4.99 one-time, or included in Pro
- Page: https://lookbk.dev/skills/pixel-grid-reveal-hero

## What you need

- Node.js 18 or newer. Nothing to install.
- Chrome, Chromium or Edge, for the checks and the recording (set `CHROME_PATH` if it isn't found).
- ffmpeg, for the video (or set `FFMPEG_PATH`).
- Internet access when the page is opened: three.js r180 and the fonts load from jsDelivr, pinned with integrity hashes.

## Install

```bash
curl -fsSL https://lookbk.dev/cli.js | node - add pixel-grid-reveal-hero
```

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/pixel-grid-reveal-hero` only, the one folder Claude Code reads.
- From your own terminal: `~/.agents/skills/pixel-grid-reveal-hero`, which Codex, Gemini CLI, Copilot CLI, Cursor and OpenCode read, and also `~/.claude/skills/pixel-grid-reveal-hero` 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

> Use the pixel-grid-reveal-hero skill to build a hero for our atlas: a wall of glazed flip tiles showing our coast in big pixels that turn over to reveal the engraved chart, our headline on glass in front, one call to action, and a 16-second 1080p loop.