"How to Convert Figma Designs to Code" matching MCP servers:

MCP server for ingesting UI screenshots, Figma MCP node JSON, or hybrid Figma-plus-screenshot sources into a cross-platform design-to-code artifact pipeline.

Enables AI assistants to convert CSS-animated SVGs into videos (MP4/WebM/MKV/MOV) and animated images (aPNG/GIF) with frame-accurate rendering and transparency support.

Routes one brief to the right image model across 60+ (gpt-image-1.5, Ideogram 3, Recraft V4, Flux), validates the output, and fans out to iOS/Android/PWA/favicon/visionOS/Flutter bundles. Works without an API key via Pollinations, HF Inference, Stable Horde, or host-LLM inline SVG.

Enables LLM agents to process local videos into timestamped, citable text documents and then query them through tools for listing videos, retrieving transcripts, and fetching specific segments, all fully offline.

Converts local images or remote image URLs to Base64 format via the MCP protocol, enabling AI assistants to process images.

MCP server for converting images to WebP and AVIF formats with batch processing and parallel execution.

Enables text-to-image generation using Zhipu AI's CogView-4 API. Supports generating images from text prompts with configurable size and quality parameters through MCP-compatible clients like Claude Desktop and Cline.

Enables AI coding tools such as Claude Code and Codex to interact with and modify Figma designs via the Model Context Protocol.

Provides governed MCP tools for a controlled, AI-assisted asset-change pipeline, featuring natural-language requests, mandatory approvals, execution-time revalidation, and complete audit.

MCP server for the Figma API. Lets AI agents fetch designs, nodes, and rendered images from Figma.

Enables an agent to read, edit, and build Figma designs from scratch — including style guides, variables, components, and screens — through a local plugin bridge to the open file's Plugin API, with no Figma token or REST API calls.

Enables stdio MCP clients such as Cursor and Claude Code to read and modify the currently open Figma Desktop file, export selected nodes as local PNG/SVG files, and create or edit basic canvas nodes using precise layout data for pixel-level reconstruction.

Connects an MCP client such as Claude Code to the Figma file open in the desktop app, letting the agent create frames, write text, apply styles, import images and SVGs, take screenshots, and run arbitrary Figma Plugin API code. Commands travel through a local development plugin instead of Figma's web API, so there are no tokens, quotas, or rate limits.

An MCP server that bridges Claude Code to Figma, enabling AI-driven design creation, modification, and export via semantic tools and WebSocket communication.

Renders source code as beautiful SVG or PNG images with syntax highlighting, line numbers, and diff support. Ideal for AI agents to present code visually to humans or for sharing snippets.

MCP server for downloading images from Figma designs using access tokens. Supports multiple export formats and scale factors via a single tool.

Enables extraction of design context from Figma files as CSS-like properties and provides tools to render Figma nodes as images. It integrates with AI agents via the Model Context Protocol to facilitate design-to-code workflows by providing layout, style, and typography information.

Enables interaction with Figma designs through the Figma API, allowing users to export images in multiple formats, extract style data and CSS, analyze design elements, and retrieve SVG code from Figma files. Supports batch operations and comprehensive design element analysis including images, vectors, and components.

A comprehensive MCP server for Vue component development and Figma design restoration, featuring snapDOM-powered screenshots, pixel-perfect visual comparison, and automated SVG optimization.

Enables Claude Code to convert PDF files to high-quality PNG images, download academic papers, and batch process PDFs with automatic folder organization.