Tailwind Shades

What Tailwind Shades MCP server does

Tailwind Shades MCP server gives AI coding agents access to the palette engine behind the Tailwind Shades project. It works with Tailwind CSS color data and supports versions 1, 2, 3, and 4. The server can generate a complete shade range from an input color, identify the nearest built-in Tailwind color, return Tailwind's predefined palettes, enumerate available color names, and convert colors between formats.

Palette generation follows the project's Tailwind-oriented shading method rather than a basic white-and-black mix. The input color remains unchanged at the shade where it best fits, and the remaining shades follow the reference Tailwind color's changes in lightness, saturation, and hue. Calculations use OKLCH, including the format used by Tailwind v4.

How it works

The MCP implementation exposes five tools:

• generate_palette creates the same palette produced by the extension and CLI for a selected Tailwind version.
• find_closest_tailwind_color returns the closest Tailwind class for a supplied color and indicates whether the difference is visible.
• get_tailwind_palette returns Tailwind's own default colors for a selected version.
• list_tailwind_colors lists the default color names available in a version.
• convert_color converts an input color to OKLCH, hex, and RGB representations.

The generated ranges depend on the selected version: v4, v3, and v2 use shades 50 through 950 or 900 as defined by their palettes, while v1 uses 100 through 900. The README documents the exact version-specific ranges and formats: v4 uses OKLCH, while earlier versions use hex in the corresponding configuration or CSS output.

Setup and configuration

The Tailwind Shades MCP server can be used as a hosted service at https://tailwindshades.bourhaouta.com/mcp, so no package installation is needed for the remote option. Claude Code, Cursor, and VS Code each have documented HTTP configuration examples using that endpoint.

For a local connection, run npx -y tailwindshades-mcp as a stdio server and register that command with the MCP client. The provided setup example uses Claude Code's claude mcp add command. The package is also listed in the MCP Registry as io.github.bourhaouta/tailwindshades.

No environment variables are documented as required. The README does not describe authentication, project discovery, or server-specific configuration for the MCP package.

Tools and capabilities

Use generate_palette when an agent needs a full custom color scale for a Tailwind project. Use find_closest_tailwind_color when selecting an existing utility such as a nearby red-500 value. get_tailwind_palette is intended for retrieving exact built-in values rather than relying on model memory, while list_tailwind_colors helps inspect the available names for a version.

convert_color is useful when a workflow needs the same input represented as OKLCH, hex, and RGB. Together, these tools cover custom palette creation, default palette lookup, color matching, name discovery, and format conversion.

Limitations and notes

The server exposes color and palette operations; it does not document file editing or direct modification of a project. The add_brand_color item described in the README is an MCP prompt shown by Claude Code, not one of the five tools.

Version selection matters because each Tailwind release has its own default palette and output conventions. The MCP excerpt does not specify automatic version detection behavior for standalone server calls, so clients should provide or otherwise determine the intended Tailwind version when that distinction matters. Remote and local transports are documented, but authentication and availability guarantees for the hosted endpoint are not described.