Feuse Mcp

Created By

Panzer-Jack7 months ago

Frontend Useful MCP Tools - Essential utilities for web developers to automate API integration and code generation

# web-mcp

# d2c

Overview Content Tools Comments

Content

📖 Documentation

feuse-mcp Official Documentation

✨ Features

🎨 Figma Integration: Built-in integration with Figma-Context-MCP for seamless Figma design-to-code conversion and automatic asset extraction
📝 API Automation: Generate TypeScript interface types, API URL constants, mock data, and request functions from API documentation
🖼️ Asset Management: Download SVG and PNG images from Figma files with organized file structure
🎯 Similarity Comparison: Compare generated code pages with original Figma prototypes for accuracy validation
🛠️ Project Standards: Generate global specification guidance files for Copilot & Cursor based on current project architecture
🔧 Color Variables: Extract and convert Figma color variables to CSS/design tokens in specified standards (UnoCSS, TailwindCSS, or custom structures)

🔧 Available Toolset (Continuously Updated)

Tool Name	Category	Description	Input Parameters	Notes
Figma-To-Code	Figma Integration	Generate frontend code based on Figma styling info with PNG assistance	`fileKey`, `nodeId`(optional)	Auto-adapts to local configs (ESLint etc), supports responsive layouts
extract-svg-assets	Asset Analysis	Analyze Figma DSL structure and auto-extract SVG resources	`fileKey`, `nodeId`(optional)	Intelligent Figma file analysis, batch extraction of SVG icons/vectors
extract-color-vars	Design Tokens	Extract color variables from Figma DSL to CSS framework configs	`fileKey`, `nodeId`(optional)	Supports UnoCSS, TailwindCSS, or custom file format output
similarity-figma	Quality Control	Compare Figma prototypes with project page screenshots	`url`, `fileKey`, `nodeId`(optional)	Visual comparison with intelligent similarity scoring and detailed analysis
api-automation	Development Tools	Parse backend API docs and generate types, constants, mock data	`apiDocs`	Supports multiple API doc formats, generates complete frontend API toolkit
initialize-project-standard	Project Management	Analyze project structure and generate Copilot/Cursor global rules	No parameters	Auto-generates intelligent coding assistant project context and standards
Download-Figma-Images	Asset Management	Batch download SVG and PNG image resources from Figma by node ID	`fileKey`, `nodes[]`, `localPath`	Supports imageRef handling, auto-creates directory structure (low-level tool for other MCPs)
download-svg-assets	Asset Management	Download SVG vector resources from Figma by image/icon node ID	`fileKey`, `nodes[]`, `localPath`	SVG format only, supports complex node structures (low-level tool for other MCPs)

Server Config

{
  "mcpServers": {
    "feuse-mcp": {
      "command": "npx",
      "args": [
        "feuse-mcp@latest"
      ],
      "env": {
        "FIGMA_API_KEY": "YOUR_FIGMA_API_KEY"
      }
    }
  }
}

Recommend Servers

TraeBuild with Free GPT-4.1 & Claude 3.7. Fully MCP-Ready.

MCP AdvisorMCP Advisor & Installation - Use the right MCP server for your needs

Visual Studio Code - Open Source ("Code - OSS")Visual Studio Code

WindsurfThe new purpose-built IDE to harness magic

Playwright McpPlaywright MCP server

ChatWiseThe second fastest AI chatbot™

DeepChatYour AI Partner on Desktop

Howtocook Mcp基于Anduin2017 / HowToCook （程序员在家做饭指南）的mcp server，帮你推荐菜谱、规划膳食，解决“今天吃什么“的世纪难题； Based on Anduin2017/HowToCook (Programmer's Guide to Cooking at Home), MCP Server helps you recommend recipes, plan meals, and solve the century old problem of "what to eat today"

EdgeOne Pages MCPAn MCP service designed for deploying HTML content to EdgeOne Pages and obtaining an accessible public URL.

Context7Context7 MCP Server -- Up-to-date code documentation for LLMs and AI code editors

Zhipu Web SearchZhipu Web Search MCP Server is a search engine specifically designed for large models. It integrates four search engines, allowing users to flexibly compare and switch between them. Building upon the web crawling and ranking capabilities of traditional search engines, it enhances intent recognition capabilities, returning results more suitable for large model processing (such as webpage titles, URLs, summaries, site names, site icons, etc.). This helps AI applications achieve "dynamic knowledge acquisition" and "precise scenario adaptation" capabilities.