better-design 0.20.0 → 0.21.0
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.
- package/README.md +6 -1
- package/dist/index.js +1086 -661
- package/dist/index.js.map +1 -1
- package/package.json +7 -3
package/README.md
CHANGED
|
@@ -6,11 +6,14 @@ Better Design connects your coding agent to design systems, UI and UX guidance,
|
|
|
6
6
|
|
|
7
7
|
Use it to design and build for web, mobile, Shopify, 3D, and product video.
|
|
8
8
|
|
|
9
|
+
Install the agent skill, then connect its MCP tools:
|
|
10
|
+
|
|
9
11
|
```bash
|
|
12
|
+
npx skills add marvkr/better-design --skill better-design
|
|
10
13
|
npx better-design
|
|
11
14
|
```
|
|
12
15
|
|
|
13
|
-
Run
|
|
16
|
+
Run each command once, then restart your coding agent. The first command teaches supported agents when to use Better Design. The second detects your coding tools and connects the MCP without overwriting their existing configuration.
|
|
14
17
|
|
|
15
18
|
Free. No account required.
|
|
16
19
|
|
|
@@ -21,6 +24,7 @@ Works with Codex, Claude Code, Cursor, VS Code, Windsurf, and other MCP clients.
|
|
|
21
24
|
- Find, generate, or extract a design system.
|
|
22
25
|
- Build with consistent, editable components and styles.
|
|
23
26
|
- Apply guidance for interfaces, interactions, motion, mobile, Shopify, and 3D.
|
|
27
|
+
- Build Shopify themes from ready-to-write files and MCP-served Liquid guidance, with no separate agent skill installation (private preview).
|
|
24
28
|
- Find and install a matching icon library.
|
|
25
29
|
- Review accessibility, usability, content, and visual quality, against the guidance the session already loaded.
|
|
26
30
|
|
|
@@ -32,6 +36,7 @@ Your code stays in your repo and remains yours to change.
|
|
|
32
36
|
| --- | --- |
|
|
33
37
|
| `find-design-system` | Find a catalog system for a requested interface. |
|
|
34
38
|
| `get-design-system-kit` | Retrieve installable React, HTML, Shopify, or DTCG design-token output. |
|
|
39
|
+
| `get-shopify-guide` | Load Shopify Liquid and theme-development guidance directly from Better Design (private preview). |
|
|
35
40
|
| `get-design-system-status` | Check a generated system's progress and result. |
|
|
36
41
|
| `create-design-system` | Generate a custom design system for a product. Pass an extracted token sheet as `brandCss` to build from the user's own brand instead of a catalog look-alike. |
|
|
37
42
|
| `preview-design-system` | Show a token-true preview for a system. |
|