Agent skill · jakubkrehel
variant
Builds multiple variants of a component you're working on and helps you iterate and pick one.
What it needs
About 4k tokens when loaded.
What this skill does
Variants This skill takes one described piece of UI and builds three versions that differ on purpose. They go behind a picker in the real page, so you can flip between them and choose. Every other skill here judges. This one produces candidates and hands the decision back. Reviewing existing UI is interface-review and better-interface, and it does not pick the winner. Different answers, not different tints Three variants that differ in accent color teach nothing. You flip between them, see no real choice and the run is wasted. So each variant is a different answer to the same brief, on an axis this collection owns: Axis Owner What varies --- --- --- Structure better-layout Grouping, order, column count, what collapses Density better-layout Spacing scale, hit areas, how much fits Emphasis better-colors Where filled color goes, what recedes Type better-typography Scale steps, weight contrast, measure Voice better-writing Labels, tone, how much copy Pick one primary axis and give each variant a different position on it. Secondary choices follow from it rather than varying on their own. A dense variant may need a smaller type step, and that is coherence, not a second axis. Varying every axis at once produces three unattributable results. You learn which you liked, not what made it work, so the next piece starts from nothing. The floor every variant clears A variant that wins on looks and fails an escalation trigger is not a candidate. It is a bug with a nice surface. Before a variant enters the picker it clears better-interface's escalation triggers. Every control has an accessible name, keyboard reaches everything a pointer does, focus is visible, nothing clips at 320px and no meaning rides on color alone. That floor is identical across variants. It is not an axis and never trades against one. Where a direction can only work by breaking it, say so and drop the direction. 1. Scope one piece One piece of UI per run. "The dashboard" is not a piece; the metric card is. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills jakubkrehel/variant