"Tailwind CSS" matching MCP servers:

Loads your project's Tailwind CSS config and exposes tools for AI agents to query actual design tokens and validate class names, preventing hallucination of non-existent utilities.

Finds the closest Tailwind CSS palette colors to any given CSS color value. Supports multiple color spaces and customizable result filtering to help match designs to Tailwind's color system.

Enables CSS analysis with 150+ metrics, MDN documentation retrieval, and browser compatibility checks for CSS properties.

Enables auto-configuration and validation of React components against a glassmorphic design token system using an AST correction engine. It supports managing UI presets, enforcing design uniformity in Monaco IDE, and exporting tokens as CSS, Tailwind, or JavaScript variables.

Converts a Figma file into a React project using Ant Design, AG Grid, ApexCharts, and Tailwind CSS, with optional export of mobile screens as a React Native (Expo) app.

Lets AI agents browse, inspect and install Bladewell's Blade + Tailwind CSS v4 UI widgets in a Laravel app: list components, read their props and examples, check which installed files are out of date or edited, and add widgets (dry run by default). Runs inside the app with php artisan bladewell:mcp.

Multi-framework MCP server that enables AI to generate clean, semantic CSS class names (e.g., btn-primary) instead of verbose utility strings, with support for Tailwind, Bootstrap, UnoCSS, Tachyons, SSR safety, and minification for token savings.

Enables AI agents to navigate JS/TS/HTML/CSS code through TypeScript, HTML, and CSS language servers, answering hover, definition, references, symbol search, outline, and diagnostics queries. Adds a cross-file index of CSS custom properties and #id/.class selectors that single-file language servers cannot provide.

Enables AI agents to validate, search and canonicalize Tailwind class names, resolve which conflicting utility wins, inspect theme tokens and variants, check color contrast, and migrate v3 classes to v4. It answers by querying the project's own installed Tailwind engine, so results reflect the real configuration, plugins and version instead of a stale snapshot.

Translates design tokens across platforms — extracts from Tailwind/CSS/Figma and generates native themes for Material 3, SwiftUI, and CSS variables with WCAG contrast validation.

Enables an MCP client to query a token-driven SCSS design system out of the box, with no manual SDK or zod install step, exposing 30 tools covering themes, mixins, functions, tokens, animations, components, recipes, doc readers, size resolution, and prompt assembly. It resolves that data directly from the installed css-is-awesome package, so answers always match the version the user actually has.

Captures webpage styles and HTML, converts CSS to Tailwind, and applies extracted designs to frontend frameworks like React.

Enables comprehensive UI/UX development workflows through integrated tools for component development with Storybook, Tailwind CSS styling, Framer Motion/GSAP animations, Playwright testing, and automated design system generation. Provides end-to-end automation for visual regression testing, accessibility compliance, and UX optimization analysis.

Enables runtime CSS inspection of live web pages, providing computed styles, ASCII layout diagrams, overflow and scroll findings, plus browser interactions like screenshots, JavaScript evaluation, and CSS injection to debug actual rendering.

Converts design screenshots into reusable Tailwind HTML components via MCP protocol, enabling any AI to extract and export individual UI elements.

Acts as a CSS Tutor, providing personalized updates about CSS features by fetching latest news, tracking user knowledge, and guiding AI clients.

Enables coding agents to initialize a project and generate, add, or list React + TypeScript + Tailwind components directly within the project.

Enables AI agents to build and edit real HTML/CSS designs on a live canvas through 35 MCP tools, letting them inspect screenshots, computed styles and layout, then export production-ready React or Tailwind code. Humans can refine the same layers visually in a macOS editor.

Enables CSS layout verification and debugging by extracting deterministic, diffable rendered layout from a browser, allowing agents to inspect, explain, and diff CSS changes.

Generates custom React components following Shadcn UI standards with TypeScript, Tailwind CSS, and accessibility support.