Logo

Product updates

Inside Figma

Dev Mode

Get Started

Introducing Dev Mode MCP.

Figma meets developer workflow.

Figma meets developer workflow.

Try the Beta

Context-rich code.

Context-rich code.

Context-rich code.

Bring Figma’s design data into your developer tools and generate code with accurate design context using the new Model Context Protocol (MCP) server.

Bring Figma’s design data into your developer tools and generate code with accurate design context using the new Model Context Protocol (MCP) server.

Square
Square
Circle

Precise variable mapping.

Precise variable mapping.

Precise variable mapping.

Sync variables, components, and styles between Figma and your codebase for exact matches, reducing guesswork and keeping everything in sync.

Sync variables, components, and styles between Figma and your codebase for exact matches, reducing guesswork and keeping everything in sync.

Flexible, scalable workflows.

Flexible, scalable workflows.

Flexible, scalable workflows.

Support for major agentic coding tools lets you adopt design-informed code generation at any scale, with future updates for server capabilities ahead.

Support for major agentic coding tools lets you adopt design-informed code generation at any scale, with future updates for server capabilities ahead.

Triangle

Context is the key to high-fidelity design-to-code.

Context is the key to high-fidelity design-to-code.

Figma’s MCP server feeds LLMs not just visuals—but true design intent, variable references, and real content metadata, enabling AI to generate code that fits your team’s unique patterns.

Figma’s MCP server feeds LLMs not just visuals—but true design intent, variable references, and real content metadata, enabling AI to generate code that fits your team’s unique patterns.

Context is the key to high-fidelity design-to-code.

Context is the key to high-fidelity design-to-code.

Figma’s MCP server feeds LLMs not just visuals—but true design intent, variable references, and real content metadata, enabling AI to generate code that fits your team’s unique patterns.

Figma’s MCP server feeds LLMs not just visuals—but true design intent, variable references, and real content metadata, enabling AI to generate code that fits your team’s unique patterns.

Context is the key to high-fidelity design-to-code.

Context is the key to high-fidelity design-to-code.

Figma’s MCP server feeds LLMs not just visuals—but true design intent, variable references, and real content metadata, enabling AI to generate code that fits your team’s unique patterns.

Figma’s MCP server feeds LLMs not just visuals—but true design intent, variable references, and real content metadata, enabling AI to generate code that fits your team’s unique patterns.

Shape the future with us.

Shape the future with us.

Share feedback or join the beta - your experience helps us improve Dev Mode MCP server.

Share feedback or join the beta - your experience helps us improve Dev Mode MCP server.

Share feedback or join the beta - your experience helps us improve Dev Mode MCP server.

Give Feedback

Logo

Product

Overview

Pricing

Docs

Company

About

Careers

Press

JOSUE SB

Building digital things that actually make sense

2025 - All rights reserved

JOSUE SB

Building digital things that actually make sense

2025 - All rights reserved

JOSUE SB

Building digital things that actually make sense

2025 - All rights reserved