kai-tw-figmaInteract with Figma files to read structure, export layers as images, and retrieve comments using the Figma REST API with authentication.
Install via ClawdBot CLI:
clawdbot install kai-tw/kai-tw-figmaGrade Fair — based on market validation, documentation quality, package completeness, maintenance status, and authenticity signals.
Generated Mar 20, 2026
Export specific UI components or frames from a Figma design file as images (PNG, SVG) for developers to implement in code. This ensures accurate asset delivery and reduces back-and-forth between design and engineering teams.
Retrieve recent comments from a Figma file to track feedback from stakeholders or team members. This helps in organizing design iterations and addressing specific points raised during collaborative reviews.
Read the structure of a Figma file to extract information about pages, frames, and layers, aiding in creating or updating design system documentation. This automates the inventory of components for consistency across projects.
Export high-resolution images (e.g., PNG or PDF) from Figma designs for use in marketing materials, such as social media graphics or print collateral. This streamlines the process of turning designs into production-ready assets.
Export key design elements as images to include in client presentations or reports, providing visual context without requiring direct access to the Figma file. This enhances communication and approval workflows.
Offer a subscription-based service that integrates this skill into a larger platform for automating design handoffs and asset management. Revenue is generated through monthly or annual licenses for teams needing streamlined design-to-development workflows.
Use this skill as part of a freelance service to help clients export assets or manage comments from Figma files, charging per project or on an hourly basis. This model targets small businesses or individual designers lacking technical integration skills.
Provide consulting services to large organizations for integrating this skill into their existing design and development pipelines, focusing on customization and training. Revenue comes from one-time implementation fees and ongoing support contracts.
💬 Integration Tip
Ensure the FIGMA_TOKEN is securely stored as an environment variable and test the skill with a sample file key to verify API connectivity before full deployment.
Scored Apr 15, 2026
UI/UX design intelligence and implementation guidance for building polished interfaces. Use when the user asks for UI design, UX flows, information architecture, visual style direction, design systems/tokens, component specs, copy/microcopy, accessibility, or to generate/critique/refine frontend UI (HTML/CSS/JS, React, Next.js, Vue, Svelte, Tailwind). Includes workflows for (1) generating new UI layouts and styling, (2) improving existing UI/UX, (3) producing design-system tokens and component guidelines, and (4) turning UX recommendations into concrete code changes.
Comprehensive UI design skill covering fundamentals, patterns, and anti-patterns. Layout, typography, color, spacing, accessibility, motion, and component design. Use when building any web interface, reviewing design quality, or creating distinctive UIs.
Generate and serve live HTML/CSS/JS UI designs from natural language prompts. Use when the user asks to design, create, build, or prototype a website, landing page, UI, dashboard, web page, or frontend mockup. Also triggers on requests to update, tweak, or iterate on a previously generated design. Replaces traditional UI design + frontend dev workflow.
Professional Figma design analysis and asset export. Use for extracting design data, exporting assets in multiple formats, auditing accessibility compliance, analyzing design systems, and generating comprehensive design documentation. Read-only analysis of Figma files with powerful export and reporting capabilities.
UI design system toolkit for Senior UI Designer including design token generation, component documentation, responsive design calculations, and developer han...
Next.js 16 Cache Components - PPR, use cache directive, cacheLife, cacheTag, updateTag