MCP Catalogs
← Homemcp-pointer screenshot

mcp-pointer

by etsd-tech·★ 574·Score 50

MCP Pointer enables AI assistants to see and analyze specific DOM elements through browser selection via MCP protocol.

developer-toolsbrowser-automationai-llm
55
Forks
3
Open issues
6 mo ago
Last commit
2d ago
Indexed

Overview

MCP Pointer combines a Node.js MCP server with a Chrome extension to bridge the gap between browsers and AI coding assistants. Using Option+Click, developers can select any DOM element, and MCP Pointer extracts comprehensive data including text content, CSS attributes, positioning information, and React component details. This textual context is then made available to agentic tools like Claude Code, Cursor, and Windsurf through standardized MCP tools.

Try asking AI

After installing, here are 5 things you can ask your AI assistant:

you:Analyzing specific UI elements with AI coding assistants
you:Debugging CSS and layout issues in web development
you:Understanding component structure in React applications
you:What browsers are supported?
you:How do I troubleshoot connection issues?

When to choose this

When working on frontend development and need AI assistance to analyze specific DOM elements.

When NOT to choose this

If you're not using Chrome-based browsers or don't need AI assistance with web development elements.

Tools this server exposes

1 tool extracted from the README
  • get-pointed-elementtextDetail?: 0 | 1 | 2, cssLevel?: 0 | 1 | 2 | 3

    Returns textual information about the currently pointed DOM element

Comparable tools

click-to-componentreact-inspectorwebdevtools-mcp

Installation

Installation

  1. Install the Chrome Extension:

- From Chrome Web Store: [Install from Chrome Web Store](https://chromewebstore.google.com/detail/mcp-pointer/jfhgaembhafbffidedhpkmnaajdfeiok) - Or manual installation from releases

  1. Configure MCP Server:
npx -y @mcp-pointer/server config claude  # or cursor, windsurf, manual
  1. Restart your AI coding tool to load the MCP connection.

Claude Desktop Configuration

Add to your claude_desktop_config.json:

{
  "mcpServers": {
    "mcp-pointer": {
      "command": "npx",
      "args": ["-y", "@mcp-pointer/server@latest", "start"]
    }
  }
}

FAQ

What browsers are supported?
Chrome is fully supported. Chromium-based browsers like Edge, Brave, and Arc should work but may require manual installation of the extension.
How do I troubleshoot connection issues?
Verify the MCP server is running with `npx -y @mcp-pointer/server@latest start`, check browser console for WebSocket errors, and ensure port 7007 isn't blocked by your firewall.

Compare mcp-pointer with

mcp-pointer vs ultimate_mcp_servermcp-pointer vs mcp-server-chartmcp-pointer vs everythingmcp-pointer vs filesystemmcp-pointer vs time
GitHub →

Last updated · Auto-generated from public README + GitHub signals.