cdknorow

Dev Screenshot — Design skill for Claude Code

Design community

Dev Screenshot: Build, Reload, and Capture UI.

How to install Dev Screenshot

Installs to ~/.claude/commands/cdknorow-coral-dev-screenshot.md

Terminal

mkdir -p ~/.claude/commands && curl -fsSL https://raw.githubusercontent.com/cdknorow/coral/HEAD/.claude/commands/dev-screenshot.md -o ~/.claude/commands/cdknorow-coral-dev-screenshot.md

Restart Claude Code, or start a new session, for it to be picked up.

What Dev Screenshot does

Dev Screenshot: Build, Reload, and Capture UI

Use the dev screenshot script to iterate on UI changes. This builds the Go server with dev tags, starts it on an isolated port, opens the browser, and captures a screenshot for visual verification.

Steps

Run the dev screenshot script:

PATH="/usr/local/go/bin:$PATH" ./scripts/dev-screenshot.sh

Wait for the script to complete (builds, starts server on port 8450, opens browser, takes screenshot)
Read the screenshot to veri

Alternatives in Design

Website Builder Setup — Build professional animated websites with Claude Code — no coding needed 313 ★
Buildable Preview — Render the running prototype in a headless browser, screenshot it, and catch runtime/visual errors 53 ★
UI Wizard — Launch the Dev-Suite Configurator dashboard 29 ★