MCP Cursor

Enhance your development workflow with AI-powered MCP tools and extensions for Cursor IDE.

Product

  • MCP Servers
  • Getting Started
  • Documentation
  • Open Source

Resources

  • MCP Specification
  • Cursor IDE
  • MCP GitHub
  • Contributing

Legal

  • Privacy Policy
  • Terms of Service
  • Cookie Policy
Made withfor the developer community
© 2026 MCP Cursor. All rights reserved.
MCP Logo
MCP Cursor
IntroductionMCPs
IntroductionMCPs
3D MCP Cursor Visualization
  1. Home
  2. Servers
  3. F2C MCP Server MCP
F2C MCP Server MCP Logo

F2C MCP Server MCP

Model Context Protocol Integration

Overview

🎨 Convert Figma design nodes to high-fidelity HTML/CSS markup, Industry-leading position

# F2C MCP Server

🎨 Convert Figma design nodes to high-fidelity HTML/CSS markup, Industry-leading position 📚 Provides Figma design context to AI coding tools like Cursor 🚀 Supports Figma file URLs with fileKey and nodeId parameters

Installation Instructions

README: https://github.com/f2c-ai/f2c-mcp

F2C MCP Server

MCP Server smithery badge npm version npm downloads github node

English | 简体中文

A Model Context Protocol server for Figma Design to Code using F2C.

f2c-mcp-server MCP server

Features

f2c
  • 🎨 Pixel-Perfect HTML/CSS：F2C converts Figma designs to pixel-perfect HTML/CSS with precision.
  • ⚛️ Multi-Framework Support：F2C generates React, CSS Modules, and Tailwind CSS code for fast development.
  • 🧠 Figma Design Context：F2C integrates design context, ensuring compatibility with AI tools like Cursor.
  • 🔗 Figma File URL Parsing：F2C converts design nodes via Figma URLs, streamlining workflows.
  • 🖼️ Remote Image Localization：F2C automates downloading Figma images to local assets for efficiency.

How it works

  1. Configure the Server in an MCP-supported IDE (e.g., Cursor, Trae).
  2. Open your chat in IDE (e.g. agent mode in Cursor).
  3. Paste a link to a Figma Node (Right-click any node in the Figma Layer panel to copy it).
  4. Enter your requirements in the chat, such as fetching node data, downloading images, converting to code, etc.

Configuration and Development

See Configuration and Development

Data Privacy Notice

The logging tools integrated in this project are used solely for basic usage statistics and error log reporting. No sensitive information or user data is collected. All reported data is used exclusively to improve product quality and user experience.

FAQ

See FAQ

Credits

Thanks to:

  • Framelink Figma MCP Server Give Cursor and other AI-powered coding tools access to your Figma files with this Model Context Protocol server.
  • Cursor Talk to Figma MCP Allowing Cursor to communicate with Figma for reading designs and modifying them programmatically.
  • Figma MCP Server This server provides tools for viewing, commenting, and analyzing Figma designs directly through the ModelContextProtocol.

Featured MCPs

Github MCP - Model Context Protocol for Cursor IDE

Github

This server provides integration with Github's issue tracking system through MCP, allowing LLMs to interact with Github issues.

Sequential Thinking MCP - Model Context Protocol for Cursor IDE

Sequential Thinking

An MCP server implementation that provides a tool for dynamic and reflective problem-solving through a structured thinking process. Break down complex problems into manageable steps, revise and refine thoughts as understanding deepens, and branch into alternative paths of reasoning.

Puppeteer MCP - Model Context Protocol for Cursor IDE

Puppeteer

A Model Context Protocol server that provides browser automation capabilities using Puppeteer. This server enables LLMs to interact with web pages, take screenshots, execute JavaScript, and perform various browser-based operations in a real browser environment.