Design MCP Servers

ReactBits

ceorkm

38

Access 135+ animated React UI components from ReactBits.dev with intelligent caching, dependency detection, and quality scoring for modern apps.

Magic

21st-dev

4.4k

Create modern React UI components instantly with Magic AI Agent. Integrates with top IDEs for fast, stunning design and workflow improvement.

Figma

figma

360

Transform Figma designs into high-quality code with AI. Seamless figma to code and figma to html workflows for efficient development.

FreeCAD

neka-nat

583

AI-driven CAD modeling with FreeCAD: control design workflows, generate logos, and edit objects using remote Python scripting.

Magic UI

magicuidesign

176

Explore Magic UI, a React UI library offering structured component access, code suggestions, and installation guides for stunning web UIs.

Shadcn UI

heilgar

22

Easily manage and install shadcn/ui components with Shadcn UI. Discover, document, and set up components with support for multiple package managers.

Figma Context

GLips

13.5k

Unlock seamless Figma to code: streamline Figma to HTML with Framelink MCP Server for fast, accurate design-to-code workflows.

shadcn/ui

jpisnice

2.7k

Access shadcn/ui v4 components, blocks, and demos for rapid React UI library development. Seamless integration and source code via GitHub API.

Get free MCP server SVG and PNG icons from Icons8 for your coding projects. Enhance your vibe with quality icons!

Mermaid

veelenga

82

Render Mermaid diagrams in real-time with live preview, browser refresh, WebSocket updates, and SVG/PNG/PDF export plus collaboration support.

MasterGo Design

mastergo-design

216

Extract design file metadata from MasterGo for analysis or code with ease. Great for web page design programs or converting Figma to code.

Excalidraw MCP Server

Scofieldfree

79

Excalidraw MCP Server: let AI agents generate, edit, and view Excalidraw diagrams via natural-language commands with real-time collaborative whiteboard…

Figma to Code

f2c-ai

366

Convert Figma designs into clean HTML & CSS with customizable file paths and organization—fast, accurate code generation for website design and development.

Figma to React Native

kailashappdev

7

Easily convert Figma designs to code. Extract components from Figma files, generate hierarchies & metadata for smooth Figma to React Native integration.

ImageGen

writingmate

9

Generate stunning AI images with ImageGen, a unified AI image generator supporting DALL-E, Gemini & more, with smart parameters and flexible options.

PowerPoint

islem-zaraa

5

Create and edit PowerPoint presentations, apply themes, add slides and export to PDF quickly using pptxgenjs and officegen.

3D Asset Processing

geolibra

309

Convert pictures into 3D models or STEP files to STL. Optimize, compress, and validate 3D assets for web, mobile, and gaming workflows.

Sketch Context

jshmllr

66

Sketch Context connects Sketch design files to dev workflows, enabling easy component extraction and real-time design with natural language.

Freepik

freepik-company

33

Freepik integration for searching and downloading icons, managing design assets, and generating images via text-to-image with job tracking and polling.

Recraft AI

recraft-ai

46

Recraft AI is an ai image generator for creating, editing, and upscaling raster or vector images with advanced artificial intelligence control.

Heroicons

seeyangzhi

438

Search and use Heroicons easily in your React JS applications. Get usage examples, list icons, and enhance your React icons workflow.

Modus Design System

julianoczkowski

5

Discover Modus Design System: comprehensive docs, specs, and guides for React UI library and component implementation in HTML/React projects.

Black Forest Labs

fernforestgames

1

Black Forest Labs offers an AI image generator using FLUX models and signed URLs to create high-quality images for creative workflows.

Face Generator

dasheck0

6

Generate faces with thispersondoesnotexist, an AI face generator with batch options—ideal for customizable datasets and celebrities look alike images.

Tyler Forge

tyler-technologies-oss

4

Access Tyler Forge’s design system, React UI library, component APIs, and framework guides for seamless app development with intelligent search.

Miro

miroapp

68

Connect to Miro's collaborative whiteboard to turn code into diagrams and generate code from visual designs — streamline team workflows and prototyping.

Grafana UI MCP Server

grafana

7

AI-ready access to Grafana UI: full React component library—TypeScript source, MDX docs, Storybook examples, tests, and design system tokens.

TextArtTools

humanjesse

3

Create stylish Unicode text and ASCII art with 23 text styles and 322+ FIGlet fonts. Fast, free TextArtTools for banners, signatures, and social posts.

Sketchfab

eddydpyl

1

Sketchfab: Search, filter, and download 3D models via a streamlined API interface — find animated, rigged, and high-quality assets fast.

PatternFly MCP Server

patternfly

3

Access PatternFly documentation and React docs, component schemas, and dev rules via PatternFly MCP Server — AI-assisted help to build apps with PatternFly…

Jsoncut MCP Server

jsoncut

1

Jsoncut MCP Server: a json image generator and image generation API for programmatic video generation and dynamic image configuration—create JSON configs with…

Accessible Color Contrast MCP

ryelle

2

Quick color contrast checker to validate WCAG color contrast with a contrast ratio checker — find accessible color combos and optimal text colors.

Ant Design MCP Server

wxzhishang

3

Ant Design MCP Server: AI assistants for Ant Design docs, examples, APIs. Multi-version support and natural-language queries for React UI components.

Td

Pantani

5

The TouchDesigner MCP server — describe a visual to Claude, Cursor or Codex and it builds a real, playable node network (audio-reactive, generative, particle,…

Pictify

pictify-io

4

MCP server for generating images from AI agents. OG images, social cards, screenshots, banners. Works with Claude, Cursor, Windsurf. One line setup.

Muapi

SamurAIGPT

2

Mcp server code to setup muapi to work with clients like Claude, Cursor etc.

Protoscan

oxxo

1

Automated Figma prototype QA — detect dead ends, orphan screens, broken navigation, and UX issues before sharing your prototype.

Decantr

decantr-ai

1

Decantr AI design intelligence layer for AI-generated web applications

Video

KyaniteLabs

1

Guardrailed video editing MCP server for AI agents. FFmpeg, Hyperframes, repurposing tools, Python client, and CLI. Local, fast, free.