33-Strategies

Web Design Best Practice — Design skill for Claude Code

Design community

Review UI code for Vercel Web Interface Guidelines compliance.

How to install Web Design Best Practice

Installs to ~/.claude/skills/33-strategies-33-strategies-claude-code-starter-kit-web-design-best-practice/SKILL.md

Terminal

mkdir -p ~/.claude/skills/33-strategies-33-strategies-claude-code-starter-kit-web-design-best-practice && curl -fsSL https://raw.githubusercontent.com/33-Strategies/33-strategies-claude-code-starter-kit/HEAD/.claude/skills/web-design-best-practice.md -o ~/.claude/skills/33-strategies-33-strategies-claude-code-starter-kit-web-design-best-practice/SKILL.md

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

What Web Design Best Practice does

description: Review UI code for Vercel Web Interface Guidelines compliance argument-hint:

Web Interface Guidelines

Review these files for compliance: $ARGUMENTS

Read files, check against rules below. Output concise but comprehensive—sacrifice grammar for brevity. High signal-to-noise.

Rules

Accessibility

Icon-only buttons need aria-label
Form controls need or aria-label
Interactive elements need keyboard handlers (onKeyDown/onKeyUp

Alternatives in Design

Brand Guidelines — Apply Anthropic's official brand colors and typography to artifacts 94.1k ★
Interface Design — Design engineering for Claude Code 4.3k ★
Design Review Workflow — by Patrick Ellis - A tailored workflow for enabling automated UI/UX design review, including specialized sub a 3.7k ★