Loading repository data…
Loading repository data…
kwakseongjae / repository
Give your AI coding agent a design system. One command installs 400+ quality-graded company DESIGN.md references + skills into Claude Code, Codex, Cursor, and OpenCode. Free, MIT, zero AI calls.
oh-my-design (OmD) is a design system for AI coding agents. It turns Claude Code / Codex / OpenCode / Cursor into a senior product designer with a working memory of your brand. You install once. After that, you just describe what you want — components, screens, copy, assets, charts — and the agent applies your project's design system and ships. DESIGN.md is the brand spec (Google Stitch tokens + a brand-philosophy layer: Voice / Narrative / Principles / Personas / States / Motion), and 400+ real-company DESIGN.md files ship in this package. No API keys. No external infra. Everything runs inside your existing CLI session.
npx oh-my-design-cli install-skills
Then restart your agent (Cmd+Q in Claude Code, then relaunch) so the new skills + agents are loaded.
That is the only CLI command you will run. Everything else is natural language to your agent.
The installer asks where to install: Project (./.claude/skills — this project only, the default) or Global (~/.claude/skills — every project; skills + sub-agents, leaves your global hooks/settings untouched). Skip the prompt with --global for the user-level install.
This is the whole point: one prompt turns into a DESIGN.md your agent remembers across every future session.
Install (above), then restart your agent (Cmd+Q, relaunch) so it loads the new skills.
In your project, type your first prompt — copy this exactly:
Set up our design system — Toss-style, for a family meal-tracking app.
Your agent runs omd:init: it recommends a reference from the 400 real-company catalog, asks you to confirm, and writes DESIGN.md to your project root. (omd:sync then wires up the CLAUDE.md / AGENTS.md / Cursor shims so every agent reads it automatically.)
That DESIGN.md is your activation — your agent now remembers your brand.
Now build against it:
Design the home screen.
The agent reads DESIGN.md and ships brand-correct UI. No re-explaining your design system, ever again.
Don't want Toss? Any brand works — Stripe-style, Linear-clone B2B SaaS, Karrot-style marketplace. Browse the full catalog at oh-my-design.kr/design-systems.
| Agent | Channel | What gets installed |
|---|---|---|
| Claude Code | --agent claude-code (default) | Full bundle — skills, 16 sub-agents, hooks, data under .claude/ |
| Codex | --agent codex | Skill bundle at .agents/skills/ (official discovery path) |
| OpenCode | --agent opencode | Skill bundle at .opencode/skills/ |
| Cursor | --agent cursor | First-class rules channel — .cursor/rules/omd-design.mdc shim + the shared .claude/data catalog (no skills/hooks) |
The default install targets every detected agent; pass --agent <name> to install a single channel.
18 skills · 16 sub-agents · 400 quality-graded references · activation hooks — installed by the one command above.
omd:init / omd:apply / omd:harness / omd:sync / omd:remember / omd:learn / omd:taste — say "what are my preferences" to see everything the loop has learned, pending, or snoozed), live capture + assets (omd:reference-capture / omd:asset-fetch / omd:experiment-gallery), the v0.2 agent layer (omd:orchestrator / omd:kr-writer / omd:locale-adapter / omd:designer-review / omd:final-qa / omd:codex-image), the omd:feel interface-quality skill (113 provenance-graded HIG / Material / WCAG rules that apply + audit motion, spacing, type, and a11y), plus the standalone claude-design skill that drives claude.ai/design from your terminal.omd-master + 15 specialists (UX research, UI generation, asset curation, microcopy, a11y audit, persona testing, critique, …).DESIGN.md files with explicit evidence/quality status. Every reference is also served as raw markdown at oh-my-design.kr/<id>/design.md, so agents can fetch it directly.Full skill-by-skill and agent-by-agent reference: oh-my-design.kr/docs.
The old catalog MCP transport is retired. Skills and agents consume the local catalog or the raw /<id>/design.md route directly; the historical implementation remains under packages/mcp/ as an archive.
npx oh-my-design-cli@latest install-skills
Idempotent. Managed files (those carrying the <!-- omd:installed-skill --> marker) are refreshed in place; files you edited are left untouched (skipped-drift) unless you pass --force. Restart your agent after re-running.
npx oh-my-design-cli --version # what your project currently uses
npm view oh-my-design-cli version # latest on the registry
What changed each release — including anything that needs more than a re-install — is in CHANGELOG.md.
.md twins for agents)MIT — see LICENSE. References belong to their respective companies; reproduced for educational reference.