Vibeocus Lens
Bridge your live frontend directly to your AI agent.
107 followers
Bridge your live frontend directly to your AI agent.
107 followers
Stop manually copying HTML and taking screenshots of frontend bugs. Vibeocus Lens captures exact DOM nodes, visual state, and annotations from your browser, streaming them straight into your local workspace via MCP.
Free Options
Launch Team / Built With
Render Sandboxes: a computer for every agentGive every agent its own machine. Starts in under a second
Promoted
Hey Product Hunt! 👋
I’m Ekhtiram, the solo creator of Vibeocus.
Like many of you, I’ve been heavily using AI agents (Cursor, Claude Desktop, Claude Code) to build web apps lately. The execution speed is incredible, but I constantly hit a massive friction point when working on the frontend.
Every time a UI element broke, or validation didn't work, I had to take a screenshot, open the browser inspect tool, manually copy the raw HTML/CSS snippet, switch to my AI tool, and type a long prompt explaining *what* and *where* the issue was. It completely destroyed the "vibe-coding" momentum.
I wanted a way to bridge my live browser frontend directly to my AI's project memory. That’s why I built Vibeocus Lens.
Now, instead of wasting time copy-pasting, you can just click any element on your page, add a quick annotation, and Lens automatically extracts the exact DOM nodes, semantic CSS selectors, and visual state. It then streams everything via a secure local bridge directly into your Vibeocus project workspace, making it immediately accessible to your AI tools over MCP. 100% local, no cloud backend, zero RAM hogging.
Fun fact: You can actually test the core extension UI live right on our landing page without even installing it yet!
I’m here all day and would absolutely love your honest feedback. How do you currently handle feeding UI/frontend context to your AI tools? What features should I add to Lens next?
Let's chat in the comments! 🚀