A
license-
qualityD
maintenanceMCP server for visual feedback, video direction, and QA assertions on web pages, enabling AI agents to read, reply, and resolve annotations in real time.
Last updated
4
MIT
vibe-annotations
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@vibe-annotationsimplement all annotations on the dashboard"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Vibe Annotations
Visual feedback tool for web development. Annotate elements on your pages, make design tweaks, and share with AI coding agents or teammates.
https://github.com/user-attachments/assets/6946733e-eea6-4d38-8386-c493f90d36f4
For more features explanations (like collaboration via file sharing, AI-assisted annotations, watch mode...) please read the docs.
Get started
1. Install the browser extension
2. Run the setup wizard
npx vibe-annotations-server initOne interactive command installs the global server, starts it in the background, and configures your AI coding agent (Claude Code, Cursor, Windsurf, Codex, OpenClaw, VS Code). Prefer manual? See Installation.
3. Open a localhost page, click Annotate. You can annotate multiple pages on your web app. Then:
A (recommended) - Use the MCP to implement your Annotations
B - Copy to your clipboard: View all > Copy and send to your AI coding agent.
Related MCP server: @designjs/mcp-server
Documentation
Full docs at vibe-annotations.com/docs — including installation, MCP setup, workflows, architecture, and troubleshooting.
Contributing
See CONTRIBUTING.md. PRs welcome.
License
PolyForm Shield 1.0.0 — see LICENSE and NOTICE.
This server cannot be installed
Maintenance
–Maintainers
3dResponse time
1wRelease cycle
18Releases (12mo)
Commit activity
Issues opened vs closed
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Servers
- Alicense-qualityAmaintenanceMCP server that enables AI coding agents to read and write to a local-first HTML/CSS design canvas, bridging visual design and code generation.Last updatedMIT
- Alicense-qualityBmaintenanceEnables visual annotation on web pages for Claude Code, allowing element selection, comment addition, screenshot capture, and structured UI feedback for code fixes via an MCP server.Last updatedMIT
- Flicense-qualityDmaintenanceAn MCP server that enables AI coding tools to control a browser for automated actions, UI extraction, network interception, and screenshots.Last updated1
Related MCP Connectors
SEO MCP server: crawl your site, find AI-visibility gaps, and ship the fix from your coding agent.
Screenshot, diff, audit and sitemap-capture any web page — 5 MCP tools for AI agents.
MCP server for AI agents to plan, verify, and deploy Cloudflare-native apps.
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/RaphaelRegnier/vibe-annotations'
If you have feedback or need assistance with the MCP directory API, please join our Discord server