Xtractlytractly
agent bridge · mcp

Your agent, with your taste.

The Agent Bridge is Xtractly’s MCP server. Your coding agent reads your captures, library and themes before it writes a line, and edits what you point at on the canvas. Xtractly runs no AI of its own.

Connect your agentSetup docs
how it ties in
  1. your browser
    Extension

    Capture any element, colour, font or asset on any site.

    save
  2. xtractly.app
    Xtractly

    Your library, themes and the canvas you edit them on.

    serves
  3. /api/mcp
    Agent Bridge

    Xtractly's MCP server. One URL, your account.

    reads
  4. your model
    Your agent

    Claude Code, Cursor, Codex or any MCP client.

    writes
  5. your repo
    Your code

    On-brand components, written into your repo.

shortcut · extension → agent

With Send captures to my agent on, what you just captured is one call away: get_latest_capture. No saving first.

loop · agent → canvas

Pin elements on the canvas and write the change; your agent picks it up with list_requests and edits the design with edit_design. It lands live.

01 · connect

One URL. Any MCP client.

Claude and Cursor sign you in with Xtractly, no token to copy. Everything else takes a token from Settings → Agent Bridge.

claude code
$claude mcp add xtractly --transport http https://www.xtractly.app/api/mcp
server url
$https://www.xtractly.app/api/mcp
cursor

Installs the server and signs you in.

Add to Cursor
Claude
Settings → Connectors → Add custom connector, paste the URL, sign in.
Cursor
One click with Add to Cursor; it signs you in the same way.
Codex, Cline, Windsurf, Zed
Add an HTTP MCP server at the URL with a token from Settings → Agent Bridge.
Setup for every client
02 · read

Read everything. As often as it likes.

Your agent can read your library as often as it likes. Ask it to list your themes or use your latest capture, and it pulls the real values instead of guessing hex codes.

library
list_themes

Your themes, extracted or hand-built

get_theme

Every token as :root CSS, Tailwind v3/v4, shadcn, DTCG or DESIGN.md

list_components

Every saved component

get_fragment

One component's files, in the framework you're in

list_projects / get_project

Projects and their history

captures
get_latest_capture

What you just captured in the browser

list_recent_captures

The last 24 hours of captures

canvas
get_selection

What you've selected on the canvas right now

get_element_tree

Every element with its address and classes

get_design

The design the preview page shows

03 · write

Save back. No weekly cap.

Your agent writes new components, variants and edits straight into your library, with no limit on saves. It all works during your 3-day free trial and with Lifetime.

create_projectA project to save components into
create_fragmentSave a new component to your library
update_fragmentPatch an existing component's files
edit_elementChange one element's classes or text
create_variantTry an alternative beside yours
edit_design / write_designEdit the design a request is about
Unlimited saves
Create, update and edit as often as you need.
3-day trial
Every tool, no card, from the day you sign up.
Paid once
Lifetime keeps the Bridge working, no subscription.
Trial and Lifetime
04 · requests

Point at it. Your agent does it.

On a component's preview page, pick the elements you mean and write the change. The request waits for your agent, like a comment in a design tool.

on the canvas
1button.btn-primary

Make this an outlined button: transparent fill, 1.5px border.

WaitingAgent working…Done
› do my Xtractly requests
xtractly · list_requests
1 open · “Make this an outlined button…”
xtractly · update_request · working
xtractly · edit_design
- background: #0b0b0c;
+ background: transparent;
✓ update_request · done
Comment
Pin elements and type what should change.
“Do my Xtractly requests”
Or “watch Xtractly” to pick each one up as you send it.
Lands live
The edit shows on the page as soon as it's saved, with the agent's reply.

The web’s best ideas. Your product.

Save the components, colours and fonts you like from any site. Your coding agent builds with them, so it ships your style.

Add to Chrome

Every feature free for 3 days · no card · then once