"Resources for Frontend and UI Design" matching MCP servers:

Enables AI coding agents to search public design-system catalogs and retrieve only the relevant tokens or sections for a chosen brand, so generated UI matches a specified visual style instead of generic AI output.

Provides comprehensive UI design assistance tools for LLMs, generating color palettes, typography, spacing systems, shadows, design tokens, and more via the MCP protocol.

Frontend Design Loop MCP enables coding agents to improve web page designs through screenshot-grounded iteration and proof artifacts, making pages materially better.

Provides 8 MCP tools for frontend design: load design system, generate components, scaffold pages, review consistency, extract tokens, check WCAG 2.2 AA, test responsiveness, and export to Figma.

A zero-dependency local MCP server that audits and auto-fixes React/Next.js frontend code smells, unused imports, and responsive UI issues

MCP server for ingesting UI screenshots, Figma MCP node JSON, or hybrid Figma-plus-screenshot sources into a cross-platform design-to-code artifact pipeline.

Enables AI assistants to discover, document, and generate React code using the pastel-themed Baby Design UI component library. It provides tools for retrieving design tokens and component specifications to streamline the development of user interfaces.

Enables coding agents to visually verify front-end changes by capturing screenshots at real breakpoints, identifying the single element responsible for overflow, and surfacing console and network errors.

Gives AI coding agents a ten-phase frontend design pipeline (audit, style direction, build, review, verify, perf, brand) with an exclusive style menu. Its verify_page tool loads a URL in a real Playwright browser at mobile and desktop viewports and returns screenshots, ARIA snapshots, console errors, failed requests, horizontal-overflow offenders, axe-core violations, and pointer type.

Exposes GOV.UK Frontend components and Design System patterns and styles as MCP resources for use with AI assistants.

LLM routing proxy that cuts API costs 60-90% by auto-selecting the cheapest capable model across OpenAI, Anthropic, and Google. Provides stats, config, and model comparison tools via MCP.

Enables coding agents to load frontend anti-slop rules and deterministically verify generated React, Next.js, and Tailwind UI before completion. It audits for common AI-generated patterns, checks stylesheet/token wiring, provides real or placeholder images, and verifies TypeScript compilation.

Search, inspect and install the 21 free MIT components of Marvelous UI (framework-agnostic Web Components and CSS) and their design tokens into a project. Runs locally over stdio with no network calls.

Delegates frontend/UI refinement to Gemini via agy CLI, using iterative vision loops and diff-gating to realign UIs to design mockups without affecting backend code.

A design harness for AI coding agents. Better Design gives an agent design systems, UI and UX principles, icons and UI review: it finds or creates a design system that fits the product and installs its components, explains how sign-up, forms and onboarding should work, and reviews finished screens for readability, accessibility and unclear copy.

Provides AI assistants with frontend development tools including component scaffolding, bundle analysis, accessibility checks, and responsive design guidance. Enables automated generation of React components with tests and stories, bundle optimization recommendations, and WCAG compliance fixes.

A comprehensive MCP server for frontend analysis. It provides Google Lighthouse audits, code quality checks, SEO metadata verification, accessibility analysis, and bundle optimization for React and Next.js projects.

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.

Transforms design inputs (URLs, screenshots, descriptions) into production-ready React components following G2's Elevate 2.0 design system, providing both an MCP server for Claude Code and a web interface.

An MCP server that provides tools for frontend development, including i18n issue detection, OpenAPI type generation, and project structure analysis.