MCP server · Developer tools
MCP Pointer
by etsd-tech
Point at any element on a web page and let your AI read its details.
MCP Pointer lets you click on any part of a web page and have your AI assistant look at exactly that part. You hold the Option key (Alt on Windows) and click an element in Chrome, then ask your AI about it. It is handy for anyone who builds or edits websites and wants their AI to see the same thing they see.
What is an MCP server? The 30-second version
On its own, your AI can only chat with you. It cannot see your browser or the page you are looking at. An MCP server is a small helper program that gives your AI a new skill, and here that skill is reading the exact element you point at in your browser. Once it is connected, your AI can pull in the details of that element and talk about it with you.
What this MCP server does
You install a Chrome extension and connect a small helper program to your AI tool. When you hold Option (or Alt) and click an element on a page, the extension grabs the details of that element. The helper passes those details to your AI through a shared connection on your own computer. Then you ask your AI a question, and it answers using the element you pointed at. You can also ask for more or less detail, like only visible text or full styling.
Click to zoomWhat you can do with it
- Point at a button, heading, or box on a page and ask your AI what it is
- Get the text, classes, and HTML attributes of the element you clicked
- Ask for the CSS styling of an element, from none up to full detail
- Ask your AI to help fix or change the element you selected
- See which React component an element comes from (experimental)
- Ask for just the visible text, or hide the text entirely, depending on what you need
Try asking your AI
- “What is this element I just pointed at?”
- “Show me the CSS for the element I selected.”
- “Why does this button look off? Here is the element I clicked.”
- “Give me just the visible text of the element I pointed at.”
What it gives back to you
Your AI gets back a written description of the element you clicked. That includes things like the tag name, its classes, its text, its position on the page, and its styling. It shows up in your chat as an answer or a summary based on those details. Nothing on the page changes unless you ask your AI to make a change.
Before you start
What you need
- The Chrome browser
- The MCP Pointer Chrome extension (free from the Chrome Web Store)
- An AI coding tool that supports MCP, like Claude Code, Cursor, or Windsurf
- Node.js installed on your computer so the npx command works
Good to know
The extension reads details from the web pages you point at, so avoid using it on pages with private or sensitive information you would not want shared with your AI tool.
Install it with your AI
Add MCP Pointer to your AI, no technical skills needed
You don't install anything by hand. You copy one prompt, paste it into an AI that can work on your computer, and it checks, installs and connects the server for you, asking you when it needs something.
Sign in to get the install prompt
Members get a ready-made prompt that lets the Claude desktop app check MCP Pointer, install it and connect it for them, step by step. You don't need any technical skills: you copy, paste and answer a few questions. Your connected AI can also find and install any of the 4,066 MCP servers here for you.
Who it's for
Web developers and designers who use an AI coding tool and want it to see the exact page element they are working on.
