Figma Design System Builder
warpdotdev/warp
Builds or updates a design system in Figma from a codebase in ordered phases: discovery, variables and tokens, components, theming and documentation, with checkpoints.
71 套品牌级设计系统知识库，覆盖 AI/LLM、开发工具、生产力、金融科技、电商、媒体、汽车等 8 大类别. An agent skill from ReJeCtAll/ExpertTeam-Codex.
Install Design Systems
$ npx skills add ReJeCtAll/ExpertTeam-Codex --skill design-systems -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install ReJeCtAll/ExpertTeam-Codex design-systems --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/ReJeCtAll/ExpertTeam-Codex.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.codex/skills/design-systems .claude/skills/design-systems && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "design-systems" agent skill from https://github.com/ReJeCtAll/ExpertTeam-Codex/tree/main/.codex/skills/design-systems into .claude/skills/design-systems/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design-systems", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/ReJeCtAll/ExpertTeam-Codex/tree/main/.codex/skills/design-systemsType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add ReJeCtAll/ExpertTeam-Codex --skill design-systems -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install ReJeCtAll/ExpertTeam-Codex design-systems --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/ReJeCtAll/ExpertTeam-Codex.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.codex/skills/design-systems .agents/skills/design-systems && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "design-systems" agent skill from https://github.com/ReJeCtAll/ExpertTeam-Codex/tree/main/.codex/skills/design-systems into .agents/skills/design-systems/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design-systems", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add ReJeCtAll/ExpertTeam-Codex --skill design-systems -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install ReJeCtAll/ExpertTeam-Codex design-systems --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/ReJeCtAll/ExpertTeam-Codex.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.codex/skills/design-systems .cursor/skills/design-systems && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "design-systems" agent skill from https://github.com/ReJeCtAll/ExpertTeam-Codex/tree/main/.codex/skills/design-systems into .cursor/skills/design-systems/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design-systems", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/ReJeCtAll/ExpertTeam-Codex.git --path .codex/skills/design-systems--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add ReJeCtAll/ExpertTeam-Codex --skill design-systems -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install ReJeCtAll/ExpertTeam-Codex design-systems --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/ReJeCtAll/ExpertTeam-Codex.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.codex/skills/design-systems .gemini/skills/design-systems && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "design-systems" agent skill from https://github.com/ReJeCtAll/ExpertTeam-Codex/tree/main/.codex/skills/design-systems into .gemini/skills/design-systems/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design-systems", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install ReJeCtAll/ExpertTeam-Codex design-systemsInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add ReJeCtAll/ExpertTeam-Codex --skill design-systems -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/ReJeCtAll/ExpertTeam-Codex.git skills-src && mkdir -p .github/skills && cp -r skills-src/.codex/skills/design-systems .github/skills/design-systems && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "design-systems" agent skill from https://github.com/ReJeCtAll/ExpertTeam-Codex/tree/main/.codex/skills/design-systems into .github/skills/design-systems/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design-systems", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add ReJeCtAll/ExpertTeam-Codex --skill design-systems -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install ReJeCtAll/ExpertTeam-Codex design-systems --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/ReJeCtAll/ExpertTeam-Codex.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.codex/skills/design-systems .opencode/skills/design-systems && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "design-systems" agent skill from https://github.com/ReJeCtAll/ExpertTeam-Codex/tree/main/.codex/skills/design-systems into .opencode/skills/design-systems/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "design-systems", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
design-systems- GitHub stars
- 113
- Used in
- 1 other repo
- Token cost
- ~265 tokens
- SKILL.md length
- 96 words
- Files
- 4 (incl. references)
- Skills in repo
- 12
- Repo updated
- First seen
- Licence
- MIT
At a glance
71 套品牌级设计系统知识库，覆盖 AI/LLM、开发工具、生产力、金融科技、电商、媒体、汽车等 8 大类别. An agent skill from ReJeCtAll/ExpertTeam-Codex.
- Works in 4 steps: 根据需求摘要中的场景、调性、受众信息筛选候选系统 → 参考对应设计系统的 DESIGN.md 获取完整规范 → 根据项目需要定制设计令牌 → …
- Tasks that involve Design systems
- SKILL.md covers 功能说明, 系统分类, 9 段结构规范 and 5 大视觉方向, plus 3 more sections
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
Design Systems is an agent skill from ReJeCtAll/ExpertTeam-Codex. 71 套品牌级设计系统知识库，覆盖 AI/LLM、开发工具、生产力、金融科技、电商、媒体、汽车等 8 大类别。 每套系统包含 9 段标准结构：视觉主题、色彩、排版、组件、布局、深度、注意事项、响应式、Agent 指南。 触发词：设计系统、选择风格、品牌风格、设计令牌、DESIGN.md、配色方案
Its SKILL.md is about 270 tokens, which your agent loads only when the skill is triggered. The skill folder holds 4 other files, including reference files (for example `references/brand-extraction-protocol.md`, `references/design-system-schema.md` and `references/visual-directions.md`).
It sits in Frontend & Design, covering Design systems and Design tokens. The repository describes itself as: 一套可直接安装到 ~/.codex 的专家配置，面向 Codex CLI / Codex App 桌面版的 Skill 调用方式 提供 3 个专家团、3 个单专家与 1 个总路由入口。 The licence is MIT.
When your agent uses it
- Tasks that involve Design systems
- Tasks that involve Design tokens
Example prompts
- “/design-systems”
Workflow steps
4 steps, taken from the first numbered list in SKILL.md.
- 根据需求摘要中的场景、调性、受众信息筛选候选系统
- 参考对应设计系统的 DESIGN.md 获取完整规范
- 根据项目需要定制设计令牌
- 如用户有品牌资产，执行品牌提取协议
What it can do on your machine
Read from SKILL.md and the folder at commit 59c573b. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
Design Systems loads about 265 tokens when it runs, and up to ~3.2k if it reads all its reference files. Until then it costs about 41 tokens; SKILL.md has 96 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from ReJeCtAll/ExpertTeam-Codex at commit 59c573b, republished under its MIT licence (© ReJeCtAll). 96 words, ~265 tokens.
Download SKILL.mdSave it as
.claude/skills/design-systems/SKILL.md (or your agent's skills folder). This skill also uses 3 other files; get the full folder from GitHub.- name
- design-systems
- description
- 71 套品牌级设计系统知识库，覆盖 AI/LLM、开发工具、生产力、金融科技、电商、媒体、汽车等 8 大类别。 每套系统包含 9 段标准结构：视觉主题、色彩、排版、组件、布局、深度、注意事项、响应式、Agent 指南。 触发词：设计系统、选择风格、品牌风格、设计令牌、DESIGN.md、配色方案
设计系统知识库
功能说明
提供 71 套经过验证的品牌级设计系统参考，帮助 AI 快速为项目选择合适的视觉方向并生成精确的设计令牌。
系统分类
| 类别 | 数量 | 代表品牌 |
|---|---|---|
| AI & LLM | 10 | Claude, Cohere, Mistral AI, X.AI |
| 开发工具 | 19 | Cursor, Vercel, Linear, Supabase |
| 生产力 | 10 | Notion, Figma, Miro, Raycast |
| 金融科技 | 7 | Stripe, Coinbase, Mastercard |
| 电商消费 | 6 | Shopify, Airbnb, Nike |
| 媒体 | 5 | Spotify, PlayStation, Meta |
| 汽车 | 6 | Tesla, BMW, Ferrari |
| 其他/通用 | 8 | Apple, SpaceX, Default, Warm Editorial |
9 段结构规范
参考 @references/design-system-schema.md 了解完整的 DESIGN.md 9 段结构规范。
5 大视觉方向
参考 @references/visual-directions.md 了解 5 种预设视觉学派的详细定义。
品牌提取协议
参考 @references/brand-extraction-protocol.md 了解从用户已有品牌资产中提取设计规范的 5 步法。
使用方式
- 根据需求摘要中的场景、调性、受众信息筛选候选系统
- 参考对应设计系统的 DESIGN.md 获取完整规范
- 根据项目需要定制设计令牌
- 如用户有品牌资产，执行品牌提取协议
输出格式
生成项目专属的 DESIGN.md 文件，遵循 9 段标准结构。
© ReJeCtAll, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
SKILL.md and 3 other files (references) in .codex/skills/design-systems of ReJeCtAll/ExpertTeam-Codex.
- SKILL.md
- references/brand-extraction-protocol.md
- references/design-system-schema.md
- references/visual-directions.md
Open the folder on GitHubat commit 59c573b
Used in 1 other repository
We found 1 copy of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in ReJeCtAll/ExpertTeam-Codex, which our catalogue first saw on October 7, 2026.
Compare with similar skills
Design Systems next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Design Systems this skillReJeCtAll/ExpertTeam-Codex | 113 | 1 repos | ~265 | Automated safety check: Pass | MIT | |
| Figma Design System Builderwarpdotdev/warp | 65k | 2 repos | ~4.4k | Automated safety check: Pass | AGPL-3.0 | |
| Figma use_figma Plugin API Ruleswarpdotdev/warp | 65k | 4 repos | ~4.4k | Automated safety check: Pass | AGPL-3.0 | |
| Design SystemOhh-889/skyroc | 795 | 11 repos | ~1.7k | Automated safety check: Pass | MIT | |
| Design Dnazanwei/design-dna | 1.9k | 1 repos | ~2.1k | Automated safety check: Pass | MIT | |
| Stitch Taste Design Systemgoogle-labs-code/stitch-skills | 8.4k | 15 repos | ~3.1k | Automated safety check: Pass | Apache-2.0 |
Similar skills
Figma use_figma Plugin API Rules
warpdotdev/warp
Required groundwork before any use_figma call: the rules and reference files for running JavaScript in a Figma file through the Plugin API without common failures.
Design System
Ohh-889/skyroc
Token architecture, component specifications, and slide generation.
Design Dna
zanwei/design-dna
Extract, define, and apply design DNA across three dimensions: design system (tokens), design style (qualitative feel), and visual effects (Canvas, WebGL, 3D, particles, shaders, scroll effects…
- Official
Stitch Taste Design System
google-labs-code/stitch-skills
Generates a DESIGN.md design-language file for Google Stitch that encodes color, typography, layout, component behavior and motion rules to avoid generic AI-looking UI.
Scalar Design System
scalar/scalar
Scalar's design system — design tokens, theming (@scalar/themes), CSS variables, and the @scalar/components library.
More from ReJeCtAll/ExpertTeam-Codex
All 12 skills in this repoProduct Playbook
ReJeCtAll/ExpertTeam-Codex
产品战略团队完整手册。覆盖需求文档撰写、路线图管理、竞品分析、用户研究综合、指标评审、Sprint规划、干系人沟通和产品头脑风暴全流程。当涉及任何产品管理相关的请求时自动触发。
Expert Database
ReJeCtAll/ExpertTeam-Codex
数据库优化专家入口。用于 Codex CLI 的 $expert-database 调用. An agent skill from ReJeCtAll/ExpertTeam-Codex.
Expert Design
ReJeCtAll/ExpertTeam-Codex
设计原型专家团入口。用于 Codex CLI 的 $expert-design 调用. An agent skill from ReJeCtAll/ExpertTeam-Codex.
Expert Ops
ReJeCtAll/ExpertTeam-Codex
基础设施运维专家入口。用于 Codex CLI 的 $expert-ops 调用. An agent skill from ReJeCtAll/ExpertTeam-Codex.
Expert Product
ReJeCtAll/ExpertTeam-Codex
产品战略团队专家团入口。用于 Codex CLI 的 $expert-product 调用. An agent skill from ReJeCtAll/ExpertTeam-Codex.
Expert Security
ReJeCtAll/ExpertTeam-Codex
安全专家入口。用于 Codex CLI 的 $expert-security 调用. An agent skill from ReJeCtAll/ExpertTeam-Codex.
Related
Categories
Questions about Design Systems
What does Design Systems do?
71 套品牌级设计系统知识库，覆盖 AI/LLM、开发工具、生产力、金融科技、电商、媒体、汽车等 8 大类别. An agent skill from ReJeCtAll/ExpertTeam-Codex. Design Systems is an agent skill from ReJeCtAll/ExpertTeam-Codex.
When should I use Design Systems?
Design Systems fits situations like: tasks that involve Design systems; tasks that involve Design tokens.
How do I install Design Systems in Claude Code?
Run `npx skills add ReJeCtAll/ExpertTeam-Codex --skill design-systems -a claude-code`. Or copy the skill folder (.codex/skills/design-systems in ReJeCtAll/ExpertTeam-Codex) into .claude/skills/design-systems in your project. Claude Code loads it when a task matches its description.
How do I install Design Systems in Codex?
Run `npx skills add ReJeCtAll/ExpertTeam-Codex --skill design-systems -a codex`. Or copy the skill folder (.codex/skills/design-systems in ReJeCtAll/ExpertTeam-Codex) into .agents/skills/design-systems in your project. Codex loads it when a task matches its description.
Can I use Design Systems in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add ReJeCtAll/ExpertTeam-Codex --skill design-systems -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/design-systems, .gemini/skills/design-systems, .github/skills/design-systems and .opencode/skills/design-systems in your project.
What does Design Systems need to run?
SKILL.md names no scripts, command-line tools or credentials: Design Systems is instructions for the agent only.
Does Design Systems access the network?
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Is Design Systems safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does Design Systems use?
Design Systems is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Design Systems use?
About 265 tokens (SKILL.md is roughly 1.1k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 2.9k tokens, read only when the agent opens those files.
What are the alternatives to Design Systems?
Skills that share tags, products or a category with Design Systems: Figma Design System Builder (warpdotdev/warp, 65k stars), Figma use_figma Plugin API Rules (warpdotdev/warp, 65k stars), Design System (Ohh-889/skyroc, 795 stars) and Design Dna (zanwei/design-dna, 1.9k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Design Systems?
ReJeCtAll (a GitHub user) maintains it in ReJeCtAll/ExpertTeam-Codex, which has 113 GitHub stars. The repository holds 12 skills in this directory. The repository was last updated on July 8, 2026.
Source: ReJeCtAll/ExpertTeam-Codex on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.