# Figma Implement Design

> Route Figma-to-code implementation to Figma's current official MCP workflow while preserving repository conventions and independent verification. Use when a supplied Figma selection must become production code.

- **Type:** Skill
- **Install:** `agentstack add skill-sarveshsea-design-skills-figma-implement-design`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [sarveshsea](https://agentstack.voostack.com/s/sarveshsea)
- **Installs:** 0
- **Category:** [Content & Media](https://agentstack.voostack.com/c/content-and-media)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [sarveshsea](https://github.com/sarveshsea)
- **Source:** https://github.com/sarveshsea/design-skills/tree/main/skills/figma-implement-design
- **Website:** https://www.memoire.cv/notes/community/

## Install

```sh
agentstack add skill-sarveshsea-design-skills-figma-implement-design
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Figma Implement Design Router

This repository does not reproduce Figma's implementation skill. Use the official workflow as the integration layer and the local codebase as the implementation authority.

## Procedure

1. Confirm the exact Figma file or selection and the target repository surface.
2. Read local instructions, components, tokens, framework conventions, tests, and accessibility requirements.
3. Load Figma's current implementation skill from the official MCP guide distribution.
4. Use the official integration to obtain current design context and assets.
5. Reuse local components and tokens before creating new ones.
6. Implement through the repository's normal test and review workflow.
7. Compare the result against the supplied design at representative states and viewport sizes.
8. If the official skill is unavailable, request exported context or screenshots and proceed only as an explicitly limited static implementation.

Official source: [Figma MCP Server Guide](https://github.com/figma/mcp-server-guide)

Return files changed, reused components, verification evidence, visual differences, and unresolved integration limits.

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [sarveshsea](https://github.com/sarveshsea)
- **Source:** [sarveshsea/design-skills](https://github.com/sarveshsea/design-skills)
- **License:** MIT
- **Homepage:** https://www.memoire.cv/notes/community/

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-sarveshsea-design-skills-figma-implement-design
- Seller: https://agentstack.voostack.com/s/sarveshsea
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.
