claude-design-system
Create and revise design systems in the Design System artifact format (project/design-system.json, tokens.json, a README brand book, component previews, fonts and asset groups) as local files, then open them in a local design-system page where the user can browse and edit tokens, type, components and assets. Use when the user asks for a design system or brand kit in this format, built from a code repository, a design tool or scratch, names claude-design-system or the Design System type, or wants to revise a folder that holds project/design-system.json. claude-slides and claude-design install these systems. Not for a free-form HTML style guide, UI kit or token page.
- License
- Mixed. The skill text, references and editors adapted from Anthropic's claude.ai Artifact types stay Anthropic's and are not MIT-licensed; the local tooling is MIT. Complete terms in NOTICE.md: https://github.com/JimLiu/baoyu-design/blob/main/NOTICE.md
Pinned to revision 8ec4b3d2c0d6, so it is the text this page describes rather than whatever the author pushed since.
Files
- skills/claude-design-system/SKILL.md
- skills/claude-design-system/artifact-type/demo.json
- skills/claude-design-system/artifact-type/reference/cover.md
- skills/claude-design-system/artifact-type/reference/craft.md
- skills/claude-design-system/artifact-type/reference/format.md
- skills/claude-design-system/artifact-type/reference/from-code.md
- skills/claude-design-system/artifact-type/reference/from-design-tool.md
- skills/claude-design-system/artifact-type/reference/sample-seazar-tokens.json
- skills/claude-design-system/scripts/artifact.mjs
- skills/claude-design-system/scripts/editor/artifact-type/run.html
- skills/claude-design-system/scripts/editor/artifact-type/vendor/react-dom.production.min.js
- skills/claude-design-system/scripts/editor/artifact-type/vendor/react.production.min.js
- skills/claude-design-system/scripts/editor/assets/anthropicons-fizzy-lake-BSKaZSiT.woff2
- skills/claude-design-system/scripts/editor/assets/index-CfRb9gGr.js
- skills/claude-design-system/scripts/editor/assets/index-CkwF-CXd.css
- skills/claude-design-system/scripts/editor/index.html
- skills/claude-design-system/scripts/editor/share-ui.js
- skills/claude-design-system/scripts/editor/third-party-licenses.txt
- skills/claude-design-system/scripts/server.mjs
Every link opens the file at its source, pinned to the revision this page describes.