Sidebutton logo

Sidebutton

Open-source MCP server with browser automation and knowledge packs for AI agents

Install Sidebutton

Pick your client, then add it in one click or paste the config.

STDIONode.js
~/Library/Application Support/Claude/claude_desktop_config.json
claude_desktop_config.json
{
  "mcpServers": {
    "sidebutton": {
      "command": "npx",
      "args": [
        "-y",
        "sidebutton@latest"
      ]
    }
  }
}

Settings → Developer → Edit Config, merge this into mcpServers, then fully quit and reopen Claude Desktop.

We couldn’t confirm it starts correctly

We ran the install command but it didn't respond within our test window — this can mean a slow first-time install rather than a real problem.

npx -y sidebutton@latest

No response to initialize.

This is an experimental automated check and can have false negatives — missing environment variables, a slow cold install, etc. It doesn’t necessarily mean something’s wrong. Last checked 15d ago.

Overview

Tools29

What Sidebutton lets your agent do. Expand a tool for its parameters.

Self-reported~315 tokens of context

Security & health

What it can reach and how reliably it runs — from our own checks, not the maintainer’s claims.

ActiveLast checked 2d ago

Recent health check succeeded.

11/11 checks healthy over the last 56d

Supply-chain signal

No high-severity advisories surfaced by our automated scan.

Critical 0High 0Medium 0Low 0

Scanned 9d ago via OSV.dev · sidebutton@latest (npm)

Adoption & maintenance

Factual signals from GitHub, npm, and our automated checks — not a rating.

GitHub stars6Stargazers on the source repository.
npm downloads115Package downloads in the last 30 days.
Last commit1mo agoMost recent push to the default branch.
Install checkInconclusiveDidn't respond in our test window — often a slow first install.
Tools exposed29Callable tools this server registers over MCP.
Directory activity1 viewsConfig copies, upvotes, and views on AllMCPs.

From the project README

SideButton

Open-source AI agent platform for agentic coding — MCP server, knowledge packs, and AI workflow automation.

npm License

sidebutton.com · docs.sidebutton.com

SideButton open-source AI agent platform for agentic coding: MCP server, agentic workflows, knowledge packs

Run AI coding agents with agentic workflows, knowledge packs, and real browser control. Connect Claude Code, Codex, Cursor, ChatGPT, or any MCP client.

Terminal
npx sidebutton@latest
# Dashboard at http://localhost:9876

What you get

MCP ServerAI agent tools for browser control, workflow execution, and knowledge pack access. Stdio and SSE transports.
REST APITrigger workflows remotely from webhooks, cron jobs, mobile apps, or other agents.
Workflow EngineAI workflow automation with browser, git, issue-tracking, LLM, shell, and control-flow steps. Define agentic workflows in YAML.
Knowledge PacksInstallable domain knowledge — CSS selectors, data models, state machines. Role playbooks turn coding agents into an AI software engineer, QA, or PM.
Chrome ExtensionBrowser commands with real DOM access via WebSocket, not screenshots. Recording mode.
DashboardSvelte UI — workflow browser, run logs, skill pack manager, system status.

Quick Start

bash
# Install and start
npx sidebutton@latest

# Or from source
pnpm install && pnpm build && pnpm start

# Open http://localhost:9876

CLI

bash
pnpm cli serve          # Start server with dashboard
pnpm cli serve --stdio  # Start with stdio transport (for Claude Desktop)
pnpm cli list           # List available workflows
pnpm cli status         # Check server status

# Skill pack management
pnpm cli registry add <path|url>   # Install skill packs from a registry
pnpm cli registry update [name]    # Update installed packs
pnpm cli registry remove <name>    # Uninstall packs and remove registry
pnpm cli search [query]            # Search available skill packs

# Creating skill packs
pnpm cli init [domain]             # Scaffold a new skill pack
pnpm cli validate [path]           # Validate pack structure
pnpm cli publish [source]          # Publish to a registry

MCP Server

SideButton is an open-source MCP server for AI coding agents. Agents connect to it directly for browser control, workflow automation, and domain knowledge.

Works with Claude Code, Codex, Cursor, Claude Desktop, VS Code, Windsurf, ChatGPT — any MCP client.

Claude Code

Terminal
claude mcp add sidebutton --transport http http://localhost:9876/mcp

Persists to ~/.claude.json; add --scope project to write ./.mcp.json instead. Full guide: Claude Code SideButton MCP setup.

Codex

Add to ~/.codex/config.toml:

toml
[mcp_servers.sidebutton]
command = "sidebutton"
args = ["serve", "--stdio"]

Full guide: OpenAI Codex SideButton MCP setup.

Claude Desktop

Add to ~/Library/Application Support/Claude/claude_desktop_config.json:

config.json
{
  "mcpServers": {
    "sidebutton": {
      "command": "npx",
      "args": ["sidebutton", "--stdio"]
    }
  }
}

Cursor

Add to ~/.cursor/mcp.json:

config.json
{
  "mcpServers": {
    "sidebutton": {
      "url": "http://localhost:9876/mcp"
    }
  }
}

MCP Tools

ToolDescription
run_workflowExecute a workflow by ID
get_run_logGet execution log for a run
list_workflowsList all available workflows
get_workflowGet workflow YAML definition
list_run_logsList recent workflow executions
publish_artifactPublish evidence (screenshots, reports) from a session
get_browser_statusCheck browser extension connection
capture_pageCapture selectors from current page
navigateNavigate browser to URL
snapshotGet page accessibility snapshot
clickClick an element
typeType text into an element
press_keySend keyboard keys
scrollScroll the page
extractExtract text from element
screenshotCapture page screenshot (pass path to write a PNG file instead of returning image bytes)
select_optionSelect dropdown option
fillFill input value (React-compatible)
waitWait for element or delay
existsCheck if element exists
extract_allExtract all matching elements
extract_mapExtract structured data from repeated elements
scroll_into_viewScroll element into viewport
hoverHover over element
inject_cssInject CSS into the page (blur/hide elements before a screenshot)
evaluateExecute JavaScript in browser
browser_batchRun a sequence of browser actions in one call
set_basic_authSet HTTP Basic Auth credentials for the connected tab
clear_basic_authClear stored HTTP Basic Auth credentials

REST API

JSON endpoints for external integrations. The same workflows are available via MCP locally and via REST remotely.

bash
# Run a workflow
curl -X POST http://localhost:9876/api/workflows/check_ticket/run \
  -H "Content-Type: application/json" \
  -d '{"params": {"ticket_id": "PROJ-123"}}'

# List workflows
curl http://localhost:9876/api/workflows

# Get run log
curl http://localhost:9876/api/runs/latest

Trigger workflows from webhooks, cron jobs, mobile apps, or other agents on different machines.

Workflow Engine

YAML-first orchestration for agentic workflows. Step types by family:

Step Types

FamilySteps
browser.*navigate, click, type, fill, extract, extractAll, extractMap, snapshot, screenshot, wait, exists, hover, key, scroll, scrollIntoView, select_option, injectCSS, injectJS
git.*createPR, getPR, listPRs, getIssue, listIssues
issues.*create, get, search, comment, attach, transition
llm.*classify, decide, generate
control.*if, foreach, retry, stop
shell / terminalshell.run, terminal.open, terminal.run
data.*first, get
workflow.callCall another workflow with parameters

LLM steps work with Ollama (local), OpenAI, and Anthropic.

Example

yaml
id: check_ticket_status
title: "Check Jira ticket and classify"
steps:
  - type: browser.navigate
    url: "https://your-org.atlassian.net/browse/{{ticket_id}}"
  - type: browser.extract
    selector: "[data-testid='status-field']"
    as: current_status
  - type: control.if
    condition: "{{current_status}} != 'Done'"
    then:
      - type: llm.classify
        prompt: "Should this ticket be closed? Context: {{current_status}}"
        classes: [close, keep_open]
        as: decision

Variable Interpolation

Use {{variable}} syntax to reference extracted values or parameters:

yaml
steps:
  - type: browser.extract
    selector: ".username"
    as: user
  - type: shell.run
    cmd: "echo 'Hello, {{user}}!'"

Knowledge Packs

Installable domain knowledge (skill packs) per web app or domain. Knowledge packs power AI code review, automated testing, and enterprise AI agent deployments.

Also referred to as skill packs in code and CLI commands.

  • Selectors — CSS selectors for UI elements
  • Data models — entity types, fields, relationships, valid states
  • State machines — valid transitions per state
  • Role playbooks — role-specific procedures (QA, SE, PM, SD)
  • Common tasks — step-by-step procedures, gotchas, edge cases
bash
sidebutton install github.com
sidebutton install atlassian.net

Open registry with published packs for popular web apps. Build and share packs for any domain.

Chrome Extension

Install the SideButton Chrome Extension from the Chrome Web Store.

  • Browser commands — navigate, click, type, extract, scroll, wait, snapshot
  • Real DOM access via CSS selectors — not pixel coordinates, not screenshots
  • Recording mode — capture manual actions as workflows
  • Embed buttons — inject action buttons into any web page
  • WebSocket connection — stable reconnection, works with local or remote server

After installing:

  1. Navigate to any website
  2. Click the SideButton extension icon
  3. Click "Connect This Tab"

Dashboard & Observability

Svelte UI at http://localhost:9876:

  • Workflow browser — list, search, run
  • Run logs — step-by-step execution traces with timing, variables, errors
  • Skill pack manager — install, browse, inspect
  • System status — extension connection, LLM config, server health

SideButton handles multi-agent orchestration — from workflow execution to knowledge injection.

Architecture

Reviews

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

Frequently Asked Questions about Sidebutton

sidebutton is an MCP server that connects AI agents to browser control, workflow execution, and installable knowledge packs. It is open source and supports stdio and SSE transports. Developers can run it locally with npx sidebutton@latest, use its dashboard at localhost:9876, and connect clients including Claude Code, Codex, Cursor, ChatGPT, and other MCP clients.

Start sidebutton with npx sidebutton@latest, then open the dashboard at http://localhost:9876. You can also run it from source with pnpm install && pnpm build && pnpm start, or start the CLI with pnpm cli serve.

sidebutton can connect to Claude Code, Codex, Cursor, Claude Desktop, VS Code, Windsurf, ChatGPT, and other MCP clients. It provides connection options using HTTP or stdio, depending on the client.

sidebutton provides tools for browser control, workflow execution, and knowledge pack access. Its workflow engine supports browser, git, issue-tracking, LLM, shell, and control-flow steps, while knowledge packs provide domain-specific information such as CSS selectors, data models, state machines, and role playbooks.

Related MCP servers

Add a badge to your READMEShow it’s listed — live SVG, Markdown or HTML.

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 PreviewSidebutton AllMCPs Directory Badge
Markdown (GitHub README)
[![AllMCPs](https://allmcps.com/api/badge/sidebutton?style=directory)](https://allmcps.com/mcp/sidebutton)
HTML Embed
<a href="https://allmcps.com/mcp/sidebutton"><img src="https://allmcps.com/api/badge/sidebutton?style=directory" alt="Sidebutton on AllMCPs" /></a>