tesserai

design.tesserai由 tesserai.design 發布v0.2.2更新於 Oct 24, 2026

Your project's design system for coding agents: tokens, components, contrast checks, guidelines.

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

概覽

AI 產生的概覽

透過 stdio 向編碼代理提供專案的 tesserai 設計系統，包含權杖、元件、對比度檢查與設計規範。

可以做什麼
讀取設計系統的大綱、權杖、元件、對比度檢查與設計規範，供編碼代理在建構介面時參考。套用維持在設計系統範圍內的變更。設計系統本身透過 tesserai CLI 安裝與更新，該 CLI 也會為 Claude Code 和 Cursor 註冊此伺服器。
適用情境
適用於專案已採用 tesserai 設計系統，並希望編碼代理依其權杖、元件與規則建構介面，而非自行發明樣式的情況。
執行需求
透過 npx 從 @tesserai/cli npm 套件在本機執行，需要 Node.js 22 或更新版本。專案須使用 Tailwind CSS 4 及支援的框架（React 搭配 Base UI、Radix 或 React Aria；Vue 搭配 Reka UI；Svelte 5 搭配 Bits UI）。需先以 CLI 的 init 指令安裝設計系統。僅限桌面端。
安裝前請注意
代理可以套用對設計系統的變更，請檢查其修改。安裝或同步會將檔案寫入專案，並把 CLI 加入為開發相依套件。僅當設計系統私密保存在帳戶中時才需要登入；scan 的上傳選項標示為 Pro。

安裝

在 SourceWeft 中

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

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

其他 MCP 客戶端

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

README

@tesserai/cli

Install a tesserai design system into your project as components you own. Keep it current from your terminal. Give your coding agent the same tokens, components and rules through MCP.

Needs Node.js 22 or newer and Tailwind CSS 4. React works with Base UI, Radix or React Aria, Vue with Reka UI, and Svelte 5 with Bits UI.

Start

Design a system at tesserai.design and download it; that needs no account. Or share it from your account, and install it by its link, which sync then follows:

sh
npx @tesserai/cli init ./acme.tesserai.jsonnpx @tesserai/cli init https://tesserai.design/s/AbCdEf123456 --dir ./apps/web

init writes the components, the theme CSS and tesserai/design-system.json into your project. It adds the CLI as a dev dependency. It also registers the MCP server for Claude Code in .mcp.json, and for Cursor in .cursor/mcp.json when the project uses Cursor.

Commands

CommandWhat it does
init <link or bundle>Install a system into the project
sync [link or bundle]Pull the latest version and regenerate. Files you changed are kept, with the new version written beside them. --dry-run shows the plan
scanHow the app uses its system: each component's uses and options (most used first), components and options never used, overrides (className, style, sx restyling a component, by what they change), the same override repeated (a change to make in the system), generated files edited by hand, an adoption score, and values that bypass the system. --fix replaces exact matches; --upload keeps the scan with its system in the builder (Pro)
doctorCheck the project, the system, the manifest and the source link
export <format>The system for another stack: scss, ts, panda, stylex, mui, mantine, chakra, swift, kotlin, dart
storybookA Storybook with a story per component, light and dark, and accessibility checks
mcpServe the system to coding agents over stdio
login / logoutSign in for systems kept privately in an account

Run npx @tesserai/cli <command> --help for the options.

For coding agents

init registers the server for you. To add it by hand:

sh
claude mcp add tesserai -- npx -y @tesserai/cli mcp

The agent can then read the system's outline, tokens, components, contrast checks and design guidelines. It can also apply changes that stay inside the system.

License

MIT. The components and CSS the CLI writes into your project are yours to use however you like.

來源：packages/cli/README.md，提交 bcec877

工具

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

版本歷史

2
  1. v0.2.2最新Sep 27, 2026
  2. v0.2.1Sep 27, 2026

評分

已滿足適用檢查項的 50%

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

  • 近 30 天內可連通25 分

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

  • 已宣告認證方式10 分

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

  • 已列出工具15 分

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

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