Buoy

Design tokens and drift checks for coding agents: use the token, not the hardcoded value.

Quick Install

Automated & IDE Setup

Copy the AI prompt to install this server into Claude Code, Cursor, or another agent — or use 1-click editor setup below.

One-click editor setup isn’t available for this listing yet — we don’t have a confirmed install command, and we’d rather show nothing than point your editor at the wrong package or host. Follow the project’s own setup instructions, linked above.

Manual Client & Custom JSON ConfigExpand JSON ▾

No confirmed setup config for this listing yet. We only publish a config block when the install details come from the project itself — its README, its docs, or a verified owner. We haven’t found those for buoy, and we’d rather show nothing than a guess you’d paste into your client. Follow the project’s own setup instructions for the current steps.

Documentation Overview

Buoy

Catch design drift before it ships.

AI coding tools are fast—but they don't know your design system. They'll write #3b82f6 when you have --color-primary. They'll use padding: 17px when your spacing scale is multiples of 4.

Buoy watches for these issues and helps you fix them.

Code

src/components/Button.tsx:24
  hardcoded-value: #3b82f6 → var(--color-primary) (92% match)

Code-first System Observability

Your shipped code is the design-system source of truth. Declare the packages you own, then use Buoy to map adoption, unmanaged UI surface area, and the blast radius of a component or token change. Figma and other design tools can remain optional inputs; they are not required for the system map.

yaml

# .buoy.yaml
project:
  name: acme

system:
  components:
    - packages/ui/src/**
  tokens:
    - packages/tokens/src/**
  owners:
    - name: Checkout
      paths:
        - apps/checkout/**

bash

buoy system map                 # Canonical system vs unmanaged surface area
buoy system impact Button       # Consumers and migration risk for a change
buoy system impact color-primary --kind token

This is the foundation for cloud adoption trends, deprecation planning, and AI-assisted iteration reporting: every result is derived from code and can be attributed to a repository path and owner.

Quick Start

bash

# See your design system immediately (zero config)
npx ahoybuoy show all

# Add project configuration and local integrations when ready
npx ahoybuoy dock

No config needed. Buoy auto-detects your framework and starts working immediately.

What It Catches

Issue	Example
Hardcoded colors	`#ff0000` instead of `var(--color-primary)`
Arbitrary spacing	`padding: 17px` instead of design scale
Tailwind escape hatches	`p-[13px]` instead of `p-4`
Naming inconsistencies	`ButtonNew`, `ButtonV2`, `ButtonOld`
Unused components	Defined but never imported or rendered
Semantic mismatches	Same prop typed `string` in one, `number` in another
Repeated patterns	Same Tailwind classes copy-pasted 5+ times
Framework sprawl	React + Vue + jQuery in same codebase
Detached components	Instances without main component

Commands

server.ts

buoy
├── show                    # Read design system info (for AI agents)
│   ├── components          # Components in codebase
│   ├── tokens              # Design tokens found
│   ├── drift               # Design system violations
│   ├── health              # Health score
│   ├── history             # Scan history
│   ├── config              # Current .buoy.yaml configuration
│   ├── skills              # AI agent skill files
│   ├── agents              # Configured AI agents
│   ├── context             # Design system context in CLAUDE.md
│   ├── hooks               # Configured hooks
│   ├── commands            # Installed slash commands
│   ├── graph               # Knowledge graph stats
│   ├── plugins             # Available scanners
│   └── all                 # Everything combined
├── drift                   # Drift detection and fixing
│   ├── scan                # Scan codebase for components/tokens
│   ├── check               # Pre-commit drift check
│   ├── fix                 # Suggest/apply fixes
│   └── ignore              # Ignore existing drift
│       ├── all             # Ignore all current drift (requires --reason)
│       ├── show            # View ignored drift signals
│       ├── add             # Add new drift to ignore list (requires --reason)
│       └── clear           # Remove ignore list
├── rescue                  # Complete measure → repair → guard → prove journey
│   ├── plan                # Build a local baseline and repair plan
│   ├── apply               # Apply reviewed safe fixes on a new branch
│   ├── verify              # Run detected typecheck/test scripts
│   ├── guard               # Record reviewed legacy drift with reasons
│   ├── report              # Generate JSON, Markdown, and HTML evidence
│   └── rollback            # Restore local pre-Rescue backups
├── dock                    # Dock tools into your project
│   ├── config              # Create .buoy.yaml
│   ├── skills              # Create AI agent skills
│   ├── agents              # Set up AI agents
│   ├── context             # Generate CLAUDE.md context
│   ├── hooks               # Set up hooks (--claude for self-validating AI)
│   ├── commands            # Install Claude slash commands
│   ├── plugins             # Show available scanners
│   ├── tokens              # Generate/export design tokens
│   │   ├── compare         # Compare token sources
│   │   └── import          # Import tokens from Figma/CSS
│   └── graph               # Build design system knowledge graph
│       └── learn           # Learn patterns from codebase
└── ahoy                    # Cloud features
    ├── login               # Authenticate
    ├── logout              # Sign out
    ├── status              # Account + bot + sync status
    ├── github              # Set up GitHub PR bot
    ├── gitlab              # Set up GitLab PR bot (soon)
    ├── billing             # Manage subscription
    └── plans               # Compare pricing

For AI Agents

Coding agents hardcode values because they never read your token file. Give them Buoy as an MCP server:

Terminal

npx @buoy-design/cli mcp install claude   # or cursor, codex, windsurf, all

Claude Code (and any MCP client) gets four tools: list_design_tokens, find_token_for_value (#1a73e8 → --color-primary), check_design_drift (line-level, with the token to use instead) and design_system_context. Claude Code also gets a PostToolUse hook that checks every style file it edits and hands the fixes back before it moves on. See docs/integrations/mcp.

In Claude Code, the plugin bundles all of it: /plugin marketplace add ahoybuoy/buoy, then /plugin install buoy@buoy.

To review every pull request as well, install the free GitHub App; no Buoy account is needed.

The show command outputs JSON for AI agents to consume:

bash

# Get everything an AI agent needs
buoy show all --json

# Just drift signals
buoy show drift --json

# Components inventory
buoy show components --json

Example output:

config.json

{
  "components": [...],
  "tokens": [...],
  "drift": {
    "signals": [...],
    "summary": { "total": 12, "critical": 2, "warning": 7, "info": 3 }
  },
  "health": { "score": 78 }
}

Getting Started

Complete a Rescue journey

bash

buoy rescue plan
# Review .buoy/rescue/runs/<run-id>/report.html
buoy rescue apply --run <run-id> --approve
buoy rescue guard --run <run-id> --reason "Reviewed legacy baseline" --actor "Design systems team"
buoy rescue report --run <run-id>

Rescue keeps ambiguous findings review-only, runs detected project checks after applying high-confidence changes, and retains local backups for rollback. It does not commit, push, open a pull request, or upload source code. See docs/rescue.md for the complete workflow.

Configure Your Project

bash

buoy dock

Smart walkthrough that sets up:

.buoy.yaml — Project configuration
AI agent skills — For Claude Code, Copilot, etc.
CLAUDE.md context — Design system documentation
Git hooks — Pre-commit drift checking

Configure severities per drift type

yaml

# .buoy.yaml
project:
  name: my-app

drift:
  severity:
    hardcoded-value: critical
    naming-inconsistency: warning

  # Ignore specific drift (filter by type, file, component, token, value, severity)
  ignore:
    - type: hardcoded-value
      file: "src/legacy/**"
    - severity: info

  # Promote matching drift to a higher severity
  promote:
    - type: hardcoded-value
      file: "src/components/**"
      to: critical
      reason: "Design system components must use tokens"

  # Enforce — always treat matching drift as critical
  enforce:
    - type: naming-inconsistency
      component: "^Button"
      reason: "Button naming is standardized"

health:
  # CI gate — exit code 1 if health score falls below threshold
  failBelow: 70

Drift Detection

Quick Check

bash

buoy drift check

Fast pre-commit hook friendly. Exits with error code if drift found.

Detailed Analysis

bash

buoy show drift

config.json

{
  "drifts": [
    {
      "type": "hardcoded-value",
      "severity": "warning",
      "file": "src/components/Button.tsx",
      "line": 24,
      "message": "#3b82f6 should use var(--color-primary)",
      "suggestion": "var(--color-primary)"
    }
  ]
}

Fix Issues

bash

buoy drift fix                    # Interactive fix suggestions
buoy drift fix --dry-run          # Preview changes
buoy drift fix --apply            # Apply reviewed high-confidence fixes

Ignore Existing Drift

For brownfield projects, ignore existing issues and only flag new ones:

bash

buoy drift ignore all -r "Legacy code before design system"     # Ignore all current drift with reason
buoy drift ignore add -r "Third-party components"               # Add new drift to ignore list
buoy drift ignore show                                          # View ignored drift with reasons
buoy drift check                                                # Only fails on new drift

A reason is required when ignoring drift to maintain accountability.

CI Integration

Read the full README →View source on GitHub →

Related MCP Servers

View all in Finance & Fintech View all alternatives

Reviews

No reviews yet — be the first to share how this listing worked for you.

Frequently Asked Questions about Buoy

We don't have a confirmed install command for buoy yet, so we don't publish a generated one — a guessed package name would point at the wrong package or none at all. Follow the project's own README or setup instructions (https://github.com/ahoybuoy/buoy) for the current steps.

AllMCPs Directory Badge

Full Badge Customizer

Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.

Badge Style:

Live Dynamic SVG Preview

Markdown (GitHub README)

[![AllMCPs](https://allmcps.com/api/badge/buoy?style=directory)](https://allmcps.com/mcp/buoy)

HTML Embed

<a href="https://allmcps.com/mcp/buoy"><img src="https://allmcps.com/api/badge/buoy?style=directory" alt="Buoy on AllMCPs" /></a>

Technical Specs & Signals

CategoryFinance & Fintech

27Quality signal: Emerging · 27/100How this signal is calculated ▾

Server availabilityNot measured

Not scored for repo-hosted servers — we can't reach the running server, only its GitHub page. Hosted MCP endpoints are health-checked live.

Verified ownership8/20

Documentation & tools11/30

Adoption & activity1/15

Community engagement0/10

A guidance signal from public completeness & health data — not a user rating. New listings start lower and rise as they add docs, get verified, and grow adoption. Signals we can't observe for a listing are skipped, not counted against it.

★ Spotlight Slot

Feature Your MCP Server

Get maximum visibility for your server across our directory, search results, and detail pages.

Spotlight Your Server

Own this project?

This directory is pre-filled from public sources. Claim via GitHub README, site badge, or DNS TXT to unlock edit access and the Official badge and attach your website — proof is checked automatically, then reviewed by our team.

Free dofollow backlink: add your website and place the AllMCPs badge on it — no claim needed. We detect it automatically and keep it verified as long as the badge stays live.

Claim & get free dofollow

Share & Embed

Add our SVG badge (dark/light directory styles) or embeddable widget to your site.

Explore more

More in 💰 Finance & Fintech →Best MCP servers for Finance & Fintech →Alternatives to Buoy →Install in Claude Desktop Install in Cursor Install in VS Code Setup guides for all 13 MCP clients

Buoy

Design tokens and drift checks for coding agents: use the token, not the hardcoded value.

Quick Install

Automated & IDE Setup

Copy the AI prompt to install this server into Claude Code, Cursor, or another agent — or use 1-click editor setup below.

Manual Client & Custom JSON ConfigExpand JSON ▾

Documentation Overview

Buoy

Catch design drift before it ships.

AI coding tools are fast—but they don't know your design system. They'll write #3b82f6 when you have --color-primary. They'll use padding: 17px when your spacing scale is multiples of 4.

Buoy watches for these issues and helps you fix them.

Code

src/components/Button.tsx:24
  hardcoded-value: #3b82f6 → var(--color-primary) (92% match)

Code-first System Observability

yaml

# .buoy.yaml
project:
  name: acme

system:
  components:
    - packages/ui/src/**
  tokens:
    - packages/tokens/src/**
  owners:
    - name: Checkout
      paths:
        - apps/checkout/**

bash

buoy system map                 # Canonical system vs unmanaged surface area
buoy system impact Button       # Consumers and migration risk for a change
buoy system impact color-primary --kind token

This is the foundation for cloud adoption trends, deprecation planning, and AI-assisted iteration reporting: every result is derived from code and can be attributed to a repository path and owner.

Quick Start

bash

# See your design system immediately (zero config)
npx ahoybuoy show all

# Add project configuration and local integrations when ready
npx ahoybuoy dock

No config needed. Buoy auto-detects your framework and starts working immediately.

What It Catches

Issue	Example
Hardcoded colors	`#ff0000` instead of `var(--color-primary)`
Arbitrary spacing	`padding: 17px` instead of design scale
Tailwind escape hatches	`p-[13px]` instead of `p-4`
Naming inconsistencies	`ButtonNew`, `ButtonV2`, `ButtonOld`
Unused components	Defined but never imported or rendered
Semantic mismatches	Same prop typed `string` in one, `number` in another
Repeated patterns	Same Tailwind classes copy-pasted 5+ times
Framework sprawl	React + Vue + jQuery in same codebase
Detached components	Instances without main component

Commands

server.ts

buoy
├── show                    # Read design system info (for AI agents)
│   ├── components          # Components in codebase
│   ├── tokens              # Design tokens found
│   ├── drift               # Design system violations
│   ├── health              # Health score
│   ├── history             # Scan history
│   ├── config              # Current .buoy.yaml configuration
│   ├── skills              # AI agent skill files
│   ├── agents              # Configured AI agents
│   ├── context             # Design system context in CLAUDE.md
│   ├── hooks               # Configured hooks
│   ├── commands            # Installed slash commands
│   ├── graph               # Knowledge graph stats
│   ├── plugins             # Available scanners
│   └── all                 # Everything combined
├── drift                   # Drift detection and fixing
│   ├── scan                # Scan codebase for components/tokens
│   ├── check               # Pre-commit drift check
│   ├── fix                 # Suggest/apply fixes
│   └── ignore              # Ignore existing drift
│       ├── all             # Ignore all current drift (requires --reason)
│       ├── show            # View ignored drift signals
│       ├── add             # Add new drift to ignore list (requires --reason)
│       └── clear           # Remove ignore list
├── rescue                  # Complete measure → repair → guard → prove journey
│   ├── plan                # Build a local baseline and repair plan
│   ├── apply               # Apply reviewed safe fixes on a new branch
│   ├── verify              # Run detected typecheck/test scripts
│   ├── guard               # Record reviewed legacy drift with reasons
│   ├── report              # Generate JSON, Markdown, and HTML evidence
│   └── rollback            # Restore local pre-Rescue backups
├── dock                    # Dock tools into your project
│   ├── config              # Create .buoy.yaml
│   ├── skills              # Create AI agent skills
│   ├── agents              # Set up AI agents
│   ├── context             # Generate CLAUDE.md context
│   ├── hooks               # Set up hooks (--claude for self-validating AI)
│   ├── commands            # Install Claude slash commands
│   ├── plugins             # Show available scanners
│   ├── tokens              # Generate/export design tokens
│   │   ├── compare         # Compare token sources
│   │   └── import          # Import tokens from Figma/CSS
│   └── graph               # Build design system knowledge graph
│       └── learn           # Learn patterns from codebase
└── ahoy                    # Cloud features
    ├── login               # Authenticate
    ├── logout              # Sign out
    ├── status              # Account + bot + sync status
    ├── github              # Set up GitHub PR bot
    ├── gitlab              # Set up GitLab PR bot (soon)
    ├── billing             # Manage subscription
    └── plans               # Compare pricing

For AI Agents

Coding agents hardcode values because they never read your token file. Give them Buoy as an MCP server:

Terminal

npx @buoy-design/cli mcp install claude   # or cursor, codex, windsurf, all

In Claude Code, the plugin bundles all of it: /plugin marketplace add ahoybuoy/buoy, then /plugin install buoy@buoy.

To review every pull request as well, install the free GitHub App; no Buoy account is needed.

The show command outputs JSON for AI agents to consume:

bash

# Get everything an AI agent needs
buoy show all --json

# Just drift signals
buoy show drift --json

# Components inventory
buoy show components --json

Example output:

config.json

{
  "components": [...],
  "tokens": [...],
  "drift": {
    "signals": [...],
    "summary": { "total": 12, "critical": 2, "warning": 7, "info": 3 }
  },
  "health": { "score": 78 }
}

Getting Started

Complete a Rescue journey

bash

buoy rescue plan
# Review .buoy/rescue/runs/<run-id>/report.html
buoy rescue apply --run <run-id> --approve
buoy rescue guard --run <run-id> --reason "Reviewed legacy baseline" --actor "Design systems team"
buoy rescue report --run <run-id>

Configure Your Project

bash

buoy dock

Smart walkthrough that sets up:

.buoy.yaml — Project configuration
AI agent skills — For Claude Code, Copilot, etc.
CLAUDE.md context — Design system documentation
Git hooks — Pre-commit drift checking

Configure severities per drift type

yaml

# .buoy.yaml
project:
  name: my-app

drift:
  severity:
    hardcoded-value: critical
    naming-inconsistency: warning

  # Ignore specific drift (filter by type, file, component, token, value, severity)
  ignore:
    - type: hardcoded-value
      file: "src/legacy/**"
    - severity: info

  # Promote matching drift to a higher severity
  promote:
    - type: hardcoded-value
      file: "src/components/**"
      to: critical
      reason: "Design system components must use tokens"

  # Enforce — always treat matching drift as critical
  enforce:
    - type: naming-inconsistency
      component: "^Button"
      reason: "Button naming is standardized"

health:
  # CI gate — exit code 1 if health score falls below threshold
  failBelow: 70

Drift Detection

Quick Check

bash

buoy drift check

Fast pre-commit hook friendly. Exits with error code if drift found.

Detailed Analysis

bash

buoy show drift

config.json

{
  "drifts": [
    {
      "type": "hardcoded-value",
      "severity": "warning",
      "file": "src/components/Button.tsx",
      "line": 24,
      "message": "#3b82f6 should use var(--color-primary)",
      "suggestion": "var(--color-primary)"
    }
  ]
}

Fix Issues

bash

buoy drift fix                    # Interactive fix suggestions
buoy drift fix --dry-run          # Preview changes
buoy drift fix --apply            # Apply reviewed high-confidence fixes

Ignore Existing Drift

For brownfield projects, ignore existing issues and only flag new ones:

bash

buoy drift ignore all -r "Legacy code before design system"     # Ignore all current drift with reason
buoy drift ignore add -r "Third-party components"               # Add new drift to ignore list
buoy drift ignore show                                          # View ignored drift with reasons
buoy drift check                                                # Only fails on new drift

A reason is required when ignoring drift to maintain accountability.

CI Integration

Read the full README →View source on GitHub →

Related MCP Servers

View all in Finance & Fintech View all alternatives

Reviews

No reviews yet — be the first to share how this listing worked for you.

Frequently Asked Questions about Buoy

AllMCPs Directory Badge

Full Badge Customizer

Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.

Badge Style:

Live Dynamic SVG Preview

Markdown (GitHub README)

[![AllMCPs](https://allmcps.com/api/badge/buoy?style=directory)](https://allmcps.com/mcp/buoy)

HTML Embed

<a href="https://allmcps.com/mcp/buoy"><img src="https://allmcps.com/api/badge/buoy?style=directory" alt="Buoy on AllMCPs" /></a>

Technical Specs & Signals

CategoryFinance & Fintech

27Quality signal: Emerging · 27/100How this signal is calculated ▾

Server availabilityNot measured

Not scored for repo-hosted servers — we can't reach the running server, only its GitHub page. Hosted MCP endpoints are health-checked live.

Verified ownership8/20

Documentation & tools11/30

Adoption & activity1/15

Community engagement0/10

★ Spotlight Slot

Feature Your MCP Server

Get maximum visibility for your server across our directory, search results, and detail pages.

Spotlight Your Server

Own this project?

Free dofollow backlink: add your website and place the AllMCPs badge on it — no claim needed. We detect it automatically and keep it verified as long as the badge stays live.

Claim & get free dofollow

Share & Embed

Add our SVG badge (dark/light directory styles) or embeddable widget to your site.

Explore more

More in 💰 Finance & Fintech →Best MCP servers for Finance & Fintech →Alternatives to Buoy →Install in Claude Desktop Install in Cursor Install in VS Code Setup guides for all 13 MCP clients