MCP Protocol

Model Context Protocol (MCP) Tools

DevLensPro is built on the Model Context Protocol, Anthropic's open standard for connecting AI assistants to external tools and data sources.

What is MCP?

The Model Context Protocol (MCP) is an open standard created by Anthropic that enables seamless communication between AI assistants and external tools. It provides a standardized way for tools to:

Expose functionality to AI models in a consistent format
Send and receive structured data with type safety
Run locally for privacy or remotely for collaboration

DevLensPro MCP Tool

get-pointed-element

Description

Retrieves information about the DOM element currently being pointed at or highlighted in the browser via the DevLensPro extension.

Parameters

textDetail(number, optional)

Controls text content in response. 0 = none, 1 = visible text, 2 = full text (default)

cssLevel(number, optional)

Controls CSS detail. 0 = none, 1 = layout, 2 = box model, 3 = full computed styles

Response

{
  "selector": "div#app > main > button.primary",
  "tagName": "button",
  "className": "primary hover:shadow-lg",
  "boundingBox": { "x": 100, "y": 200, "width": 120, "height": 40 },
  "computedStyles": { "backgroundColor": "rgb(37, 99, 235)", ... },
  "textContent": "Click me"
}

Architecture

Chrome Extension

Captures DOM elements and sends data to MCP server

MCP Server

Receives element data and exposes it via MCP protocol

Claude Code

Queries MCP server and uses element context for assistance

Why MCP Matters

Local-First Privacy

MCP servers run on your machine, keeping all data local by default

Standard Protocol

Works with any MCP-compatible AI assistant, not just Claude

Extensible

Build your own MCP tools that integrate with DevLensPro

Start Using MCP Tools Today

Learn how to configure DevLensPro MCP server in your development environment.

View Documentation