Use when designing or reviewing web UI, implementing forms/buttons/inputs, fixing visual hierarchy issues, creating color systems, building layouts, or when interface feels cluttered, hard to read, or users don't know what to click.
Install
npx skills add ratacat/claude-skills --skill web-interface-designnpx skills add ratacat/claude-skills --skill web-interface-design -a claude-code -gnpx skills add ratacat/claude-skills --skill web-interface-design -a codex -ggemini skills install https://github.com/ratacat/claude-skills.git --path skills/web-interface-designgh skill install ratacat/claude-skills web-interface-designgit clone --depth 1 https://github.com/ratacat/claude-skills /tmp/ratacat__claude-skills
mkdir -p ~/.claude/skills ~/.agents/skills
cp -R /tmp/ratacat__claude-skills/skills/web-interface-design ~/.claude/skills/web-interface-design # Claude Code
cp -R /tmp/ratacat__claude-skills/skills/web-interface-design ~/.agents/skills/web-interface-design # Codex, Cursor, Gemini CLI, Copilot, OpenCode