@feimacode/open-design-agent-kit-mcp 0.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +116 -0
  2. package/out/index.js +5089 -0
  3. package/package.json +51 -0
package/README.md ADDED
@@ -0,0 +1,116 @@
1
+ # @feimacode/open-design-agent-kit-mcp
2
+
3
+ The [OpenDesign](https://github.com/nexu-io/open-design) skill/design-system/artifact workflow as a standalone MCP server — for Claude Code, Codex, Cursor, or any other MCP-capable coding agent. Same nine tools and the same content library (163 skills, 114 design templates, 152 brand design systems, 167 remixable examples) as the [VS Code extension](https://marketplace.visualstudio.com/items?itemName=feima.open-design-agent-kit), over stdio instead of native `languageModelTools`.
4
+
5
+ No daemon, no account, no editor required. Your agent's own selected model does the actual generation with its normal file-editing tools; this server only composes instructions and does the bookkeeping (manifests, active design system) around them.
6
+
7
+ ## What you get
8
+
9
+ Four of the ~280 vendored skills and templates, rendered exactly as-is:
10
+
11
+ <table>
12
+ <tr>
13
+ <td width="50%" valign="top">
14
+ <img src="../../docs/screenshots/examples/dating-web.png" alt="Consumer dating-app dashboard, editorial typography" width="100%"/><br/>
15
+ <sub><b>"Design a dating-site dashboard — mutuals, match rate, a 30-day trend."</b></sub>
16
+ </td>
17
+ <td width="50%" valign="top">
18
+ <img src="../../docs/screenshots/examples/gamified-app.png" alt="Gamified habit-tracking mobile app, three phone frames" width="100%"/><br/>
19
+ <sub><b>"A habit-tracking app with daily quests and XP."</b></sub>
20
+ </td>
21
+ </tr>
22
+ <tr>
23
+ <td width="50%" valign="top">
24
+ <img src="../../docs/screenshots/examples/deck-swiss-international.png" alt="Board strategy deck, Swiss International style" width="100%"/><br/>
25
+ <sub><b>"A board-ready strategy deck, Swiss International style."</b></sub>
26
+ </td>
27
+ <td width="50%" valign="top">
28
+ <img src="../../docs/screenshots/examples/card-xiaohongshu.png" alt="Xiaohongshu-style swipeable knowledge card" width="100%"/><br/>
29
+ <sub><b>"5 tips, as a Xiaohongshu-style swipeable card carousel."</b></sub>
30
+ </td>
31
+ </tr>
32
+ </table>
33
+
34
+ Each one started from `remix_open_design_example` (copy a real example, then modify it) or `prepare_open_design_brief` (compose instructions and generate from scratch) — call `list_open_design_skills` to browse the other ~276.
35
+
36
+ ## Quick start
37
+
38
+ ```bash
39
+ npx -y @feimacode/open-design-agent-kit-mcp
40
+ ```
41
+
42
+ That's a plain stdio MCP server. Register it with your agent:
43
+
44
+ **Claude Code**
45
+
46
+ ```bash
47
+ claude mcp add open-design -- npx -y @feimacode/open-design-agent-kit-mcp
48
+ ```
49
+
50
+ Or install the [Claude Code plugin](https://github.com/feimacode/open-design-agent-kit#ways-to-use-it) instead — it registers this server automatically and adds 23 curated `/open-design:*` skills on top.
51
+
52
+ **Codex CLI**
53
+
54
+ ```bash
55
+ codex mcp add open-design -- npx -y @feimacode/open-design-agent-kit-mcp
56
+ ```
57
+
58
+ or by hand in `~/.codex/config.toml`:
59
+
60
+ ```toml
61
+ [mcp_servers.open-design]
62
+ command = "npx"
63
+ args = ["-y", "@feimacode/open-design-agent-kit-mcp"]
64
+ ```
65
+
66
+ See [docs/codex.md](https://github.com/feimacode/open-design-agent-kit/blob/main/docs/codex.md) for the matching `SKILL.md` you can copy into `.agents/skills/open-design/`.
67
+
68
+ **Any other MCP host** — the generic config shape:
69
+
70
+ ```json
71
+ {
72
+ "mcpServers": {
73
+ "open-design": {
74
+ "command": "npx",
75
+ "args": ["-y", "@feimacode/open-design-agent-kit-mcp"]
76
+ }
77
+ }
78
+ }
79
+ ```
80
+
81
+ ## Tools
82
+
83
+ | Tool | Does |
84
+ |---|---|
85
+ | `list_open_design_skills` | Browse skills, design templates, and remixable examples — filter by free-text query or an exact mode (`prototype`, `deck`, `design-system`, `image`, `video`, `template`, `utility`, `audio`). |
86
+ | `list_open_design_design_systems` | Browse the ~152 brand design systems — filter by query or category. |
87
+ | `prepare_open_design_brief` | Compose generation instructions from a skill, an optional design system, and your brief. Writes nothing — you author the file(s) yourself, then register them. |
88
+ | `register_open_design_artifact` | Validate an artifact you've written and record its manifest sidecar (`<entry>.artifact.json`). |
89
+ | `get_open_design_artifact` | Read back a registered artifact's manifest, entry content, and any open comments. |
90
+ | `set_active_design_system` | Set (or clear) the workspace's active design system, used automatically by `prepare_open_design_brief`. |
91
+ | `create_open_design_design_system` | Compose instructions to author a new `DESIGN.md`, optionally seeded from a reference URL's colors/fonts. |
92
+ | `port_open_design_artifact_to_app` | Compose instructions to port a finished artifact into your real app as idiomatic production code. |
93
+ | `remix_open_design_example` | Copy a curated example artifact into the workspace as a starting point, and get instructions to modify — not regenerate — it. |
94
+
95
+ JSON Schemas mirror the VS Code extension's `languageModelTools` 1:1 — see [`src/index.ts`](https://github.com/feimacode/open-design-agent-kit/blob/main/packages/mcp-server/src/index.ts) for the exact shapes.
96
+
97
+ ## Configuration
98
+
99
+ | Environment variable | Default | |
100
+ |---|---|---|
101
+ | `OPEN_DESIGN_WORKSPACE_ROOT` | the launching process's `cwd` | Where artifacts get written and `.open-design/config.json` (active design system) is read/written. |
102
+ | `OPEN_DESIGN_OUTPUT_DIR` | `.open-design` | Workspace-relative directory new artifacts are suggested under. |
103
+
104
+ Both Claude Code and Codex already launch a local stdio MCP server with `cwd` set to the active project, so the default is usually right — the override exists for testing or an unusual host.
105
+
106
+ ## What's not here
107
+
108
+ Live preview, inline comments, and WYSIWYG editing are webview-based and stay VS-Code-only — see the [VS Code extension](https://marketplace.visualstudio.com/items?itemName=feima.open-design-agent-kit) for those. This package is the headless skill/design-system/artifact workflow only.
109
+
110
+ ## More
111
+
112
+ Full project layout, how content is vendored/synced, and development instructions live in the [main repo](https://github.com/feimacode/open-design-agent-kit).
113
+
114
+ ## License
115
+
116
+ MIT — see [LICENSE](https://github.com/feimacode/open-design-agent-kit/blob/main/LICENSE). Skill/design-system/example content is vendored from [open-design](https://github.com/nexu-io/open-design), licensed Apache-2.0.