tesserai

design.tesseraiPublished by tesserai.designv0.2.2Updated Oct 24, 2026

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

VerifiedSTDIODesktop onlyDeveloper ToolsMedia & Design

Overview

AI-generated overview

Serves a project's tesserai design system to coding agents over stdio, exposing tokens, components, contrast checks and guidelines.

What you can do
Read the design system's outline, tokens, components, contrast checks and design guidelines for a coding agent to consult while building UI. Apply changes that stay inside the design system. The system itself is installed and kept current with the tesserai CLI, which also registers this server for Claude Code and Cursor.
When to use it
Useful when a project already has a tesserai design system and you want a coding agent to build UI that follows its tokens, components and rules instead of inventing styles.
Requirements
Runs locally via npx from the @tesserai/cli npm package, so Node.js 22 or newer is needed. The project must use Tailwind CSS 4 and a supported framework (React with Base UI, Radix or React Aria; Vue with Reka UI; Svelte 5 with Bits UI). A design system must first be installed with the CLI's init command. Desktop only.
Before you install
The agent can apply changes to the design system, so review edits it makes. Installing or syncing writes files into the project and adds the CLI as a dev dependency. Signing in is only needed for systems kept privately in an account; the scan upload option is marked Pro.

Installation

In SourceWeft

  1. Open tesserai in the dashboard and add it to a workspace.
  2. Enable the server for the chats that should use its tools.

Desktop only via STDIO. STDIO servers start a local process, so they need the SourceWeft desktop host.

Other MCP clients

Follow the launch instructions in the repository.

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.

Source: packages/cli/README.md at commit bcec877

Tools

0
SourceWeft has not started this package in its sandbox yet, so its tools are not known.

Version history

2
  1. v0.2.2LatestSep 27, 2026
  2. v0.2.1Sep 27, 2026

Score

50% of the applicable checks met

How complete this listing is, computed from the registry entry, the endpoint and public sources. Not a rating of the server and not a statement that it is safe or working today: reachability is a dated check, and no installs or reviews go into the score.

  • Reached in the last 30 days25 pts

    Keep the endpoint answering the MCP handshake; SourceWeft probes it every 30 days.

  • Auth declared10 pts

    Declare the credential headers in the registry entry, or keep the endpoint answering the probe so its auth can be classified.

  • Tools listed15 pts

    Answer tools/list without a credential, or ship a package that starts in a sandbox without one.

  • DescriptionRequired15 pts
  • Logo10 pts
  • Documentation15 pts
  • License10 pts