๐ŸŽฏ

figma-use-slides

๐ŸŽฏSkill

from figma/mcp-server-guide

VibeIndex|
What it does
|

Official Figma MCP server that brings design context into AI coding workflows, enabling code generation from selected frames, design token extraction, and direct canvas editing from your IDE.

๐Ÿ“ฆ

Same repository

figma/mcp-server-guide(15 items)

figma-use-slides

Installation

Vibe Index InstallInstalls to .claude/skills/
npx vibeindex add figma/mcp-server-guide --skill figma-use-slides
skills.sh Installโš  Installs to .agents/skills/
npx skills add figma/mcp-server-guide --skill figma-use-slides
Manual InstallCopy SKILL.md content and save to the path below
~/.claude/skills/figma-use-slides/SKILL.md

SKILL.md

357Installs
-
AddedMay 14, 2026

More from this repository10

๐ŸŽฏ
implement-design๐ŸŽฏSkill

Guide for the official Figma MCP server that brings Figma design context to AI agents, enabling code generation from selected frames and design data extraction.

๐ŸŽฏ
figma-implement-design๐ŸŽฏSkill

Official Figma skill that generates code from selected Figma frames, providing design information and context to AI agents via the Figma MCP server.

๐ŸŽฏ
figma-use๐ŸŽฏSkill

Mandatory prerequisite skill for the `use_figma` MCP tool โ€” documents Figma Plugin API critical rules (use `return`, no `figma.closePlugin()`, no `figma.notify()`, `getSharedPluginData` only, 0โ€“1 color range, always `loadFontAsync` before text, clone-modify-reassign for read-only fills/strokes, work incrementally) to prevent common hard-to-debug failures.

๐ŸŽฏ
figma-generate-design๐ŸŽฏSkill

Official Figma skill that creates and modifies native Figma content on the canvas, enabling AI agents to write directly to Figma files via the MCP server.

๐ŸŽฏ
figma-generate-library๐ŸŽฏSkill

Figma MCP Server skill for generating component libraries from Figma designs, bringing design information and context to AI agents.

๐ŸŽฏ
figma-create-new-file๐ŸŽฏSkill

Figma MCP Server skill for creating new Figma design files programmatically through AI agents using the MCP server.

๐ŸŽฏ
figma-create-design-system-rules๐ŸŽฏSkill

Official Figma skill that creates design system rules from Figma files, bridging design tokens and development workflows via the Figma MCP server.

๐ŸŽฏ
figma-code-connect๐ŸŽฏSkill

Figma MCP server skill for connecting Figma components to code using Code Connect, so generated output reuses your actual components and stays consistent with your codebase and design system.

๐ŸŽฏ
create-design-system-rules๐ŸŽฏSkill

Generates custom design system rules tailored to your project for Figma-to-code workflows, creating project-level instructions that encode component patterns, naming conventions, and architectural decisions for Claude Code, Codex, and Cursor.

๐ŸŽฏ
code-connect-components๐ŸŽฏSkill

Connect Figma design components to their code implementations using Figma's Code Connect feature, analyzing design structure, scanning codebase for matching components, and establishing design-code mappings.