# Figma Tokens

> Figma 设计稿解析、颜色/排版 Token 提取与高保真组件还原指南。

- Skill: `ftshare-lab/figma-tokens` (Agent Skill)
- Install (CLI): `npx skillmds@latest add ftshare-lab/figma-tokens`
- Raw SKILL.md: https://api.skillmd.com/api/skills/ftshare-lab/figma-tokens/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Design & Media
- Author: FTShare-Lab (https://skillmd.com/u/ftshare-lab)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/ftshare-lab/figma-tokens

---


# Figma 设计系统技能

本技能指导 AI 智能体通过 Figma MCP 接口解析设计稿。

## 适用场景
1. 给定 Figma File Key 或 Node ID，提取设计图层结构、AutoLayout 参数与排版样式。
2. 提取项目 Color Variables、Typography 与 Shadow 等设计系统 Token。
3. 将 Figma 组件精准还原为 Vue 3 / React + Tailwind CSS 代码。