webdev-mcp
An MCP server that provides useful web development tools.
Usage
Cursor
- To install in a project, add the MCP server to your
.cursor/mcp.json
:
- To install globally, add this command to your Cursor settings:
Windsurf
- Add the MCP server to your
~/.codeium/windsurf/mcp_config.json
file:
Tools
Currently, the only 2 tools are takeScreenshot
and listScreens
. Your agent can use the list screens tool to get the screen id of the screen it wants to screenshot.
The tool will return the screenshot as a base64 encoded string.
Tips
Make sure YOLO mode is on and MCP tools protection is off in your Cursor settings for the best experience. You might have to allow Cursor to record your screen on MacOS.
local-only server
The server can only run on the client's local machine because it depends on local resources.
An MCP server that provides web development tools including taking screenshots of screens, enabling AI agents to capture and analyze visual content during development.
Related MCP Servers
- AsecurityAlicenseAqualityAn official MCP server implementation that allows AI assistants to capture website screenshots through the ScreenshotOne API, enabling visual context from web pages during conversations.Last updated -1428TypeScriptMIT License
- AsecurityFlicenseAqualityAn MCP server providing web development tools such as screen capturing capabilities that let AI agents take and work with screenshots of the user's screen.Last updated -228715MIT License
- -securityFlicense-qualityAn MCP server that analyzes webpage design images using vision models and generates development documentation in Markdown format.Last updated -Python
- AsecurityFlicenseAqualityAn MCP server that enables AI assistants to capture and analyze web page screenshots using Puppeteer, supporting multi-breakpoint captures, error reporting, and page interactions.Last updated -11357JavaScript