figma-design-analyzer分析Figma设计文件，提取设计系统数据（颜色、字体、间距、组件），导出截图，并与实际实现进行比对验证。使用JavaScript/Node.js实现，当用户需要处理Figma设计文件、提取设计规范、导出设计资源或验证设计实现时使用此技能。
Install via ClawdBot CLI:
clawdbot install plume-lj/figma-design-analyzerGrade Fair — based on market validation, documentation quality, package completeness, maintenance status, and authenticity signals.
Sends data to undocumented external endpoint (potential exfiltration)
Webhook → https://www.figma.com/developers/webhooksPotentially destructive shell commands in tool definitions
exec(Calls external URL not in known-safe list
https://github.com/yourusername/agent-skills.gitUses known external API (expected, informational)
amazonaws.comGenerated Aug 11, 2026
帮助设计团队从Figma文件中提取颜色、字体、间距、组件等设计规范，生成标准化的设计系统文档，确保跨团队的一致性。适用于需要整理或更新设计系统的企业。
将实际CSS/代码与Figma设计进行自动比对，快速发现颜色、间距、字体等方面的偏差，提高开发还原度，减少人工审查时间。适用于前端开发团队。
批量导出设计节点（如图标、组件）为PNG/JPG，为开发人员提供现成的资源，加快开发流程。适用于需要大量设计资产的移动端或Web项目。
通过提取设计规范并生成报告，帮助设计评审会议客观评估设计质量，识别不符合规范的部分。适用于需要定期进行设计评审的团队。
同时分析多个Figma文件，提取并比较设计系统，确保多产品线视觉一致性，支持品牌统一。适用于大型企业或集团。
提供在线平台，用户订阅后可基于此技能自动分析Figma文件，生成设计系统报告。可按月/年收费，提供不同层级（如基础版、专业版）。
作为专业服务提供给企业，帮助其分析设计系统、优化设计流程，按项目或小时收费。
作为开源或商业开发工具插件，免费基础功能，高级功能（如批量导出、高级比对）付费解锁。
💬 Integration Tip
集成前确保FIGMA_ACCESS_TOKEN环境变量正确设置，并安装Node.js 20+。可将其整合到CI/CD流水线中，在每次设计变更后自动触发分析。
Scored Aug 11, 2026
AI Analysis
The skill's core functionality uses legitimate Figma APIs (amazonaws.com) consistent with its stated purpose, and the webhook reference appears to be part of normal Figma API usage. However, the presence of exec() and references to external git repositories introduces minor security considerations that warrant caution.
Audited Apr 17, 2026 · audit v1.0
Implements UI from design mockups (Figma, Sketch, or image) with pixel-accurate layout, responsive behavior, and design tokens. Use when 还原设计图, implementing...
Senior product designer methodology ensuring thorough user research, structured architecture, accessible color and typography systems, and pixel-perfect UI e...
Complete Motion.dev documentation - modern animation library for React, JavaScript, and Vue (formerly Framer Motion)
Translate Figma nodes into production-ready code with 1:1 visual fidelity using the Figma MCP workflow (design context, screenshots, assets, and project-conv...
Shared design system for yuanfang-skills. Provides token CSS variables, 12+ themes, and reusable layout-type HTML blocks. Used by yuanfang-html-image (and fu...
Use when building, reviewing, or improving frontend UI that needs product-specific design direction, design-system generation, Master/Page overrides, distinc...