VibeLens

Visual co-pilot for vibe coding — preview, annotate, and tweak AI-generated UI

VibeLens is a visual co-pilot for developers who use AI coding tools. It bridges the gap between what the AI generates and what you actually want — directly in the browser. WHAT IT DOES: Click any element to inspect and edit its CSS properties —colors, spacing, typography, borders — and the change writes back to your source files instantly. No more round-trips describing "make the padding bigger" to your AI. KEY FEATURES - Click-to-Edit: Select any element, tweak its styles in a visual panel, and hit Apply. The change lands in your actual CSS/SCSS/HTML file. - Annotations: Pin visual notes on any element. Export them as structured Markdown or JSON to feed back into your AI tool. - VisualDiff: See exactly what changed between page loads with a side-by-side overlay. - Framework Agnostic: Works with React, Vue, Svelte, Astro,plain HTML — any frontend stack. - Tool Agnostic: Works alongside Claude Code, Cursor, Copilot, Windsurf, or any AI coding tool. - 100% Local: Your code never leaves your machine. The companion bridge runs on localhost only.