F2C MCP Server
@f2c-ai
F2C MCP Server について
F2C MCP Server
基本情報
設定
以下の設定を使って、このサーバーを MCP 対応クライアントに追加してください。
{
"mcpServers": {
"f2c-mcp": {
"command": "npx",
"args": [
"-y",
"@f2c/mcp"
],
"env": {
"personalToken": ""
}
}
}
}ツール
ツールは検出されませんでした
ツールは README から自動的に抽出されます。メンテナーは ## Tools という見出しの下に記載することで、このタブに反映できます。
概要
What is F2C MCP Server?
A Model Context Protocol server that converts Figma designs to code using the F2C engine. It enables AI-powered coding tools (like Cursor) to access Figma design context, fetch node data, download images, and generate pixel-perfect HTML/CSS, React, or Tailwind CSS code.
How to use F2C MCP Server?
Configure the server in an MCP-supported IDE (e.g., Cursor, Trae, or Comate AI IDE). In the IDE chat, paste a Figma node link (copied from Figma’s layer panel) and enter your requirements such as fetching node data, downloading images, or converting to code.
Key features of F2C MCP Server
- Pixel-perfect HTML/CSS generation from Figma designs
- Multi‑framework support (React, CSS Modules, Tailwind CSS)
- Integrates Figma design context for AI tool compatibility
- Converts design nodes via Figma file URLs
- Automates downloading Figma images to local assets
Use cases of F2C MCP Server
- Fetching Figma node data and metadata in an AI coding assistant
- Converting Figma design layers into production‑ready code
- Downloading and localizing remote images from Figma
- Streamlining design‑to‑code workflows in IDEs like Cursor or Trae
FAQ from F2C MCP Server
What does F2C MCP Server do?
It is a Model Context Protocol server that converts Figma designs into code (HTML/CSS, React, Tailwind CSS) and provides design context to AI coding tools.
Does this server have any rate limits?
Yes. Due to Figma REST API rate limits, users may be affected. If so, the README recommends switching to @f2c/mcp-plugin for normal operation.
Where does the data (downloaded images, etc.) live?
The server automates downloading Figma images to local assets, so data is stored locally on your machine.
What dependencies or runtime does it require?
The server is distributed as an npm package (@f2c/mcp) and runs on Node.js (version indicated by the badge).
How does authentication work for the Figma API?
The README does not detail authentication; it states the server uses Figma REST API and can be configured in an MCP-supported IDE, implying the Figma API key is handled via the IDE or environment configuration.
「その他」の他のコンテンツ
Reactive Resume
amruthpillaiA one-of-a-kind resume builder that keeps your privacy in mind. Completely secure, customizable, portable, open-source and free forever. Try it out today!
Core Philosophy: Connect, Unify, Respond
mindsdbDelegate anything. It comes back done.
MCP Go 🚀
mark3labsA Go implementation of the Model Context Protocol (MCP), enabling seamless integration between LLM applications and external data sources and tools.
Awesome-MCP-ZH
yzflyMCP 资源精选, MCP指南,Claude MCP,MCP Servers, MCP Clients
Activepieces
activepiecesAI Agents & MCPs & AI Workflow Automation • (~400 MCP servers for AI agents) • AI Automation / AI Agent with MCPs • AI Workflows & AI Agents • MCPs for AI Agents
コメント