🎨Design
338
410

code-connect-components

Connects Figma design components to code components using Code Connect. Use when user says "code connect", "connect this component to code", "connect Figma to code", "map this component", "link component to code", "create code connect mapping", "add code connect", "connect design to code", or wants to establish mappings between Figma designs and code implementations. Requires Figma MCP server connection.

#design-systems#frontend#figma#component-architecture
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