ridelink0

Website Contact Sheet — Design skill for Claude Code

Design community

Render real websites in a headless browser into screenshot contact sheets and measure their palette and typefaces - visual research on competitors, styles and design references.

How to install Website Contact Sheet

Installs to ~/.claude/skills/ridelink0-image-deep-research-website-contact-sheet/SKILL.md

Terminal

mkdir -p ~/.claude/skills/ridelink0-image-deep-research-website-contact-sheet && curl -fsSL https://raw.githubusercontent.com/ridelink0/image-deep-research/HEAD/commands/website-contact-sheet.md -o ~/.claude/skills/ridelink0-image-deep-research-website-contact-sheet/SKILL.md

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

What Website Contact Sheet does

description: "Render real websites in a headless browser into screenshot contact sheets and measure their palette and typefaces - visual research on competitors, styles and design references" argument-hint: "" disable-model-invocation: true

Render websites with the image-deep-research skill. Read `${CLAUDE_PLUGIN_ROOT}/skills/image-deep-research/SKILL.md` first and follow its loop and its report.

The sites are the text the user

Alternatives in Design

Grade — Generate a shareable HTML "Design Report Card" — letter grade, 8 dimensions, evidence (palette, type, rhythm) 3.6k ★
Website Builder Setup — Build professional animated websites with Claude Code — no coding needed 313 ★
Brand Kit — Generate a complete brand kit from a logo and 1-2 brand colors — full palette, type scale, icon style, compone 309 ★