yyl-test-skill — Figma设计分析与导出

Name: yyl-test-skill — Figma设计分析与导出
Rating: 1 (1 reviews)
Author: yylgit

yylgit

yyl-test-skill — Figma设计分析与导出

v1.0.0

专业级Figma设计分析与资源导出工具。用于提取设计数据、多格式导出资源、审计无障碍合规性、分析设计系统、生成全面的设计文档。只读分析Figma文件，具备强大的导出和报告功能。

1· 86·0 当前·0 累计·💬 1

by @yylgit·MIT-0

设计工具文件处理开发工具 API工具

下载技能包

License

MIT-0

最后更新

2026/3/21

安全扫描

VirusTotal

无害

查看报告

OpenClaw

可疑

medium confidence

该技能似乎实现了合法的Figma只读分析和导出功能，但在安装或使用真实凭证运行之前存在不一致之处（未声明的必需令牌、元数据不匹配），需要谨慎对待。

评估建议

在安装或运行此技能之前： - 预期需要提供Figma访问令牌（FIGMA_ACCESS_TOKEN）。注册表元数据错误地列出了无必需的env变量——请向作者确认令牌要求。 - 使用最小权限令牌：创建仅具有读取/导出所需范围的Figma令牌，尽量避免使用广泛的团队级凭证。如果是临时令牌，使用后请撤销。 - 不要在共享的.env文件或源代码控制中存储长期令牌。如必须，保留文件版本控制并限制文件系统访问。 - 本地查看包含的脚本（它们存在且可读）。它们仅调用api.figma.com和Figma CDN（符合预期）。运行前搜索任何硬编码或意外的网络端点。 - 首先在隔离环境（临时VM或容器）中运行，以便导出的文件被隔离，任何意外行为都受到限制。 - 注意包元数据的不一致性（缺少声明的env变量，_meta.json中的ownerId与注册表所有者不同）——如果您需要更高的保证，请向发布者询问源代码仓库/主页并解释元数据不匹配的原因。如需要，我可以提取代码中读取FIGMA_ACCESS_TOKEN的确切位置并列出脚本调用的所有HTTP端点。...

详细分析 ▾

⚠ 用途与能力

Name/description (Figma analysis & export) match the code: the scripts call the Figma REST API, export images, run audits, and write local deliverables. However, the registry metadata declares no required environment variables or primary credential while both SKILL.md and scripts require a FIGMA_ACCESS_TOKEN—this omission is an incoherence that should have been declared by the skill.

ℹ 指令范围

SKILL.md instructions are generally scoped to Figma operations (get-file, export, audit). They explicitly instruct setting FIGMA_ACCESS_TOKEN and running the included Python scripts. The instructions promise 'read-only' access to Figma; the code performs only read operations against the Figma API and writes exported assets locally. There is no evidence in the provided files of instructions to read unrelated host files or exfiltrate data to third-party endpoints outside the Figma API/CDN.

✓ 安装机制

This is an instruction-and-code skill with no install spec; it includes a small requirements.txt (requests, aiohttp, pathlib). No remote download/install URLs or archives are used. The install surface is standard for a local Python tool.

⚠ 凭证需求

The code and SKILL.md require a Figma access token (FIGMA_ACCESS_TOKEN), but the skill metadata claimed no required env vars or primary credential. Requesting a single Figma token is proportionate to the stated purpose, but the missing declaration is a transparency issue. Also note SKILL.md suggests storing token in a .env file (convenient but increases risk if the repository/environment is shared).

✓ 持久化与权限

The skill does not request always:true and does not modify other skills or system-wide settings. It writes export files to local output directories (expected for an export tool). Autonomous invocation is allowed by default (normal for skills) but does not combine with other high-risk flags here.

安全有层次，运行前请审查代码。

License

MIT-0

可自由使用、修改和再分发，无需署名。

查看条款 ↗

运行时依赖

无特殊依赖

版本

latestv1.0.02026/3/21

- yyl-test-skill初始版本发布。 - 提供关于yiliang.yang的信息，包括年龄、性别和爱好。

● 无害

安装命令点击复制

官方npx clawhub@latest install yyl-test-skill

镜像加速npx clawhub@latest install yyl-test-skill --registry https://cn.clawhub-mirror.com

技能文档

专业级Figma集成，用于设计系统分析、资源导出和全面的设计审计。

核心功能

1. 文件操作与分析

文件检查：获取任何Figma文件的完整JSON表示
组件提取：列出所有组件、样式和设计令牌
资源导出：批量导出帧、组件或特定节点为PNG/SVG/PDF
版本管理：访问特定文件版本和分支信息

使用示例：

"从此设计系统文件中导出所有组件"
"获取这些特定帧的JSON数据"
"显示此文件中使用的所有颜色和排版"

2. 设计系统管理

样式审计：分析颜色使用、排版一致性、间距模式
组件分析：识别未使用的组件，测量使用模式
品牌合规性：检查跨文件的品牌指南遵守情况
设计令牌提取：从Figma样式生成CSS/JSON设计令牌

使用示例：

"审计此设计系统的无障碍问题"
"从这些Figma样式生成CSS自定义属性"
"查找我们组件库中的所有不一致之处"

3. 批量资源导出

多格式导出：将资源导出为PNG、SVG、PDF或WEBP
平台特定尺寸：为iOS/Android生成@1x、@2x、@3x资源
有组织的输出：按格式或平台自动组织文件夹
客户端包：包含文档的完整交付包

使用示例：

"以PNG和SVG格式导出所有组件"
"为移动应用开发生成完整的资源包"
"创建包含所有营销资源的客户端交付物"

4. 无障碍与质量分析

对比度检查：验证WCAG颜色对比度要求
字体大小分析：确保可读的排版比例
交互元素尺寸：检查触摸目标要求
焦点状态验证：验证键盘导航模式

使用示例：

"检查此设计是否符合WCAG AA合规"
"分析移动可用性的触摸目标"
"为此应用设计生成无障碍报告"

快速开始

认证设置

# 设置您的Figma访问令牌
export FIGMA_ACCESS_TOKEN="your-token-here"
# 或存储在.env文件中
echo "FIGMA_ACCESS_TOKEN=your-token" >> .env

基本操作

# 获取文件信息和结构
python scripts/figma_client.py get-file "your-file-key"
# 导出帧为图像
python scripts/export_manager.py export-frames "file-key" --formats png,svg
# 分析设计系统一致性
python scripts/style_auditor.py audit-file "file-key" --generate-html
# 检查无障碍合规性
python scripts/accessibility_checker.py "file-key" --level AA --format html

工作流模式

设计系统审计工作流

提取文件数据 → 获取组件、样式和结构
分析一致性 → 检查样式变化和未使用元素
生成报告 → 创建详细发现和建议
手动实施 → 使用发现来指导设计改进

资源导出工作流

识别导出目标 → 指定帧、组件或节点
配置导出设置 → 设置格式、尺寸和命名约定
批量处理 → 同时导出多个资源
组织输出 → 为交接或实施构建文件结构

分析与文档工作流

提取设计数据 → 提取组件、样式和设计令牌
审计合规性 → 检查无障碍和品牌一致性
生成文档 → 创建样式指南和组件规范
导出交付物 → 为开发或客户端交接打包资源

资源

scripts/

figma_client.py - 完整的Figma API封装，包含所有REST端点
export_manager.py - 专业资源导出，支持多种格式和比例
style_auditor.py - 设计系统分析和品牌一致性检查
accessibility_checker.py - 全面的WCAG合规验证和报告

references/

figma-api-reference.md - 完整的API文档和示例
design-patterns.md - UI模式和组件最佳实践
accessibility-guidelines.md - WCAG合规要求
export-formats.md - 资源导出选项和规范

assets/

templates/design-system/ - 预建的组件库模板
templates/brand-kits/ - 标准品牌指南结构
templates/wireframes/ - 常见布局模式和流程

集成示例

与开发工作流集成

# 为CSS生成设计令牌
python scripts/export_manager.py export-tokens "file-key" --format css
# 创建组件文档
python scripts/figma_client.py document-components "file-key" --output docs/

与品牌管理集成

# 审计设计中的品牌合规性
python scripts/style_auditor.py audit-file "file-key" --brand-colors "#FF0000,#00FF00,#0000FF"
# 提取当前品牌颜色进行分析
python scripts/figma_client.py extract-colors "file-key" --output brand-colors.json

与客户端交付物集成

# 生成客户端演示资源
python scripts/export_manager.py client-package "file-key" --template presentation
# 创建开发交接资源
python scripts/export_manager.py dev-handoff "file-key" --include-specs

限制与范围

只读操作

此技能通过REST API提供对Figma文件的只读访问。它可以：

✅ 提取数据、组件和样式
✅ 多格式导出资源
✅ 分析和审计设计文件
✅ 生成综合报告

它不能做什么

❌ 修改现有文件（颜色、文本、组件）
❌ 创建新设计或组件
❌ 批量更新多个文件
❌ 实时协作功能

对于文件修改，您需要使用Plugin API开发Figma插件。

技术特性

API速率限制

内置速率限制和重试逻辑，以优雅地处理Figma的API限制。

错误处理

全面的错误处理，包含详细的日志和恢复建议。

多格式支持

以PNG、SVG、PDF和WEBP导出资源，支持平台特定尺寸。

Professional-grade Figma integration for design system analysis, asset export, and comprehensive design auditing.

Core Capabilities

1. File Operations & Analysis

File inspection: Get complete JSON representation of any Figma file
Component extraction: List all components, styles, and design tokens
Asset export: Batch export frames, components, or specific nodes as PNG/SVG/PDF
Version management: Access specific file versions and branch information

Example usage:

"Export all components from this design system file"
"Get the JSON data for these specific frames"
"Show me all the colors and typography used in this file"

2. Design System Management

Style auditing: Analyze color usage, typography consistency, spacing patterns
Component analysis: Identify unused components, measure usage patterns
Brand compliance: Check adherence to brand guidelines across files
Design token extraction: Generate CSS/JSON design tokens from Figma styles

Example usage:

"Audit this design system for accessibility issues"
"Generate CSS custom properties from these Figma styles"
"Find all inconsistencies in our component library"

3. Bulk Asset Export

Multi-format exports: Export assets as PNG, SVG, PDF, or WEBP
Platform-specific sizing: Generate @1x, @2x, @3x assets for iOS/Android
Organized output: Automatic folder organization by format or platform
Client packages: Complete deliverable packages with documentation

Example usage:

"Export all components in PNG and SVG formats"
"Generate complete asset package for mobile app development"
"Create client deliverable with all marketing assets"

4. Accessibility & Quality Analysis

Contrast checking: Verify WCAG color contrast requirements
Font size analysis: Ensure readable typography scales
Interactive element sizing: Check touch target requirements
Focus state validation: Verify keyboard navigation patterns

Example usage:

"Check this design for WCAG AA compliance"
"Analyze touch targets for mobile usability"
"Generate an accessibility report for this app design"

Quick Start

Authentication Setup

# Set your Figma access token
export FIGMA_ACCESS_TOKEN="your-token-here"# Or store in .env file
echo "FIGMA_ACCESS_TOKEN=your-token" >> .env

Basic Operations

# Get file information and structure python scripts/figma_client.py get-file "your-file-key" # Export frames as images python scripts/export_manager.py export-frames "file-key" --formats png,svg # Analyze design system consistency python scripts/style_auditor.py audit-file "file-key" --generate-html

# Check accessibility compliance python scripts/accessibility_checker.py "file-key" --level AA --format html

Workflow Patterns

Design System Audit Workflow

Extract file data → Get components, styles, and structure
Analyze consistency → Check for style variations and unused elements
Generate report → Create detailed findings and recommendations
Manual implementation → Use findings to guide design improvements

Asset Export Workflow

Identify export targets → Specify frames, components, or nodes
Configure export settings → Set formats, sizes, and naming conventions
Batch process → Export multiple assets simultaneously
Organize output → Structure files for handoff or implementation

Analysis & Documentation Workflow

Extract design data → Pull components, styles, and design tokens
Audit compliance → Check accessibility and brand consistency
Generate documentation → Create style guides and component specs
Export deliverables → Package assets for development or client handoff

Resources

scripts/

figma_client.py - Complete Figma API wrapper with all REST endpoints
export_manager.py - Professional asset export with multiple formats and scales
style_auditor.py - Design system analysis and brand consistency checking
accessibility_checker.py - Comprehensive WCAG compliance validation and reporting

references/

figma-api-reference.md - Complete API documentation and examples
design-patterns.md - UI patterns and component best practices
accessibility-guidelines.md - WCAG compliance requirements
export-formats.md - Asset export options and specifications

assets/

templates/design-system/ - Pre-built component library templates
templates/brand-kits/ - Standard brand guideline structures
templates/wireframes/ - Common layout patterns and flows

Integration Examples

With Development Workflows

# Generate design tokens for CSS python scripts/export_manager.py export-tokens "file-key" --format css

# Create component documentation python scripts/figma_client.py document-components "file-key" --output docs/

With Brand Management

# Audit brand compliance in designs python scripts/style_auditor.py audit-file "file-key" --brand-colors "#FF0000,#00FF00,#0000FF"

# Extract current brand colors for analysis python scripts/figma_client.py extract-colors "file-key" --output brand-colors.json

With Client Deliverables

# Generate client presentation assets
python scripts/export_manager.py client-package "file-key" --template presentation# Create development handoff assets
python scripts/export_manager.py dev-handoff "file-key" --include-specs

Limitations & Scope

Read-Only Operations

This skill provides read-only access to Figma files through the REST API. It can:

✅ Extract data, components, and styles
✅ Export assets in multiple formats
✅ Analyze and audit design files
✅ Generate comprehensive reports

What It Cannot Do

❌ Modify existing files (colors, text, components)
❌ Create new designs or components
❌ Batch update multiple files
❌ Real-time collaboration features

For file modifications, you would need to develop a Figma plugin using the Plugin API.

Technical Features

API Rate Limiting

Built-in rate limiting and retry logic to handle Figma's API constraints gracefully.

Error Handling

Comprehensive error handling with detailed logging and recovery suggestions.

Multi-Format Support

Export assets in PNG, SVG, PDF, and WEBP with platform-specific sizing.

数据来源：ClawHub ↗ · 中文优化：龙虾技能库

OpenClaw 技能定制 / 插件定制 / 私有工作流定制

免费技能或插件可能存在安全风险，如需更匹配、更安全的方案，建议联系付费定制

了解定制服务

License

运行时依赖

版本

安装命令 点击复制

技能文档

核心功能

1. 文件操作与分析

2. 设计系统管理

3. 批量资源导出

4. 无障碍与质量分析

快速开始

认证设置

基本操作

工作流模式

设计系统审计工作流

资源导出工作流

分析与文档工作流

资源

scripts/

references/

assets/

集成示例

与开发工作流集成

与品牌管理集成

与客户端交付物集成

限制与范围

只读操作

它不能做什么

技术特性

API速率限制

错误处理

多格式支持

Core Capabilities

1. File Operations & Analysis

2. Design System Management

3. Bulk Asset Export

4. Accessibility & Quality Analysis

Quick Start

Authentication Setup

Basic Operations

Workflow Patterns

Design System Audit Workflow

Asset Export Workflow

Analysis & Documentation Workflow

Resources

scripts/

references/

assets/

Integration Examples

With Development Workflows

With Brand Management

With Client Deliverables

Limitations & Scope

Read-Only Operations

What It Cannot Do

Technical Features

API Rate Limiting

Error Handling

Multi-Format Support

安装命令点击复制