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 ★
Scroll Craft — Claude Code skill for premium scroll-driven websites 1k ★
Maestro Impeccable — Use when designing, auditing, polishing, improving, or codifying frontend UI — websites, dashboards, landing p 530 ★