Vibe Annotations - Visual Feedback for AI Coding Agents

Vibe Annotations - Visual Feedback for AI Coding Agents

ID: gkofobaeeepjopdpahbicefmljcmpeof

Supported Languages

🇺🇸English

Extension Info & Metadata

Status
Active
Version
2.0.1
Size
0.45 MB
Rating
5.0/5
Reviews
7
Users
1,000
Type
Extension
Updated
Jul 11, 2026
Category
Developer tools
Price
Free
Featured
No
Visibility
Listed
Mature
No
By Google
No
Trusted
No

Publisher Contextual Analysis

Author
Spellbind Creative StudioView Profile
Country
FR
MX records exist
Yes
Domain exists
Yes
Is disposable
No
Is role-based
Yes
Mailbox exists
Yes
Address
50 rue de Navarre Bordeaux 33000 FR
Website
Visit
Total Extensions
1
Active
1
Obsolete
0
Listed
1
Unlisted
0
Total Users
1,000
Screenshot 1
Screenshot 2
Screenshot 3
Screenshot 4
Screenshot 5

Visual annotations for localhost dev projects. Send feedback to AI coding agents like Claude & Cursor via MCP.

Transform your localhost development workflow with visual annotations for AI coding agents. Vibe Annotations bridges the gap between visual feedback and automated code fixes. Drop annotations directly on your localhost development projects, and let AI coding agents automatically read, understand, and implement your feedback across multiple pages while respecting your responsive breakpoints. ✨ Key Features - Visual Annotation System: Click to drop numbered annotations on any DOM element during development - Multi-Agent Compatibility: Works with Claude Code, Cursor, Windsurf, VS Code, and other AI coding tools - Multi-Project Safety: Intelligent project detection prevents cross-project contamination - Responsive Context Awareness: Captures viewport dimensions so AI agents respect your breakpoints - Multi-Page Support: Annotate across different routes and pages of your application - Persistent Inspection Mode: Stay in annotation mode to drop multiple feedback points efficiently - Rich Element Context: Captures CSS selectors, element properties, and positioning data - Batch Operations: Efficient "read all → implement all → delete all" workflow - Seamless MCP Integration: Connects to AI agents via SSE transport for automated fixes 🚀 How It Works 1. Setup: Install the companion MCP server with three copy/paste commands 2. Annotate: Enter inspection mode and click elements to add feedback 3. Implement: Ask your AI coding agent to read and implement all your annotations at once - it will automatically detect your current project and filter relevant annotations 4. Iterate: Use batch deletion after implementation, ready for the next development cycle 🛠 Perfect For - Frontend developers using AI coding assistants - UI/UX feedback and rapid prototyping - Responsive design testing and fixes - Code review and improvement workflows - Team collaboration on localhost projects - Multi-project development environments 🤖 AI Agent Support - Claude Code: Full MCP integration via SSE transport - Cursor: Compatible through MCP server - Windsurf: Works with MCP protocol - VS Code Extensions: Supports MCP-compatible tools - Other AI Tools: Any agent supporting MCP protocol 📋 Requirements - Works exclusively on localhost development servers - Requires companion vibe-annotations-server MCP package installation - Compatible with React, Vue, Angular, and all web frameworks - Supports common dev server ports (3000, 5173, 8080, etc.) - Multi-project workspace support with intelligent filtering Note: This extension only operates on localhost URLs (localhost, 127.0.0.1, 0.0.0.0) and requires the vibe-annotations-server MCP package to function. The system automatically prevents cross-project annotation mixing for safe multi-project development.

Item
Type
Severity
Description
scripting
Permission
Critical
This permission allows injection and execution of JavaScript on any webpage. Rated Critical because it can modify page content, steal sensitive data, and inject malicious code into any site the extension has access to.
Contextual Risk Factors
Risk Factor
High
The following context increases the overall risk:• 10% increase: Early script execution enables pre-emptive content manipulation
Broad Host Permissions
Risk Factor
High
This extension has broad host permissions allowing it to access many or all websites.
Broad Content Script Access
Risk Factor
High
This extension can inject scripts into any website.
activeTab
Permission
Medium
This permission grants temporary access to the current tab. Rated Medium because it can access current page content when invoked, though limited to user-initiated actions.
storage
Permission
Medium
This permission allows storing data locally in the browser. Rated Medium because it can persist sensitive user data, track user activities over time, and potentially store malicious payloads.
http://localhost/*
Host
Medium
Host permission — access limited to this URL pattern.
https://localhost/*
Host
Medium
Host permission — access limited to this URL pattern.
http://127.0.0.1/*
Host
Medium
Host permission — access limited to this URL pattern.
https://127.0.0.1/*
Host
Medium
Host permission — access limited to this URL pattern.
http://0.0.0.0/*
Host
Medium
Host permission — access limited to this URL pattern.
https://0.0.0.0/*
Host
Medium
Host permission — access limited to this URL pattern.
http://*.local/*
Host
Medium
Host permission — access limited to this URL pattern.
https://*.local/*
Host
Medium
Host permission — access limited to this URL pattern.
http://*.test/*
Host
Medium
Host permission — access limited to this URL pattern.
https://*.test/*
Host
Medium
Host permission — access limited to this URL pattern.
http://*.localhost/*
Host
Medium
Host permission — access limited to this URL pattern.
https://*.localhost/*
Host
Medium
Host permission — access limited to this URL pattern.
file:///*
Host
Medium
Host permission — access limited to this URL pattern.
Early Content Script Execution
Risk Factor
Medium
This extension runs content scripts at document_start.
URLs
10
IPv4
2
IPv6
0

URLs

View the external URLs this extension communicates with to understand its network activity and data interactions.

Gain full insight into all external connections.

Upgrade for full visibility.

http:-http://127.0.0.1:3846`,l=!1;function
github.com/RaphaelRegnier/vibe-annotations/releases/tag/v$%7Bt%7D%60%7D%7Dhttps://github.com/RaphaelRegnier/vibe-annotations/releases/tag/v${t}`}}
localhost/*%60,%60https://localhost/*%60,%60http://127.0.0.1/*%60,%60https://127.0.0.1/*%60,%60http://0.0.0.0/*%60,%60https://0.0.0.0/*%60,%60http://*.local/*%60,%60https://*.local/*%60,%60http://*.test/*%60,%60https://*.test/*%60,%60http://*.localhost/*%60,%60https://*.localhost/*%60,%60file:///*%60http://localhost/*`,`https://localhost/*`,`http://127.0.0.1/*`,`https://127.0.0.1/*`,`http://0.0.0.0/*`,`https://0.0.0.0/*`,`http://*.local/*`,`https://*.local/*`,`http://*.test/*`,`https://*.test/*`,`http://*.localhost/*`,`https://*.localhost/*`,`file:///*`
http:-http://127.0.0.1:3846`,n=null,r=0,i=2e3,a=`0.5.0`;function
github.com/RaphaelRegnier/vibe-annotationshttps://github.com/RaphaelRegnier/vibe-annotations
github.com/RaphaelRegnier/vibe-annotations/releases/tag/v$%7BVi(ahttps://github.com/RaphaelRegnier/vibe-annotations/releases/tag/v${Vi(a
127.0.0.1/mcphttp://127.0.0.1:3846/mcp
127.0.0.1/mcp"http://127.0.0.1:3846/mcp"
github.com/RaphaelRegnier/vibe-annotations/releases%60,r=document.createElement(%60div%60https://github.com/RaphaelRegnier/vibe-annotations/releases`,r=document.createElement(`div`
github.com/RaphaelRegnier/vibe-annotations/releases/tag/v$%7BQ(thttps://github.com/RaphaelRegnier/vibe-annotations/releases/tag/v${Q(t

Gain full insight into all external connections.

Upgrade for full visibility.

127.0.0.1
IPv4
-
0.0.0.0
IPv4
-
Showing 1 to 10 of 20 rows
Rows per page:

Code Diff

Compare extension code between any two versions.

0 changed files (scanned top 25 shared text files)

No comparable text files found between these versions.

Browse and explore files within this extension package

Gain full insight into all external connections.

Upgrade for full visibility.