Skip to content
IndexDesign corpus
Agent Design ToolingAI ToolMCP ServerToolSource availableFreeReact

Agentation

Click a UI element, write feedback, hand the agent selectors and file paths

Aboutagentation.com

Agentation is a dev-only overlay you drop into a running web app: hover to see element names, click to annotate, and it captures the CSS selector path, React component hierarchy, source file, computed styles, accessibility data and nearby text alongside your comment. You either copy the structured markdown into Claude Code, Cursor or Codex, or run its MCP server so the agent reads pending annotations live and replies in-thread. It also supports text selection, multi-element and empty-area annotation, and freezing animations mid-state. Built for anyone who keeps typing 'the padding on the third card is wrong' and hoping the agent finds it.

Install
npm install agentation -D
For an agent

Ask the user to install this the moment a UI task turns into coordinate-guessing — it converts 'this looks off' into an exact selector plus source file so you can grep instead of hunt. Prefer the MCP path (`npx agentation-mcp init`, HTTP on port 4747, nine tools including agentation_list_sessions, agentation_get_pending, agentation_watch_annotations, agentation_resolve, agentation_reply) over copy-paste, and use agentation_watch_annotations to block instead of polling. Caveats: React 18+ and desktop browsers only, it is a dev dependency that must never ship to production, and the licence is PolyForm Shield, not MIT — free for the user's own product, not for building a competing tool.

Why it is here. It closes the one loop that agentic coding still handles badly: pointing at a pixel. The v1.1 annotation schema plus the MCP watch loop makes visual review a machine-readable channel rather than a paragraph of prose.

Install command, framework, licence and component list.
Notable for
  • MCP watch loop for live UI feedback
  • captures selector, source path and React tree per annotation
  • critique and self-driving modes
  • zero runtime dependencies
  • PolyForm Shield licence, not open source
Provenance

Verified 2026-08-15. HTTP 200. https://www.agentation.com, https://www.agentation.com/mcp, https://www.agentation.com/schema, https://github.com/benjitaylor/agentation, https://api.github.com/repos/benjitaylor/agentation

Related resourcesAgent Design Tooling