Mobbin Claude Rodeo — AI skill for Claude Code

Mobbin Claude Rodeo 🤠🎯

**Reference guardrails for Claude — find a real UI on [Mobbin](https://mobbin.com), build it *exactly*, and never let the spec go stale.**

---

What This Does

Claude is great at *finding* strong UI references and bad at *honouring* them. Two failures recur:

1. Approximation. You find a sharp sidebar — "compact left rail, 220px, 5 items." Claude builds a Claude-flavoured impression of it instead: generic spacing, reordered items, an invented active-state, "helpful" icons. The reference is gone.
2. Stale specs. You capture it well, build it faithfully — then the IA changes. The code moves on, the spec doesn't, and now nobody can tell deliberate change from drift. Every future "does this match the design?" is unanswerable.

**This skill** turns a Mobbin reference into something *load-bearing*: extracted as exact values, built without drift, and kept honest as the product evolves.

---

How It Works

flowchart LR
    A["1 · SEARCH
mine Mobbin
by job + archetype"] --> B["2 · EXTRACT
screen → P## spec
of exact values"]
    B --> C["3 · BUILD
strict preservation
copy, don't improve"]
    C --> D["4 · AUDIT
code vs spec
drift list"]
    D -->|"drift → fix the code"| C
    D -->|"deliberate change → update the spec"| B

The loop is the point. A drift sends you back to the **code**; a deliberate product change sends you back to the **spec** — so the reference never silently rots.

Phase	What happens
1 · Search	MCP-first (mcp__mobbin__search_screens / search_flows), manual-screenshot fallback. Query the job + archetype, not the aesthetic. Stop at 2–3 convergent precedents.
2 · Extract	Turn the chosen screen into a numbered P## spec block of exact values (px, token, item order, presence). Write it into your DESIGN.md. Adjectives aren't extraction.
3 · Build	Copy spec values exactly. No "improvements". Build th