# Tailwind Shades (npm · tailwindshades-mcp)

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

- Trust score: 95/100 (high trust)
- Change this week: +1
- Registry status: active
- Liveness: live
- Owner verified: no
- Last scored: 2026-11-04

## Components

- remote · `tailwindshades.bourhaouta.com`: 88/100, [markdown](https://verifymcp.io/servers/bourhaouta-tailwindshades/tailwindshades.md), [page](https://verifymcp.io/servers/bourhaouta-tailwindshades/tailwindshades)
- npm · `tailwindshades-mcp`: 95/100 (this document), [markdown](https://verifymcp.io/servers/bourhaouta-tailwindshades/tailwindshades-mcp.md), [page](https://verifymcp.io/servers/bourhaouta-tailwindshades/tailwindshades-mcp)

## Channel facts

- Registry: `npm`
- Package: `tailwindshades-mcp`
- Version: `1.6.0`
- Transport: `stdio`

## Trust breakdown

How this component scores in each security and reliability category. Every signal is checked automatically from public evidence about the published package, including repeated runs of it in an isolated sandbox, and we only credit what we can confirm. Scores are 0–100 per category. Scoring method: https://verifymcp.io/docs/scoring (what has changed: https://verifymcp.io/docs/scoring/changelog)

Scored 2026-11-04.

- **Supply Chain Security**: 100/100
  - No malware found by supply-chain analysis.
  - No known CVEs affecting this package version or its production dependencies.
  - No install/post-install scripts declared.
  - 0 of 5 dependencies flagged as unhealthy.
- **Provenance & Transparency**: 97/100
  - Source repository is publicly reachable at the declared URL.
  - Cryptographically verified build provenance (signed, bound to bourhaouta/vscode-tailwindshades).
  - Clear OSI-approved license (MIT).
  - Actively maintained (last published 22 days ago).
  - Disclosure check failed: no security disclosure policy was found in the source repository.
- **Schema Quality & AI Usability**: 78/100
  - 100% of prompts and resources have a non-trivial description (not blank, and not just the item's name).
  - AI-judged instruction clarity (excellent).
  - Context-footprint check failed: tool/resource definitions use about 1209 tokens (~241/item across 5 items; 5 tools + 0 resources), over budget; trim descriptions and params.
  - Usage-examples check failed: none of the tools include examples.
- **Stability & Change Management**: 100/100
  - No destabilizing schema changes in the last 30 days.
- **Tool Coverage**: 100/100
  - 100% of tools have a non-trivial description (not blank, and not just the tool's name).
  - 100% of tool parameters carry a description.
  - Structured output schemas are declared (100% of tools); any adoption earns full credit.
- **Tool Safety**: 100/100
  - No prompt-injection markers were found in the server instructions, tool names or descriptions we captured.
  - We read all 5 captured tool definition(s), and no name or description among them implies an irreversible operation.
  - An AI judge read all 6 captured unit(s) of tool text and found none that tries to manipulate the model reading it.
- **Capabilities**: 100/100
  - Implements a current MCP spec version (2026-07-28).

## Install

### How do I install the Tailwind Shades MCP server?

Tailwind Shades runs locally as an npm package, launched with npx -y tailwindshades-mcp. Ready-made configuration for Claude, Cursor, VS Code, Codex and 5 more is on this page, copied from each client's own documentation.

### Claude

```bash
claude mcp add bourhaouta-tailwindshades -- npx -y tailwindshades-mcp
```

### Cursor

```json
{
  "mcpServers": {
    "bourhaouta-tailwindshades": {
      "command": "npx",
      "args": [
        "-y",
        "tailwindshades-mcp"
      ]
    }
  }
}
```

### VS Code

```json
{
  "servers": {
    "bourhaouta-tailwindshades": {
      "command": "npx",
      "args": [
        "-y",
        "tailwindshades-mcp"
      ]
    }
  }
}
```

### Codex

```bash
codex mcp add bourhaouta-tailwindshades -- npx -y tailwindshades-mcp
```

### opencode

```json
{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "bourhaouta-tailwindshades": {
      "type": "local",
      "command": [
        "npx",
        "-y",
        "tailwindshades-mcp"
      ],
      "enabled": true
    }
  }
}
```

### OpenClaw

```bash
openclaw mcp add bourhaouta-tailwindshades --command npx --arg -y --arg tailwindshades-mcp
```

### Hermes

```yaml
mcp_servers:
  bourhaouta-tailwindshades:
    command: "npx"
    args: ["-y", "tailwindshades-mcp"]
```

### Netclaw

```json
{
  "McpServers": {
    "bourhaouta-tailwindshades": {
      "Transport": "stdio",
      "Command": "npx",
      "Arguments": [
        "-y",
        "tailwindshades-mcp"
      ]
    }
  }
}
```

### Vellum

```bash
assistant mcp add bourhaouta-tailwindshades -t stdio -c npx -a -y tailwindshades-mcp
```

### Other

```json
{
  "mcpServers": {
    "bourhaouta-tailwindshades": {
      "command": "npx",
      "args": [
        "-y",
        "tailwindshades-mcp"
      ]
    }
  }
}
```

## Changelog

Every change recorded for this component, newest first. Days that predate change tracking, or that we cannot explain, say so: "we were watching and nothing happened" and "we were not watching" are different claims.

### 2026-10-31 (score 95, 0)

- [security] Stability: 0.97 → pass

### 2026-10-30 (score 95, +1)

No change was recorded against any check on this day. Stability & Change Management went from 93 to 97. That category is still filling its 30-day observation window: 28 days of observed history at the previous scan, 29 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-27 (score 94, +1)

No change was recorded against any check on this day. Stability & Change Management went from 83 to 87. That category is still filling its 30-day observation window: 25 days of observed history at the previous scan, 26 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-25 (score 93, +1)

No change was recorded against any check on this day. Stability & Change Management went from 77 to 80. That category is still filling its 30-day observation window: 23 days of observed history at the previous scan, 24 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-23 (score 92, +1)

No change was recorded against any check on this day. Stability & Change Management went from 70 to 73. That category is still filling its 30-day observation window: 21 days of observed history at the previous scan, 22 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-21 (score 91, +1)

No change was recorded against any check on this day. Stability & Change Management went from 63 to 67. That category is still filling its 30-day observation window: 19 days of observed history at the previous scan, 20 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-19 (score 90, +1)

No change was recorded against any check on this day. Stability & Change Management went from 57 to 60. That category is still filling its 30-day observation window: 17 days of observed history at the previous scan, 18 at this one. The score rises as the window fills, whether or not the server changes.

### 2026-10-17 (score 89, +1)

No change was recorded against any check on this day. Stability & Change Management went from 50 to 53. That category is still filling its 30-day observation window: 15 days of observed history at the previous scan, 16 at this one. The score rises as the window fills, whether or not the server changes.

## MCP tools (5)

### `generate_palette` (~456 tokens)

Generate a Tailwind 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 follow the closest Tailwind color, so they look like Tailwind's own.

Input parameters:

- `color` (string, required): Any CSS color: hex (#db4d53), rgb(), hsl(), oklch() or a named color
- `format` (string): Color format. Defaults to oklch for v4 and hex for older versions
- `name` (string): Color name used in the code, e.g. "brand". Defaults to the closest Tailwind color, which replaces Tailwind's own palette of that name (e.g. red), so pass a name unless that is what the user wants
- `output` (string): theme: a v4 @theme block for the main CSS file. config: an object for theme.extend.colors in tailwind.config.js. css: plain CSS variables. live (v4 only): for a color picked at runtime (user, tenant…
- `plain` (boolean): With output live or shopify: a plain :root block instead of @theme, for projects without Tailwind (like the Dawn theme)
- `semantic` (boolean): With output live or shopify: also add --color-<name>-foreground for text on the color: white or the darkest shade, whichever contrasts more, following the runtime color
- `tailwindVersion` (number): The project's Tailwind CSS major version. Defaults to 4

Output parameters:

- `avoid` (object): White text on the input color, when it fails WCAG AA
- `closestTailwindColor` (string): Tailwind color whose curve the palette follows
- `code` (string): The palette as code, ready to paste
- `format` (string)
- `inputShade` (number): Shade that holds the input color unchanged, e.g. 500
- `name` (string)
- `output` (string)
- `readablePairs` (array): Text and background pairs that pass WCAG AA. Use them for text and buttons in this color. Not for live and shopify outputs, whose shades change at runtime
- `replacesTailwindColor` (boolean): True when the code replaces a default Tailwind palette (default color name, theme or config output)
- `shades` (array)
- `tailwindVersion` (number)

### `find_closest_tailwind_color` (~135 tokens)

Find the 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.

Input parameters:

- `color` (string, required): Any CSS color: hex (#db4d53), rgb(), hsl(), oklch() or a named color
- `tailwindVersion` (number): The project's Tailwind CSS major version. Defaults to 4

Output parameters:

- `className` (string): Color part of a utility class, e.g. "red-400" for bg-red-400
- `distance` (number): OKLab distance: 0 is identical, under 0.02 is hard to see
- `input` (object): The input color
- `name` (string): Tailwind color name, e.g. "red"
- `shade` (number): Closest shade, e.g. 500
- `tailwindValue` (object): Tailwind's value for that shade
- `tailwindVersion` (number)
- `visiblyDifferent` (boolean): True when the Tailwind shade looks different from the input

### `get_tailwind_palette` (~144 tokens)

Get Tailwind's default colors

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.

Input parameters:

- `name` (string, required): A default Tailwind color, like "blue", or one shade of it, like "blue-500"
- `tailwindVersion` (number): The project's Tailwind CSS major version. Defaults to 4

Output parameters:

- `name` (string): Tailwind color name, e.g. "blue"
- `shades` (array): All shades, or only the one asked for
- `tailwindVersion` (number)

### `list_tailwind_colors` (~93 tokens)

List Tailwind's default 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.

Input parameters:

- `tailwindVersion` (number): The project's Tailwind CSS major version. Defaults to 4

Output parameters:

- `colors` (array)
- `shades` (array): Shades every color has, e.g. 50 to 950
- `tailwindVersion` (number)

### `convert_color` (~119 tokens)

Convert a 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 instead.

Input parameters:

- `color` (string, required): Any CSS color: hex (#db4d53), rgb(), hsl(), oklch() or a named color

Output parameters:

- `hex` (string): e.g. #db4d53
- `oklch` (string): e.g. oklch(61.6% 0.177 21.62)
- `rgb` (string): e.g. rgb(219, 77, 83)

## Diagnostics

Captured diagnostic sections: Provenance, Dependencies. The full working is on the page: https://verifymcp.io/servers/bourhaouta-tailwindshades/tailwindshades-mcp#diagnostics

## Score history

- 2026-11-04: 95
- 2026-11-03: 95
- 2026-11-02: 95
- 2026-11-01: 95
- 2026-10-31: 95
- 2026-10-30: 95
- 2026-10-29: 94
- 2026-10-28: 94
- 2026-10-27: 94
- 2026-10-26: 93
- 2026-10-25: 93
- 2026-10-24: 92
- 2026-10-23: 92
- 2026-10-22: 91
- 2026-10-21: 91
- 2026-10-20: 90
- 2026-10-19: 90
- 2026-10-18: 89
- 2026-10-17: 89
- 2026-10-16: 88
- 2026-10-15: 88
- 2026-10-14: 87
- 2026-10-13: 49
- 2026-10-12: 49
- 2026-10-11: 49
- 2026-10-04: 83
- 2026-10-03: 83
- 2026-10-02: 67
- 2026-10-01: 54

## Common questions

### What is the Tailwind Shades MCP server?

Tailwind Shades is an MCP server listed in the public MCP registry as io.github.bourhaouta/tailwindshades. Tailwind CSS palettes (50-950) from any color, the closest Tailwind color, and Tailwind's defaults. This page covers its npm package (tailwindshades-mcp).

### Is the Tailwind Shades MCP server safe to use?

Tailwind Shades scores 95 out of 100 on VerifyMCP. We found no known CVEs affecting it as of 4 November 2026. It declares no install or post-install scripts. Its build provenance is signed and verified. That is a record of what we were able to check automatically, not an endorsement. The category breakdown on this page shows every signal behind the number, including the ones we could not confirm.

### What tools does the Tailwind Shades MCP server expose?

Tailwind Shades exposes 5 tools: generate_palette, find_closest_tailwind_color, get_tailwind_palette, list_tailwind_colors, convert_color. Their descriptions and schemas cost roughly 947 tokens of context every time the server is loaded.

### Is the Tailwind Shades MCP server still maintained?

Tailwind Shades is still listed as active in the MCP registry. We last reached this channel on 4 November 2026. Those dates come from our own scans of the registry and the channel itself, not from anything the publisher announced.

### What licence is the Tailwind Shades MCP server under?

Tailwind Shades declares the MIT licence, which is OSI-approved. That covers the source only, and says nothing about the cost of any service it calls.

## Links

- npm package: https://www.npmjs.com/package/tailwindshades-mcp
- Socket report: https://socket.dev/npm/package/tailwindshades-mcp
- Repository: https://github.com/bourhaouta/vscode-tailwindshades
- Website: https://tailwindshades.bourhaouta.com/
- Changelog RSS feed: https://verifymcp.io/servers/bourhaouta-tailwindshades/tailwindshades-mcp.xml
- Changelog JSON feed: https://verifymcp.io/servers/bourhaouta-tailwindshades/tailwindshades-mcp.json
- HTML version of this page: https://verifymcp.io/servers/bourhaouta-tailwindshades/tailwindshades-mcp