広告掲載
MCP.so
ログイン
T

Tokven MCP Server

@Mihkel00

リポジトリ

基本情報

カテゴリ

その他

トランスポート

stdio

作者

Mihkel00

投稿者

Mihkel00

Tokven MCP Server について

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

Tokven MCP Server の設定

以下の設定を使って、このサーバーを MCP 対応クライアントに追加してください。

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

Tokven MCP Server のツール

5

Generate a complete design token system from a brand hex color. Returns OKLCH-derived colors (light + dark mode), typography pairing, spacing scale, border radius, shadows, WCAG contrast validation, APCA scoring, design intent brief, and a visual preview URL on tokven.dev. Output in CSS, Tailwind v4, Tailwind v3, or DTCG JSON. Tip: call get_token_preview first to let the user approve the palette visually.

Quick preview of a design token system without full CSS output. Returns colors for light and/or dark mode, font pairing, radius, shadow style, WCAG contrast summary with near-failing pairs, design intent brief, and a visual preview URL on tokven.dev. Recommended first step: call this before generate_tokens so the user can approve the palette visually.

Check WCAG 2.1 contrast ratio and APCA (WCAG 3 candidate) contrast between two colors. Returns ratio, AA/AAA pass/fail for normal and large text, and APCA Lc value.

Returns all available mood presets for the generate_tokens tool, with descriptions of the visual personality each produces.

Lightweight single-purpose color derivation. Derive accessible background scales, text colors, brand color 4-token sets, status color variants, or light↔dark counterpart backgrounds. Returns raw tokens as JSON — no CSS wrapping. Use this when you need a quick answer like 'give me accessible grays for this background' or 'what text colors work on #0d0d0d?'

概要

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)

FAQ from Tokven Mcp

—

—

コメント

「その他」の他のコンテンツ

FastMCP v2 🚀

jlowin

🚀 The fast, Pythonic way to build MCP servers and clients.

26.0K

Activepieces

activepieces

AI Agents & MCPs & AI Workflow Automation • (~400 MCP servers for AI agents) • AI Automation / AI Agent with MCPs • AI Workflows & AI Agents • MCPs for AI Agents

23.2K

Reactive Resume

amruthpillai

A one-of-a-kind resume builder that keeps your privacy in mind. Completely secure, customizable, portable, open-source and free forever. Try it out today!

39.5K

DeepMark

DeepMark helps teachers deliver rapid, consistent marking with meaningful feedback for every student — in a fraction of the time. What once took a week, now takes one free period.

ICSS

chokcoco

不止于 CSS

20.7K
広告掲載