domscribe
Active·★ 169·MIT·Updated 2026-05-29
★ Trending★ Code Assistant★ Dev Tooling
Domscribe is a pixel-to-code development tool that bridges the gap between running web applications and their source code.
Domscribe connects AI coding agents to running frontend applications. It provides build-time stable IDs, deep runtime context (props, state, DOM), and bidirectional querying between source code and live browser. It is framework-agnostic and supports any MCP-compatible agent.
#ai#claude-code-plugin#copilot-cli-plugin#cursor-plugin#developer-tools#devtools#gemini-cli-extension#kiro-power
01
Features
01Build-time stable IDs via AST injection (data-ds attributes)
02Deep runtime context capture (props, state, DOM snapshot)
03Bidirectional source↔UI querying (code→live DOM, UI→code annotation)
04Framework-agnostic with adapters for React, Vue, Next.js, Nuxt
05MCP tools for agent integration (12 tools, 4 prompts)
02
Compatibility
React
React 18–19
Verified via docs
Vue
Vue 3+
Verified via docs
Next.js
Next.js 15–16
Verified via docs
Nuxt
Nuxt 3+
Verified via docs
Any Framework
Any framework (transform only)
Verified via docs
03
Quick start
1
$ npx domscribe init
04
Use cases
↳Let AI agents 'see' the browser: agent queries source code and gets live DOM snapshot, props, state to verify changes before and after editing.
↳Point-and-tell UI changes: developer clicks an element in the browser overlay, types an instruction, and the agent claims the annotation and implements the change.
↳Annotate elements for AI-driven refactoring or styling adjustments, with full source location and runtime context for precise modifications.
05
Alternatives
Context7★ 56.4k
MCP Server that provides up-to-date code documentation for LLMs and AI code editors.
awesome-cursorrules★ 39.8k
📄 Configuration files that enhance Cursor AI editor experience with custom rules and behaviors
qveris-agent-toolkit★ 229
Open-source toolkit for the QVeris capability routing network: CLI, MCP server, Python SDK, skills, and REST API docs for agents to discover, inspect, call, and audit real-world tools.
Related searches
Comments
Log in to leave a comment
- AAspen HarrisMar 21, 2026
Pixel-to-code development tool that bridges running apps and code generation.
- EEmerson ZhangMar 18, 2026
Works as a bridge between what the app looks like and what the code should say.
- TTaylor DavisMar 14, 2026
Good for front-end developers who want AI to understand their running app's actual state.
- HHarley JacksonMar 7, 2026
Live app state as code context is more accurate than static file analysis.