figma-design-check

Verify a planned or completed UI change against the Figma design via the Figma MCP before writing or editing component, layout, color, spacing, typography, sizing, or interaction-state code. Use when building or changing any visual surface and a Figma reference exists. Gated by capabilities.figma — skip with a capability-absent note when it is false.

Jump to install

Repository: VilnaCRM-Org/claude-plugins
Last source activity: July 2, 2026 at 17:52
Detected SKILL.md language: English
Stars: 1
Forks: 0

Install options

The review-first prompt is selected by default. You can switch to a direct command or download a local copy.

Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.

A direct command skips the review prompt. Inspect the source before running it.

npx skills add https://github.com/VilnaCRM-Org/claude-plugins --skill figma-design-check

The command stays on one line. Scroll horizontally to inspect it before copying.

Prefer a local copy? Download the files currently available to SkillsMP.

Review the source files

Read SKILL.md and any companion files shown by SkillsMP before deciding whether to install.

SKILL.md

Source instructions · Read-only preview

Back to search Back to installation

quality-standards

Overview of the protected frontend quality thresholds and a quick-reference router that maps every failing quality check — ESLint, TypeScript, markdownlint, jscpd, rust-code-analysis metrics, dependency-cruiser, Jest/Playwright coverage and visual tests, Stryker mutation, Lighthouse, and accessibility — to its make target and specialized fixing skill. Use when you need to understand quality metrics, run comprehensive quality checks, or learn which specialized skill to use. For specific issues, use dedicated skills (complexity-management for rust-code-analysis or jscpd, architecture for dependency-cruiser, frontend-testing-workflow for coverage and mutation, frontend-performance-accessibility for Lighthouse, accessibility-audit for a11y).

2026-07-03

bmad-fr-nfr-review-gate

Run a BMAD spec-driven post-implementation review gate for React/TypeScript frontend work that blocks completion until every requirement row scores 5/5 and the gate reports zero new findings. Use when a GitHub PR, feature, bugfix, or task implemented against BMAD specs needs verification of every FR/NFR, pinned NFR catalog category, expanded quality dimension, system quality attribute, positive/negative/edge test case, the frontend quality surface (coverage, mutation MSI, jscpd duplication, rust-code-analysis metrics, ESLint/TypeScript, dependency-cruiser boundaries), the Lighthouse desktop/mobile performance budgets, the mandatory accessibility gate (WCAG 2.2 AA), visual regression, whole-codebase impact surface, manual test evidence, GitHub review and requested-changes state, and CI check before completion.

2026-07-03

ci-workflow

Run the full local frontend CI suite through the profile's make target map and drive every check to green before committing. Use when the user asks to run CI, run quality checks, validate frontend code quality, or before finishing any task that touches React/TypeScript/MUI code.

2026-07-03

View all from this repository

name	figma-design-check
description	Verify a planned or completed UI change against the Figma design via the Figma MCP before writing or editing component, layout, color, spacing, typography, sizing, or interaction-state code. Use when building or changing any visual surface and a Figma reference exists. Gated by capabilities.figma — skip with a capability-absent note when it is false.