browser-automation

Browser MCP

by djyde

Discover Browser MCP on the Chrome Web Store—a powerful Chrome extension for real-time web interaction, markdown, CSS ch

Browser extension that enables real-time interaction with web pages, allowing retrieval of content as markdown, CSS styling modifications, and browser history searches.

github stars

83

Works with your active browser sessionReal-time page modificationsBrowser extension based

best for

  • / Summarizing and analyzing web content
  • / Applying custom styling to web pages
  • / Research workflows requiring browser history searches

capabilities

  • / Extract current page content as markdown
  • / Modify page CSS styling in real-time
  • / Search browser history
  • / Interact with actively browsed web pages

what it does

Browser extension and MCP server that lets you interact with your current browser tab, extracting content as markdown and modifying page styling. Works with the browser you're actively using rather than launching a separate browser instance.

about

Browser MCP is a community-built MCP server published by djyde that provides AI assistants with tools and capabilities via the Model Context Protocol. Discover Browser MCP on the Chrome Web Store—a powerful Chrome extension for real-time web interaction, markdown, CSS ch It is categorized under browser automation.

how to install

You can install Browser MCP in your AI client of choice. Use the install panel on this page to get one-click setup for Cursor, Claude Desktop, VS Code, and other MCP-compatible clients. This server runs locally on your machine via the stdio transport.

license

MIT

Browser MCP is released under the MIT license. This is a permissive open-source license, meaning you can freely use, modify, and distribute the software.

readme

browser-mcp

A browser extension and MCP server that allows you to interact with the browser you are using.

mcp

jkXeswNy@2x

Usage

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@djyde/mcp-browser@latest"
      ]
    }
  }
}

Tools

All available tools are listed in server/src/tools.ts.

get_current_page_markdown

Get the markdown from current browser browsing page.

example:

Summarize the current page.

append_style

Append a css style to the current browser browsing page.

example:

Change the current page to dark mode.

history_search

Search the browser history.

example:

Search the browser history for "github".

Roadmap

  • Publish the extension to extension store.
  • Write documentation.
  • Add more tools.

Build

pnpm i

Extension

cd extension

# chrome
npm run build

# edge
npm run build:edge

# firefox
npm run build:firefox

After building, the extension will be in the extension/.output directory.

Server

cd server

# dev
npm run dev

# build
npm run build

server/dist/cli.js is the MCP server entry.

Contributing

Add a new tool

  1. Add the tool schema to the tools array in server/src/tools.ts.
  2. Add a extension callable handler in extension/calls.ts.
  3. Add a tool handler in server/src/tools.ts. Use the call function to call the extension handler.

License

AGPL-3.0-or-later