🎨 Design

variant

Name: variant
Author: jakubkrehel

by jakubkrehel8 days ago4.8k

Answers "which of these?" rather than "is this right?". Builds several genuinely different versions of one piece of UI behind a picker in the real page, so you can flip between them and promote the one that wins.

Install

npx skills add https://github.com/jakubkrehel/skills --skill variant

Show step-by-step

1
Open your terminal
- Mac: Press ⌘ Space, type "Terminal", press Enter
- Windows: Press Win R, type "cmd", press Enter
2
Paste the command above and press Enter
Use the Copy command button, then paste in your terminal (Mac: ⌘V, Windows: Ctrl V).
3
Restart Claude Code
Close and reopen Claude Code, or start a new session, so it picks up the new skill.

Where it lives

~/.claude/skills/jakubkrehel--skills--skills--variant/
├── SKILL.md
└── ... (skill resource files)

View on GitHub

Comments

X@jakubkrehel

"I added 2 new skills to the collection. /break It renders a component you choose in every state and scenario on a temporary page and stress tests it. It’s a..."