How to Use Agentic AI Skills

A skill is an installable package of domain knowledge that plugs into the SideButton MCP server. Install one with a single command and every connected AI coding agent — Claude Code, OpenAI Codex, Cursor — gets a new set of workflow tools and reference resources it can call directly.

What a skill brings to SideButton

Without a skill, a coding agent sees a web app as unstructured DOM. Ask it to file a Jira ticket or archive a Linear thread and it guesses selectors, fumbles the data model, and gives up halfway through the second step. The intelligence is there; the context isn't.

A skill changes the shape of that problem. It ships with the exact CSS selectors the agent should use, the data model behind every screen, the state machine each page can be in, and pre-built agentic workflows for the operations users actually care about. The agent stops guessing and starts calling typed tools.

Three properties make skills useful beyond a single prompt. They are installable — one command, versioned, reproducible. They are shared — the same skill that taught your Claude Code agent about GitHub also teaches your Codex CLI. And they are composable — install ten skills and the agent sees ten namespaces of tools in a single session. That is what makes agent-native development practical on the SideButton platform.

How SideButton serves skills via MCP

SideButton runs as an open-source MCP server on your machine. A coding agent connects to it over the Model Context Protocol (HTTP Streamable or stdio). Every skill installed in ~/.sidebutton/skills/ gets scanned, its modules and workflows are turned into MCP tool descriptors, and the server exposes them to any client that asks.

┌─────────────────────────────┐
│  AI coding agent            │   Claude Code / Codex / Cursor
│  (prompts, reasoning)       │
└──────────────┬──────────────┘
               │   MCP (HTTP or stdio)
┌──────────────▼──────────────┐
│  SideButton MCP server      │   http://localhost:9876/mcp
│   • core tools              │   browser, filesystem, shell
│   • skill tools             │ ← generated from installed skills
│   • agentic workflows       │ ← YAML pipelines from skills
└──────────────┬──────────────┘
               │
┌──────────────▼──────────────┐
│  Browser + local files      │
└─────────────────────────────┘

The key property: the tool registry is dynamic. When you install a new skill, SideButton hot-reloads and emits an MCP tools/list changed notification — connected clients refresh their tool set without a server restart or session reconnect.

1. Install a skill

One command fetches the skill from the public registry, validates it, and registers its tools with the running server.

$ sidebutton install writing

Expected output:

  Fetching writing@latest from registry...
  ✓ Downloaded writing (5 modules, 2 roles, 1 workflow)
  ✓ Validated skill-pack.json
  ✓ Installed to ~/.sidebutton/skills/writing/
  ✓ Hot-reloaded — workflow registered via run_workflow:
      • writing_quality_check

  Skill ready. Connected MCP clients discover the new tool on the next tools/list call.

2. Prompt your coding agent

Start a session in Claude Code, Codex, or any MCP client already connected to SideButton (see the Claude Code setup or Codex setup). The agent sees two kinds of new things from the skill: workflow tools — invoked via run_workflow(workflow_id, params) — and MCP resources that document the app. Ask in natural language.

"Using sidebutton, run a quality check on the draft landing-page copy in hero.md against the SideButton brand voice."

3. Example output

Workflows return a run_id synchronously. The agent fetches the structured run log with get_run_log(run_id) — the same event stream the local Dashboard renders live:

  # Run Log: writing_quality_check_2026-04-22T1410

  **Workflow:** Writing: Quality Check (writing_quality_check)
  **Status:**   SUCCESS
  **Duration:** 6.8s

  ## Events
  [START] writing_quality_check
    [1] shell.run        load banned_patterns.md
    [2] shell.run        load banned_phrases.md
    [3] shell.run        load banned_structures.md
    [4] shell.run        load scoring_rubric.md
    [5] llm.generate     pass-0 classify, pass-1 violations, pass-2 score
    [6] output           verdict + dimension scores
  [END] OK

  ## Output
  type:      landing-page
  score:     31 / 50  (directness 7, rhythm 6, trust 5, authenticity 7, density 6)
  verdict:   PASS (landing-page threshold 28)
  findings:  2 banned phrases flagged; 1 rhythm warning

Every step is inspectable, deterministic, and replayable. No DOM guessing — the skill's YAML pipeline called real browser primitives with real selectors.

Working with a skill's workflows

Every .yaml file in a skill registers as a workflow tool. Agents don't call them by opaque IDs — they discover them, inspect the input schema, run them, and tail the log. Three MCP tools cover the whole loop.

Step MCP tool What it does
Discover list_workflows() Returns every workflow's ID, title, parameter schema, and source skill
Run run_workflow(workflow_id, params) Executes the YAML pipeline, returns a run_id immediately
Inspect get_run_log(run_id) Status, duration, full event stream with per-step inputs and outputs
History list_run_logs(workflow_id?) Recent runs filtered by workflow, for debugging or replay

Discover all workflows exposed by installed skills:

  # Available Workflows (1 from writing)

  ## Writing: Quality Check
  - ID:     writing_quality_check
  - Source: workflows
  - Params:
      content: string   # material to evaluate
      context: string   # brand or situational context

The same catalog is visible in the local Dashboard under the Workflows tab — sortable, filterable, and clickable straight into a test run.

Reference resources a skill ships

Beyond callable workflows, a skill exposes read-only MCP resources — markdown and YAML the agent can fetch when it needs context before acting. Every MCP client surfaces resources alongside tools.

Resource URI What the agent reads
skill://<domain>/_skill.md Per-module domain knowledge — selectors, data model, page states, gotchas
skill://<domain>/<role>.md Role playbook — e.g. writing/writer.md, writing/editor.md
workflow://<id> YAML source for a workflow, so the agent can read before calling — or to copy-edit into a new one

Local dashboard at localhost:9876

The SideButton server boots a dashboard on the same port as the MCP endpoint. Open it in any browser to inspect the state an agent sees — without wiring up an agent session.

Skills & Modules

Every installed skill, with its modules, roles, and selectors rendered for review. Drills down into the same markdown the agent loads.

Workflows

Browse, search, and run any workflow. Parameter form auto-generated from the YAML inputs: block.

Run logs

Live and historical runs with per-step timing, inputs, and outputs — identical to what get_run_log returns over MCP.

Tools & resources

The full MCP surface the server advertises: browser primitives, workflow tools, skill:// and workflow:// resources.

The dashboard talks to the server over the same ws://localhost:9876/ws bus that powers the Chrome extension — everything it shows is what the agent actually sees.

One skill, every coding agent

A skill installed on your machine is available to every MCP client connected to the same SideButton server. The workflow tools, resources, and browser primitives are identical; only the client-side config differs.

Coding agent Config Workflow tools & resources?
Claude Code claude mcp add sidebutton --transport http ...
OpenAI Codex [mcp_servers.sidebutton] in ~/.codex/config.toml
Cursor / Claude Desktop / ChatGPT Generic MCP entry pointing at http://localhost:9876/mcp

Combine multiple skills in one session

Skills compose. Install writing, wikipedia, and any domain pack from /skills, and a single session sees every workflow side by side. A prompt like "research the topic on Wikipedia, draft a summary, then run a quality check against our brand voice" becomes one agentic pipeline executed across three skills the agent did not know existed an hour ago.

Because each skill is hot-loaded independently, you can iterate: install, prompt, uninstall, edit the skill locally, reinstall. The agent adapts to each change on its next MCP tools/list refresh — no session reconnect needed.

Frequently asked questions

Do I need to install a skill to use SideButton?

No. The core SideButton MCP server ships with browser, filesystem, shell, and workflow tools. Skills add domain knowledge for specific web apps. Start without any and install them as you need them.

Where do installed skills live on my machine?

In ~/.sidebutton/skills/<domain>/ — a plain directory tree. Versioned, git-friendly, editable. Each installed skill is a self-contained folder with _skill.md, _roles/, workflows, and skill-pack.json.

Can I run a skill that has not been published to the registry?

Yes. Run sidebutton install ./path/to/local/skill to load an unpublished directory. This is the recommended flow for private, internal, or in-development skills — the MCP server treats a local path the same as a registry entry.

How do installed skills show up inside Claude Code or Codex?

As MCP tools exposed under the sidebutton server — each YAML workflow becomes a callable tool (e.g. writing_quality_check, llm_summarize) with typed inputs and structured output. Open the MCP panel in your agent (Claude Code: /mcp; Codex: mcp list) to browse everything registered.

Does installing a new skill interrupt running MCP sessions?

No. SideButton hot-reloads the tool registry on install. The next /mcp list call from any connected client sees the updated tool set without a server restart or session reconnect.

Related