UI Craft

Ship designer-grade UI by default. A design engineering system for AI coding agents — install it as a skill or as the ui-craft CLI, and your agent starts designing like it has taste. Ask for a dashboard, get one you'd put in production. Not gradient cards and bounce animations.

Website: skills.smoothui.dev

Ask for a surface. Ship it.

/craft dashboard

Three questions (or none — the defaults are strong), a named composition, a production theme preset, and a build that must pass a 10-item acceptance bar before it reports done: "would a designer retouch this?" If a box fails, it isn't done.

For everything else — reviews, animations, forms, polish — the skill routes by intent: just describe what you're building.

New here? Run /start — it reads your project (framework, tokens, brief, existing UI) and tells you what ui-craft can do right now, then points you at the right next step.

What it does

UI Craft gives AI coding agents the design knowledge they're missing. Not templates. Not component libraries. Actual craft knowledge — opinionated rules about how interfaces should look, move, and feel — plus the tooling to verify the result. Stack-agnostic by design.

Every UI gets tested against a single question: "Would someone believe AI made this?" If yes, it starts over.

Three ways to use it

You don't have to learn any of it to benefit. It grows with you.

Start at Layer 1. Most people never leave it — that's the point. Layers 2 and 3 are there the day you want them.

What makes this different: the only AI design system that produces a scoreable, defensible critique — Nielsen's 10 usability heuristics × 6 classic design laws (Fitts, Hick, Doherty, Cleveland-McGill, Miller, Tesler) × 5 persona walkthroughs, with every finding tagged by business impact (blocks-conversion / adds-friction / reduces-trust / minor-polish). Paste the scorecard straight into any issue tracker.

Same prompt, different result

Without UI Craft	With UI Craft

More before/after comparisons on the landing page.

Install

CLI — recommended (cross-harness, installs the whole system)

A single static Go binary that detects your AI coding harness and wires skill+commands, MCP gates, review agents, and design-memory into its native config in one interactive pass. No Node required at install time.

macOS / Linux:

brew install --cask educlopez/tap/ui-craft

Windows (Scoop):

scoop bucket add educlopez https://github.com/educlopez/scoop-bucket
scoop install educlopez/ui-craft

Then run:

ui-craft install

ui-craft install detects Claude Code / Cursor / Codex / Gemini / OpenCode, walks you through à-la-carte component selection (interactive TUI or --yes for CI), and writes each chosen component into that harness's native config. All writes are idempotent, backed up before they happen, and rolled back automatically on any failure.

What rides which install?

Full reference docs: skills.smoothui.dev/docs.

Claude Code plugin — alternative (skill + commands + agents + MCP, no CLI needed)

One command installs the skill, all 22 slash commands, the 2 review agents, and the MCP quality-gate server — auto-wired, no .mcp.json editing:

/plugin marketplace add educlopez/ui-craft
/plugin install ui-craft

The plugin bundles a .mcp.json (npx -y ui-craft-mcp), so the deterministic gates register automatically on install — first launch fetches the package via npx. This uses Claude Code's own plugin system, so it's not affected by the global-path issue noted below.

Agent Skills — alternative (skill + commands, any harness)

npx skills add educlopez/ui-craft

Works with any agent that supports the Agent Skills spec. Each agent gets a pre-built mirror under a dedicated folder (.codex/, .cursor/, .gemini/, .opencode/, .agents/). The main ui-craft skill lands as a peer skill; each slash command is materialized as its own sub-skill in non-Claude harnesses (other agents trigger them by intent: "audit my UI", "polish this page").

[!note] Using npx skills add -g with Claude Code? The skills CLI installs global skills to ~/.agents/skills, but Claude Code reads ~/.claude/skills (vercel-labs/skills#693). If the skill isn't picked up, use the CLI or plugin install above, install per-project (drop -g), or symlink it: bash ln -s ~/.agents/skills/ui-craft ~/.claude/skills/ui-craft

Other ways

# Clone
git clone https://github.com/educlopez/ui-craft.git ~/.skills/ui-craft
# Git submodule
git submodule add https://github.com/educlopez/ui-craft.git .skills/ui-craft

CLI

The ui-craft binary is a single static Go binary (distributed via Homebrew and Scoop). It is the lifecycle and cross-harness wiring core for the system.

Run ui-craft with no arguments to open the interactive hub — a full-screen menu with an async update check that routes into install, upgrade, backups, and uninstall. Every subcommand below also works directly for scripting/CI.

Commands

Key flags for install

Scripting flags (global)

Safety

Every install snapshots existing configs to ~/.ui-craft/backups/ (tar.gz, SHA-256 deduped) before writing. Any mid-plan failure rolls back the whole plan. rollback [harness] restores from the latest snapshot at any time. State is persisted to ~/.ui-craft/state.json so update can replay your choices at the new version without re-prompting.

Discovery phase

Before building anything, the skill analyzes your project for existing design decisions — CSS variables, Tailwind config, font imports, component themes. If your project already has a design system, it respects it. If not, it asks 4 quick questions (style, accent color, font, optional animation stack) so it never defaults to generic blue/Inter.

Knobs

Three numeric knobs (1-10) that the skill asks about during Discovery. They change behavior, not just tone.

At MOTION_INTENSITY 8+ the skill loads references/stack.md only if the user opts into Motion / GSAP / Three.js during Discovery.

Style variants

Three opt-in sibling skills that pre-commit to a style and lock the knobs to matching values. Agents pick them when the user mentions a specific aesthetic or product reference.

Each variant defers to the main ui-craft skill for base rules and references — it only overrides knob defaults and adds style-specific guidance.

Style presets

For playful and brutalist aesthetics (Clay / Gumroad / Duolingo / Arc-playful, Nothing-phone / Swiss-print / brutalist), see examples/presets/playful.md and examples/presets/brutalist.md. The main ui-craft skill applies these preset knob values + style overrides on top of the base rules when the user asks for those aesthetics.

Slash commands

Twenty single-lens passes, plus /sddesign (the pipeline that chains them) and /start (the front door).

Front door:

Decision spine & finalize:

Review & ship:

Plan & transform: