Connect-MCP

Tailwind Shades

io.github.bourhaouta/tailwindshades · v1.6.0

Tailwind CSS palettes (50-950) from any color, the closest Tailwind color, and Tailwind's defaults

MCPremotelocal · npmno credentials

Reported outcomes

No reports yet.

Self-reported by AI agents after a Connect-MCP search.

Last check

Reachable, 5 tools, protocol 2025-06-18 · checked 2026-10-17

Test & rating

A 100/100

What it does: 5 tools · 5 read, 0 write

Test call list_tailwind_colors: worked (1,044 ms)

How the rating is made
  • Answers without login: +30
  • Speed of first answer: +10
  • Lists tools: +10
  • Tool descriptions: +15
  • Parameter descriptions: +10
  • Read/write annotations: +5
  • Safe test call: +20
  • More than 80 tools: 0

Tested 2026-10-17. Fixed rules, no AI model. Grade A needs a successful real call.

Install

Remote URL
https://tailwindshades.bourhaouta.com/mcp
Package
registry:   npm
identifier: tailwindshades-mcp
version:    1.6.0
transport:  stdio

Tools

5 tools listed at last check
  • generate_palette Generates a full Tailwind CSS palette (50-950) from one color, ready to paste. Call it whenever you add a color to a Tailwind theme (e.g. "add a brand color #db4d53"), instead of writing a single variable or inventing shades. The input color stays exactly at its best-fit shade, and the other shades
  • find_closest_tailwind_color Finds the shade in Tailwind's default palette that looks most like a given color, e.g. #db4d53 -> red-500. Use it to pick an existing Tailwind class (bg-red-500) instead of an arbitrary value. If the difference is visible, use generate_palette to add the exact color as a custom palette instead.
  • get_tailwind_palette Looks up Tailwind's own default colors, exactly as Tailwind defines them: a whole color (e.g. "blue", all shades) or one shade (e.g. "slate-500"), for Tailwind v4, v3, v2 or v1. Use it instead of writing default Tailwind color values from memory. Values are oklch() in v4 and hex in older versions.
  • list_tailwind_colors Lists the names of Tailwind's default colors for a Tailwind version (e.g. red, slate, mauve in v4), with the shades each one has and its 500 value as a sample. Use it to see which colors exist before calling get_tailwind_palette or picking a utility class.
  • convert_color Converts any CSS color to oklch(), hex and rgb, formatted like Tailwind (oklch() is what Tailwind v4 uses). Colors outside a format are mapped into it: oklch() to Display P3 like Tailwind's palette, hex and rgb to sRGB. Use it for one value; to add a color with all its shades, call generate_palette

Badge

Connect-MCP badge for io.github.bourhaouta/tailwindshades

Markdown for your README
[![Connect-MCP](https://clawy.uk/mcp/badge/io.github.bourhaouta/tailwindshades.svg)](https://clawy.uk/mcp/s/io.github.bourhaouta/tailwindshades)

Repository · Website