Help us improve
Share bugs, ideas, or general feedback.
Share bugs, ideas, or general feedback.
Share bugs, ideas, or general feedback.
Claude Code plugin for InstantCode Annotator - enables AI-human collaboration through visual element selection and annotation
npx claudepluginhub nguyenvanduocit/claude-annotator-plugin --plugin claude-annotator-pluginClaude Code plugin for vite-plugin-ai-annotator - enables AI-human collaboration through visual element selection and annotation.
This plugin provides Claude Code with knowledge about AI Annotator, a tool that bridges the gap between AI assistants and web development by allowing:
In Claude Code, first add the marketplace, then install the plugin:
/plugin marketplace add nguyenvanduocit/claude-annotator-plugin
/plugin install claude-annotator-plugin@claude-annotator-plugin
Then ask Claude: "Set up ai-annotator for my project" - it will handle everything!
git clone https://github.com/nguyenvanduocit/claude-annotator-plugin.git
claude --plugin-dir ./claude-annotator-plugin
# User scope (default) - available across all projects
/plugin install claude-annotator-plugin@claude-annotator-plugin --scope user
# Project scope - shared with team via version control
/plugin install claude-annotator-plugin@claude-annotator-plugin --scope project
When you ask Claude to set up ai-annotator, it will:
vite-plugin-ai-annotator as a dev dependencyvite.config.ts with the annotator pluginFramework Support:
The annotator skill provides comprehensive guidance on:
Trigger phrases:
| Tool | Description |
|---|---|
annotator_list_sessions | List connected browser sessions |
annotator_get_page_context | Get current page URL, title, selection count |
annotator_select_feedback | Enter inspect mode or select by CSS/XPath |
annotator_get_feedback | Get data about selected elements |
annotator_capture_screenshot | Capture viewport or element screenshot |
annotator_clear_feedback | Clear all selections |
annotator_inject_css | Inject CSS styles into page |
annotator_inject_js | Execute JavaScript in page context |
annotator_get_console | Get captured console logs |
Note: All tools (except annotator_list_sessions) accept an optional sessionId parameter. If only one browser is connected, it auto-selects.
MIT
Admin access level
Server config contains admin-level keywords
Share bugs, ideas, or general feedback.
Based on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
Domscribe is a pixel-to-code development tool that maps running UI elements to their exact source locations, capturing runtime context (props, state, DOM) for handoff to coding agents via MCP.
CodyMaster v7.0 — 50 token-optimized AI agent skills (progressive disclosure, ~100 tok index → SKILL.md on demand) + 11 slash commands + 5 sub-agents + cm-context MCP server. Browse Hybrid Bridge, a11y snapshots, structured error collection, video recording.
Shared Claude Code plugin for frontend teams, including frontend skills, subagents, hooks, and MCP integration for Figma/Sketch/MasterGo/Pixso/墨刀/摹客. All reports auto-saved as Markdown files.
Agents specialized in frontend development, UI design, and presentation engineering. Focuses on visual design, user experience, and interaction patterns.
Agents for UI/UX design, accessibility, and user experience optimization
Use this agent when building user interfaces, implementing React/Vue/Angular components, handling state management, or optimizing frontend performance. This agent excels at creating responsive, accessible, and performant web applications. Examples:\n\n<example>\nContext: Building a new user interface\nuser: "Create a dashboard for displaying user analytics"\nassistant: "I'll build an analytics dashboard with interactive charts. Let me use the frontend-developer agent to create a responsive, data-rich interface."\n<commentary>\nComplex UI components require frontend expertise for proper implementation and performance.\n</commentary>\n</example>\n\n<example>\nContext: Fixing UI/UX issues\nuser: "The mobile navigation is broken on small screens"\nassistant: "I'll fix the responsive navigation issues. Let me use the frontend-developer agent to ensure it works perfectly across all device sizes."\n<commentary>\nResponsive design issues require deep understanding of CSS and mobile-first development.\n</commentary>\n</example>\n\n<example>\nContext: Optimizing frontend performance\nuser: "Our app feels sluggish when loading large datasets"\nassistant: "Performance optimization is crucial for user experience. I'll use the frontend-developer agent to implement virtualization and optimize rendering."\n<commentary>\nFrontend performance requires expertise in React rendering, memoization, and data handling.\n</commentary>\n</example>
Generic knowledge-vault tooling for Claude Code — LSP server + CLI validator + shared parsing lib (body parser, template rules). Config-driven vault root via .claude/vault-keeper.json; single source of truth for vault validation logic.
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge.
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge.
Sign in to claim