Skills
.Work. You
Rest

figma-verify

Official

Automated visual QA: compare app with Figma.

Design & Creative#figma#playwright#ui-testing#screenshot#visual-qa#design-verification#gap-report
Authorcodeforamerica
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Compare a running app's screens against Figma designs and generate a structured gap report to identify visual discrepancies.

Core Features & Use Cases

  • Capture screenshots from both live app and Figma prototype to enable side-by-side comparison.
  • Generate a markdown gap report that highlights layout, typography, color, and asset discrepancies.
  • Save output and inline MCP-rendered images for analysis; supports multiple screen mappings and end-to-end verification flows.

Quick Start

Provide the Figma file key, App base URL, and at least one screen mapping to begin the verification flow.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: figma-verify
Download link: https://github.com/codeforamerica/sebt-self-service-portal/archive/main.zip#figma-verify

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.