home / mcp / nearest tailwind colors mcp server

Nearest Tailwind Colors MCP Server

Exposes a single tool to find the closest Tailwind CSS palette colors to any CSS color.

Installation

Add the following to your MCP client configuration file.

Configuration

{
  "mcpServers": {
    "brunocpf-nearest-tailwind-colors-mcp": {
      "command": "node",
      "args": [
        "/absolute/path/to/nearest-tailwind-colors-mcp/dist/index.js"
      ]
    }
  }
}

You can use this MCP server to quickly find the nearest Tailwind CSS palette colors to any CSS color. It exposes a single tool that analyzes your color input and returns a list of closely matching Tailwind colors, helping you design consistent palettes and fast UI iterations.

How to use

You interact with the MCP server through an MCP client. Provide a color as input, and optionally specify how many matches you want and which color space to compare in. The server returns the closest Tailwind colors by name and their hex values, making it easy to pick colors that align with Tailwind’s palette.

Practical usage patterns you can try:

Find the top 5 colors closest to a given color like #ff0000 to match a brand red
Exclude certain colors you don’t want with an excludeColors list
Change the comparison space to influence perceptual matching, e.g. use the lab space for perceptual similarity

Example command flow in your MCP client configuration will typically involve calling the tool with a color string and optional parameters for the number of results and the color space.

{
  "tool": "nearest_tailwind_colors",
  "color": "#1e90ff",
  "n": 5,
  "space": "lab",
  "excludeColors": ["white", "black"]
}

Available tools

nearest_tailwind_colors

Finds the closest Tailwind colors to a given CSS color. Parameters include color (the input CSS color), n (number of results, default 5, max 50), excludeColors (Tailwind color names to skip), and space (color comparison space such as lab or rgb; default is lab).