Design Lab

This is a structured workflow for exploring UI designs through iteration. It walks you through a detailed interview (user personas, brand tone, constraints), detects your framework and styling setup automatically, then generates five distinct variations in a temporary preview environment. You review them, give feedback, and get an implementation plan for the winner. The interview is thorough, maybe more than you need for a quick button redesign, but if you're stuck between design directions or want to see real alternatives before committing, it forces you to think through the tradeoffs. Just remember it creates temporary files that get cleaned up when you're done, so don't navigate away mid-process.

skills.sh installs: 2.1K
GitHub stars: 784
last updated: Jul 14, 2026

View on GitHub

Install

$ npx -y skills add 0xdesign/design-plugin --skill design-lab --agent claude-code

Installs into .claude/skills of the current project.

Files

Design Lab Skill

This skill implements a complete design exploration workflow: interview, generate variations, collect feedback, refine, preview, and finalize.

CRITICAL: Cleanup Behavior

All temporary files MUST be deleted when the process ends, whether by:

User confirms final design → cleanup, then generate plan
User aborts/cancels → cleanup immediately, no plan generated

Never leave .claude-design/ or __design_lab routes behind. If the user says "cancel", "abort", "stop", or "nevermind" at any point, confirm and then delete all temporary artifacts.