BridgeComfortable

Previews use

Applies to every design system preview on the site. The Bridge app chrome stays the same.

Brand

Density

Your design system, one source of truth.

This Library shows the latest release, v0.1.0, rebuilt from the repository on every merge. What you read here is what ships. To change something, open it in the Studio: every change goes through a draft, a review and a merge.

Free and open source, by Florian Gouloubi. 535 tokens, 46 components, 2 brands, 2 themes and 2 densities.

What's new

All release notes
  1. New

    bridge audit counts every visible UI instance: router links outside a DS component's `render` prop (react-router, ra-core `LinkBase`, next/link), anchors with `href`, images and chart libraries (recharts, Nivo, Chart.js..., foreign with no DS equivalent). Providers and other non-visual parts no longer count as DS instances.

    Oct 16, 2026 Next release

  2. New

    Packages are publishable under the `@bridge-ds` npm scope (renamed from `@demo-ds` and `@bridge`). Each ships built ES modules, type declarations and, for React, one `styles.css`; the monorepo keeps resolving TypeScript sources through the `source` export condition. `@bridge-ds/core` adds branch preview helpers (`previewUrl`, `snapshotUrl`, `previewComment`) and a `previews` section in `bridge.config.json`. `@bridge-ds/react` adds an opt-in staging token override: `ThemeProvider` `tokenOverride` loads an allowlisted `tokens.css` from `?bridge-tokens=`, off by default and refused in production builds unless enabled.

    Oct 16, 2026 Next release

  3. New

    Measure design system adoption in product code. `@bridge-ds/core/audit` finds hardcoded colors, lengths, radii, shadows, durations, z-index and fonts in CSS, SCSS, style/sx/styled/theme objects, CSS-in-JS and Tailwind classes, suggests the closest token (deltaE in OKLab across every mode, nearest scale step), and counts DS components against foreign UI libraries, native elements and re-created components. `bridge audit <path>` reports token and component adoption as JSON (versioned schema) and Markdown, compares with a baseline, fails CI under a threshold, and `--fix --write` replaces exact CSS matches with `var(--token)`. The MCP server adds `bridge_audit` and the `migrate-file-to-ds` prompt. New `@bridge-ds/stylelint-plugin` (`bridge/use-tokens`) and `@bridge-ds/eslint-plugin` (`no-hardcoded-style-values`, `prefer-ds-components`).

    Oct 16, 2026 Next release

  4. New

    One `bridge.config.json` and one schema (`packages/core/bridge.config.schema.json`) for the Figma plugin, the docs site, the CLI and the MCP server: tiers, ordered layers with mode placeholders, modes with parity, contrast, components, docs, changesets and governance (protected branches, branch prefix, labels, guardrails, design and tech owners). The MCP server now runs on `@bridge-ds/core` (layered token sets, minimal-diff edits, contrast, diff, PR body, GitHub client, local git writer) and every surface shares one risk classifier: a token added, changed, renamed or removed is Tier 3 (renames and removals major), a description-only edit is Tier 1 patch.

    Oct 16, 2026 Next release

  5. New

    History and rollback. `bridge_get_history` and `bridge_get_token_history` read what changed in the tokens (versions, merged PRs and commits, who, when, why, tier, breaking), and `bridge_plan_revert` and `bridge_propose_revert` undo a change against the current base branch, with conflicts shown when a token changed again later, or restore one token to an older value. The CLI adds `bridge history [token]` and `bridge revert <pr|commit> [--dry-run]`. Built on the new history model and revert planner in `@bridge-ds/core`.

    Oct 16, 2026 Next release

  6. New

    Bridge MCP server and CLI. `@bridge-ds/mcp` connects Claude Code, Claude Desktop or any MCP client to a DTCG design system repo (local folder or GitHub): 15 tools to read tokens per mode, search, validate, check contrast, read components and docs, propose token changes as branches or draft PRs (never on main), review PRs and scaffold components, plus resources and prompts. `@bridge-ds/cli` adds `bridge init`, `check`, `tokens`, `diff`, `propose` and `mcp`.

    Oct 16, 2026 Next release

In the Library

Where to start

  • Designers

    Color roles, type and spacing, with every value shown in both themes. Pull the same tokens into Figma with the plugin.

    Start with color
  • Engineers

    Install the packages, then build with components that read CSS variables only. Props come straight from the TypeScript.

    Install
  • AI agents

    The same docs as plain text in llms.txt, and an MCP server so your Claude builds with real tokens and proposes changes by pull request.

    Connect an agent

Want to change a token or a component? Every page here has an Edit in Studio action that opens it in a draft. Designers can also propose from Figma with the DS Bridge plugin.