跳转到主要内容
此内容尚未提供您的语言版本,正在以英文显示。

Figma Generate Library

技能 活跃

Build or update a professional-grade design system in Figma from a codebase. Use when the user wants to create variables/tokens, build component libraries, set up theming (light/dark modes), document foundations, or reconcile gaps between code and Figma. This skill teaches WHAT to build and in WHAT ORDER — it complements the `figma-use` skill which teaches HOW to call the Plugin API. Both skills should be loaded together.

目的

To automate the creation of professional-grade Figma design systems that accurately reflect a codebase, ensuring consistency and efficiency in design-to-development workflows.

功能

  • Builds Figma design systems from codebase tokens and components
  • Automates variable collection, token creation, and style definition
  • Manages component variants, properties, and layout via Figma API
  • Ensures idempotency and state persistence for long workflows
  • Provides detailed documentation and error recovery protocols

使用场景

  • When a user wants to create Figma variables/tokens from code.
  • When a user wants to build component libraries in Figma that match their codebase.
  • When a user needs to set up theming (light/dark modes) for a Figma design system.
  • When a user wants to document design foundations and reconcile gaps between code and Figma.

非目标

  • Directly calling the Figma Plugin API without workflow orchestration
  • Building components without prior discovery and user approval
  • Creating design tokens without mapping them to code syntax
  • Overwriting user-created nodes without explicit intent or cleanup protocols

Trust

  • warning:Issues AttentionThere are 30 open issues and 6 closed issues in the last 90 days, indicating a slow closure rate and potentially slow maintainer response.

安装

npx skills add openai/skills

通过 npx 运行 Vercel skills CLI(skills.sh)— 需要本地安装 Node.js,以及至少一个兼容 skills 的智能体(Claude Code、Cursor、Codex 等)。前提是仓库遵循 agentskills.io 格式。

质量评分

95 /100
1 day ago 分析

信任信号

最近提交1 day ago
星标19k
状态
查看源代码

类似扩展

Figma Generate Library

100

从代码库在 Figma 中构建或更新专业级设计系统。当用户想要创建变量/令牌、构建组件库、设置主题(浅色/深色模式)、记录基础或协调代码和 Figma 之间的差距时使用。此技能教授要构建什么以及按什么顺序 — 它补充了教授如何调用插件 API 的 `figma-use` 技能。两个技能应一起加载。

技能
figma

Design System

98

Build or audit a design system including component library, design tokens, naming conventions, contribution model, and documentation. Use this skill whenever the user wants to build a design system, audit an existing system, define design tokens at the system level, structure a component library, or set up design system governance. Triggers on design system, component library, design tokens, atomic design, atoms, molecules, organisms, design system documentation, Storybook, Figma library, system governance, design contribution model. Also triggers when teams are inconsistent across products and a system is the answer.

技能
rampstackco

Figma Create Design System Rules

95

Generates custom design system rules for the user's codebase. Use when user says "create design system rules", "generate rules for my project", "set up design rules", "customize design system guidelines", or wants to establish project-specific conventions for Figma-to-code workflows. Requires Figma MCP server connection.

技能
openai

Project Session Manager

100

Worktree-first dev environment manager for issues, PRs, and features with optional tmux sessions

技能
Yeachan-Heo

Public Google Drive

100

无需 OAuth 即可创建公开的 Google Docs 或 Google Sheet 文件。使用此技能创建和编辑 Google Docs 和 Sheets,无需登录 Google。文档可通过共享链接查看。首次使用时自动注册。

技能
zagmoai

Oh My Claudecode

100

Process-first advisor routing for Claude, Codex, or Gemini via `omc ask`, with artifact capture and no raw CLI assembly

技能
Yeachan-Heo