Tokven Mcp

Name: Tokven Mcp
Author: Mihkel00

@Mihkel00

关于 Tokven Mcp

Generate complete design token systems from a hex color — OKLCH-derived, WCAG-validated, multi-format

#design-tokens #design-system #css-variables #tailwind #shadcn #oklch #wcag #color #typography #cursor #claude #windsurf #brand

基本信息

分类

其他

传输方式

stdio

发布者

Mihkel00

提交者

Mihkel00

配置

使用下面的配置,将此服务器添加到你的 MCP 客户端。

{
  "mcpServers": {
    "tokven": {
      "command": "npx",
      "args": [
        "-y",
        "tokven-mcp"
      ]
    }
  }
}

工具

未检测到工具

工具是从 README 中自动提取的。维护者可以在 ## Tools 标题下列出工具,即可填充这部分内容。

概览

What is Tokven Mcp?

Tokven Mcp is a design token generator that creates a complete design system from a single brand hex color. It outputs OKLCH-derived colors for light and dark modes, typography pairings, spacing scales, border radii, shadows, and WCAG contrast validation. It is for developers and designers who need a quick, color-based token system.

How to use Tokven Mcp?

The server exposes four tools: generate_tokens (generate full token set from a hex color), get_token_preview (preview tokens without full CSS output), validate_contrast (check WCAG 2.1 contrast ratio between two colors), and list_moods (list available mood presets). No installation or configuration commands are specified in the README.

Key features of Tokven Mcp

Generates design tokens from a single brand hex color
Returns OKLCH-derived colors with light and dark modes
Includes typography pairing, spacing, border radius, shadows
Validates colors for WCAG 2.1 contrast compliance
Supports output in CSS Custom Properties, Tailwind v4/v3, and W3C DTCG JSON
Offers 13 mood presets: warm, cool, bold, dark, soft, minimal, brutalist, playful, vintage, luxury, nature, neon, corporate

Use cases of Tokven Mcp

Quickly generate a full design token system from a brand color
Validate color contrast for accessibility during design
Preview token outputs before generating CSS
Apply mood presets to change the aesthetic of the token set
Output tokens in multiple formats for different frameworks (Tailwind, CSS, JSON)