Ensemble

dev.hearthbyte由 hearthbyte.dev 發布v1.0.0更新於 Nov 1, 2026

AI-ready design toolkit: color palettes, typography, spacing, shadows and accessibility audits.

發布方自己的服務:ENSEMBLE

已驗證STDIO僅桌面開發者工具媒體與設計

概覽

AI 產生的概覽

本機 MCP 伺服器,讓助理產生配色、字體、間距、陰影、格線、動態與深色主題等設計系統,並匯出設計權杖。

可以做什麼
  • 產生配色方案、字體搭配與字級階層、間距系統、層級陰影、響應式格線與動態預設
  • 從淺色配色系統推導深色主題
  • 依 WCAG 檢查配色對比度,並驗證單組前景/背景色的無障礙性
  • 將整套系統匯出為 CSS、JSON、Tailwind 或 SCSS
  • 各工具共用同一品牌色與偏好參數,確保產出彼此一致
適用情境
適合希望助理從一個品牌色出發產出成套設計權杖或主題,或在調整介面樣式時檢查顏色對比度的情境。若只需單次對比度檢查,免費工具即可。
執行需求
透過 npm 套件 @hearthbyte/ensemble-mcp 以 stdio 在本機執行(npx 或全域安裝),需要 Node.js。建構類工具會呼叫 Ensemble API,需設定 ENSEMBLE_API_KEY 環境變數;未設定時僅免費的 a11y_validate 可用。僅支援桌面用戶端。
安裝前請注意
建構類工具會把品牌色與偏好傳送到 Ensemble API,資料會離開本機。Pro 金鑰為付費訂閱(月繳或年繳),以 ENSEMBLE_API_KEY 環境變數保存。README 中兩張工具表列出的工具名稱略有出入,安裝後請確認用戶端實際提供的工具。

安裝

在 SourceWeft 中

  1. 開啟 儀表板中的 Ensemble,將其新增到工作區。
  2. 為需要使用其工具的對話啟用該服務。

Desktop only,透過 STDIO。 STDIO 服務會啟動本機處理程序,因此需要 SourceWeft 桌面主機。

其他 MCP 客戶端

參照 儲存庫 中的啟動說明。

README

[Ensemble - AI-Ready Design Toolkit]

🎨 Ensemble MCP

Give your AI agent design taste.

[npm version] [License: MIT]

Website · Documentation · Get API Key


What is this?

Ensemble MCP is a Model Context Protocol server that gives AI agents access to professional design tools. Generate color palettes, pair typography, create shadow systems, and export complete design tokens - all through natural conversation.

10 tools. One API. Infinite possibilities.

ToolWhat it doesIts main argument
harmony_generate_paletteA full color system from one brand colorcolor_scheme
duet_pair_fontsHeading, body and mono fonts with a type scaletype_style
tempo_generate_scaleA spacing system tuned to the typedensity
chord_generate_shadowsElevation shadows tinted by the paletteshadow_intensity
cadence_generate_gridResponsive grid: breakpoints, columns, guttersdensity
riff_generate_motionDurations, easing curves and transition presetsanimation_style
bridge_generate_themeA complete dark mode from the light systemcolor
pitch_audit_contrastWhich palette pairs pass WCAG, and what to fixcolor
compose_exportThe whole system as CSS, JSON, Tailwind or SCSSformats
a11y_validateCheck one color pair for accessibility (FREE, no key needed)foreground, background

Every builder takes a brand color and an optional preferences object, so tools called separately agree with each other. Results are deterministic: the same color and preferences always give the same system.

------|--------------| | harmony_generate_palette | Generate harmonious color palettes from a single color | | duet_pair_fonts | Pair heading and body fonts that complement each other | | tempo_generate_scale | Create type scales and spacing systems | | chord_generate_shadows | Generate 5-level shadow elevation systems | | bridge_generate_theme | Auto-generate dark mode from light theme colors | | cadence_set_grid | Configure CSS Grid layouts with presets | | pitch_create_gradient | Create linear, radial, and conic gradients | | riff_set_easing | Set cubic-bezier easing curves | | compose_export | Export complete design system (CSS, Tailwind, SCSS, JSON) | | a11y_validate | Check color contrast accessibility (FREE, no key needed) |


Quick Start

Claude Desktop

Add to your claude_desktop_config.json:

json
{  "mcpServers": {    "ensemble": {      "command": "npx",      "args": ["-y", "@hearthbyte/ensemble-mcp"],      "env": {        "ENSEMBLE_API_KEY": "your-api-key-here"      }    }  }}

Cursor / Cline

json
{  "ensemble": {    "command": "npx",    "args": ["-y", "@hearthbyte/ensemble-mcp"],    "env": {      "ENSEMBLE_API_KEY": "your-api-key-here"    }  }}

Manual Installation

bash
npm install -g @hearthbyte/ensemble-mcpensemble-mcp

Example Prompts

Once installed, try these with your AI:

"Generate a triadic color palette from #6366F1"

"Give me a classical font pairing and an airy spacing system to go with it"

"Check if #FFFFFF text on #6366F1 background is accessible"

"Build a design system from #0F766E with dramatic shadows and export it as Tailwind config"

"Audit the contrast of the palette you just made and tell me what fails"


API Key

The builders call the Ensemble API, which needs a Pro key ($4.99/month, or $39/year).

Free tool: a11y_validate - accessibility validation with no API key required.

Get your API key →


Design Philosophy

Ensemble tools are built on these principles:

  1. One color in, design system out - Start with a single value, get a complete system
  2. Cross-tool sync - Colors flow to typography, typography informs spacing
  3. Export everywhere - CSS, Tailwind, SCSS, JSON
  4. Accessibility first - WCAG 2.1 + APCA checking built in

Links


Built with 🧡 by HearthByte

Your work. Your choice. Always.

來源:README.md,提交 18ed30b

工具

0
SourceWeft 尚未在沙箱中啟動過該軟體包,因此其工具未知。

版本歷史

1
  1. v1.0.0最新Oct 10, 2026

評分

已滿足適用檢查項的 50%

該評分衡量此收錄條目的完整程度,依據註冊中心條目、端點與公開來源計算得出。它不是對伺服器本身的評價,也不表示伺服器安全或目前可用:可連通性是帶日期的檢查結果,評分也不包含安裝量或使用者評價。

  • 近 30 天內可連通25 分

    請保持端點能夠回應 MCP 握手;SourceWeft 每 30 天探測一次。

  • 已宣告認證方式10 分

    請在註冊中心條目中宣告憑證請求標頭,或保持端點能夠回應探測,以便判定其認證方式。

  • 已列出工具15 分

    請讓伺服器在無憑證時回應 tools/list,或發布可在沙箱中無憑證啟動的軟體包。

  • 描述必需15 分
  • 圖示10 分
  • 文件15 分
  • 授權條款10 分

其他 Ensemble 整合