figma-mcp
If you are the rightful owner of figma-mcp and would like to certify it and/or have it hosted online, please leave a comment on the right or send an email to henry@mcphub.com.
A Model Context Protocol (MCP) server that bridges Figma designs and React implementations, enabling pixel-perfect conversion of Figma designs into React applications.
The Figma MCP Server is designed to streamline the process of converting Figma design files into React applications. By integrating directly with the Figma API, it fetches design data and processes it into a format that is compatible with React. This server handles style conversion, asset management, and layout processing, ensuring that the final output is a pixel-perfect representation of the original design. Built with TypeScript, it offers type safety and reliability. The server supports various image formats and provides tools for fetching and processing Figma file content and images, making it a comprehensive solution for developers looking to integrate Figma designs into their React projects.
Features
- Figma API Integration: Direct connection to Figma's API for accessing design files.
- React-Ready Output: Processes Figma data into a format compatible with React.
- Style Processing: Converts Figma styles to CSS/styled-components.
- Asset Management: Handles image assets and SVG components.
- Layout Processing: Converts Figma auto-layout to Flexbox.
Tools
get_file_content
Fetches and processes Figma file content, converting layout, styles, and components into a React-ready component structure.
get_node_images
Retrieves image assets from Figma, supporting multiple formats (PNG, JPG, SVG) with configurable scaling options.
