work-with-design-systems

by natdexterra · MCP Server · ★ 45

About work-with-design-systems

work-with-design-systems A Claude skill for working with Figma design systems — two modes in one place: inspect (read-only audits with WCAG checks, component scoring, handoff docs) and build (creating components, fixing foundations, adding slots, writing descriptions). Build mode optionally extends to Phase 6 (sync to code) — generates , an audit script, and AI rules file for your codebase. Works with Claude Code, Cursor, and Codex. What's new in v2.0 This is a major release. The skill was previously called and only handled building.

agent-skillsclaude-codedesign-systemdesign-to-codedesign-tokensfigmafigma-mcpfigma-plugin-apimcpskill

Quick Facts

Stars45
Forks4
LanguageJavaScript
CategoryMCP Server
LicenseMIT
Quality Score68.3175161950557/100
Last Updated2026-06-13
Created2026-04-01
Platformsclaude-code, mcp, node
Est. Tokens~18k

Compatible Skills

These tools work well together with work-with-design-systems for enhanced workflows:

  • design-system-ops — semantic(0.57)+complementary+rare_topics+similar_pop+shared_platform (73%)
  • claude-design-auditor-skill — semantic(0.52)+complementary+rare_topics+similar_pop+shared_platform (67%)
  • bridge — semantic(0.64)+rare_topics+similar_pop+shared_platform (61%)
  • styleseed — semantic(0.29)+complementary+rare_topics+similar_pop+shared_platform (59%)

More MCP Server Tools

Explore other popular mcp server tools:

View all MCP Server tools →

Popular JavaScript Agent Tools

Frequently Asked Questions

What is work-with-design-systems?

work-with-design-systems is Inspect, build, or extend Figma design systems from Claude Code. Read-only audits with WCAG checks and component scoring, build mode with variable bindings and slots, optional Phase 6 sync to tokens.c. It is categorized as a MCP Server with 45 GitHub stars.

What programming language is work-with-design-systems written in?

work-with-design-systems is primarily written in JavaScript. It covers topics such as agent-skills, claude-code, design-system.

How do I install or use work-with-design-systems?

You can find installation instructions and usage details in the work-with-design-systems GitHub repository at github.com/natdexterra/work-with-design-systems. The project has 45 stars and 4 forks, indicating an active community.

What license does work-with-design-systems use?

work-with-design-systems is released under the MIT license, making it free to use and modify according to the license terms.

View on GitHub → Browse MCP Server tools