"Tips for Creating Elegant and Stylish UI Designs" matching MCP servers:

MCP server for the Elegant 1.0 design system that provides 12 tools for AI-assisted UI generation. It outputs single HTML files with CSS, JS, and assets served from CDN, requiring a GitHub token to fetch component documentation.

A TypeScript server that enhances AI assistants' capabilities when working with Starwind UI components, providing tools for project initialization, component installation, documentation access, and more.

Enables to perform mathematical calculations, retrieve weather information, and manage files through a standardized MCP interface, showcasing best practices for building MCP servers.

MCP server that lets AI agents search and inspect shadcn components from the encode-ui registry, returning metadata, source code, and install commands.

Bidirectional MCP bridge enabling AI assistants to draw UI on Figma canvas and read designs back as structured data or code tokens via localhost, requiring Figma Desktop.

MCP server for the coss ui design system, enabling AI agents to fetch components, props, and design tokens on demand for accurate, low-cost code generation.

MCP server that gives Claude deep awareness of your frontend codebase by scanning components, hooks, services, routes, and data flow for React or Vue projects.

Enables offline composition and validation of Basecoat UI interfaces in Astro and static HTML projects via curated templates, design resources, and static checks.

Enables UI debugging on physical iOS devices by bridging to an in-app DebugBridge HTTP service, supporting UI inspection, element interaction, log retrieval, and runtime validation.

Provides AI models with structured design guidelines and system prompts for creating consistent, high-quality interactive visualizations like charts, diagrams, and mockups. It enables on-demand loading of UI specifications to optimize token usage while ensuring visually polished and functional widget generation.

Imports public websites and extracts UI components and design tokens, making them available via MCP for AI coding agents to reuse in implementations.

Enables AI-driven generation of UI components, full applications, and backend code across multiple frameworks (React, Vue, Angular, Svelte, HTML) with Figma integration and brand identity support.

A Model Context Protocol server that provides access to Magic UI components, allowing AI assistants and other MCP clients to discover and use UI components from the Magic UI design system.

Local, free MCP server for brand logo search and shadcn/ui component search & source lookup, requiring no API keys or login.

Enables coding agents and CI to verify rendered web UIs against design token usage, layout constraints, and accessibility rules, returning concise pass/fail verdicts with actionable findings.

A local web interface and MCP server for converting documents (PDF, Word, Excel, images, audio, etc.) to Markdown using Microsoft's MarkItDown library.

Ply — ply-ui.com — is an Angular + Tailwind copy-in catalog for coding agents. List, search, and inspect 218 components (128 MIT). This host is read-only and returns npx ply-ui-cli add . Local stdio: npx -y ply-ui-mcp. Not MUI Base UI.

Native Claude Code integration for @annondeveloper/ui-kit — a zero-dependency React component library with 147 components, 3 weight tiers, physics-based animations, and OKLCH color system. Gives Claude deep awareness of the library's components, design patterns, and conventions. Includes 5 skills for component discovery, code generation, design system reference, tier selection, and accessibility

Enables coding agents to inspect live browser runtime evidence, such as blocking elements and interaction surfaces, and to independently verify whether a code fix resolved the issue.

Gives MCP clients access to a registry of elite UI patterns, components, and motion configs with real, copy-pasteable React/TSX implementations.