🎨Design
338
3,071

implement-design

Translates Figma designs into production-ready code with 1:1 visual fidelity. Use when implementing UI from Figma files, when user mentions "implement design", "generate code", "implement component", "build Figma design", provides Figma URLs, or asks to build components matching Figma specs. Requires Figma MCP server connection.

#ui#frontend#figma#coding#tooling
Share
Quick Install
>_npx skills add figma/mcp-server-guide
Documentation
Loading documentation...
Repository
Repositoryfigma/mcp-server-guide
Stars338
Last UpdatedFeb 27, 2026
Related Skills
65,034
22,258

web-design-guidelines

Reviews UI code for web interface guidelines compliance, focusing on accessibility and design best practices.

vercel-labs
vercel-labs/agent-skills
24,100
32,834

ui-ux-pro-max

A comprehensive UI/UX design assistant with 50 styles, 21 palettes, and support for multiple frameworks like React, Next.js, Vue, and Svelte

nextlevelbuilder
nextlevelbuilder/ui-ux-pro-max-skill
8,900
30,440

tailwind-design-system

Create scalable design systems using Tailwind CSS v4, design tokens, and responsive patterns.

wshobson
wshobson/agents
7,444
26

frontend-design-system

Skill for building and maintaining frontend design systems to ensure UI consistency and component reusability.

supercent-io
supercent-io/skills-template
7,400
86,065

canvas-design

Create beautiful visual art and designs in PNG and PDF formats using design principles.

anthropics
anthropics/skills