Vue 2.7 & Vue 3

See it. Point it. Fix it.

Agentation-vue turns UI annotations into instructions for your coding agents. Click any element, add a note, and paste the output into Claude Code, Cursor, or any AI tool.

Add to Chrome
or add to your Vue codebase

Unofficial Vue.js port of agentation.dev

01 Click any element02 Add a comment03 Copy Markdown

Vue component tree

Auto-detects the full component hierarchy alongside CSS selectors.

Keyboard shortcuts

Double-tap a modifier key to toggle inspect mode. Hold it to peek at elements without leaving your flow.

Area & multi-select

Shift+drag for multi-element. Alt+drag for screen regions.

Forensic mode

Captures bounding boxes, computed styles, CSS classes, accessibility info.

Get started

# install 

npm install agentation-vue

# register plugin 

import { AgentationVuePlugin } from 'agentation-vue'import 'agentation-vue/style.css' app.use(AgentationVuePlugin)

# add to template 

<agentation-vue />
v0.2.14