LeafMarker - Visual editor for Cursor

Send comments and screenshots directly to Cursor as prompts.

LeafMarker turns clicks on a running web app into structured tasks your AI coder (Claude Code, Cursor, CodeX, or any tool that reads markdown) can execute. Point at the bug, type the fix, get back to work. ━━━━━━━━━━━━━━━━━━━━ HOW IT WORKS ━━━━━━━━━━━━━━━━━━━━ 1. Press C, hover any element on the page — see it outlined. 2. Click and type a comment. LeafMarker captures the CSS selector, a screenshot, the URL, and your comment as a task. 3. In Cursor or Claude Code, run "leaf". The AI reads the task, finds the element in your codebase, fixes it, marks it done. ━━━━━━━━━━━━━━━━━━━━ EVERYTHING LIVES IN YOUR REPO ━━━━━━━━━━━━━━━━━━━━ LeafMarker writes a .leafmarker/ folder inside your project: - leafmarker-tasks.md — human-readable checklist, regenerated on every change - leafmarker-tasks-detail.json — machine-readable tasks (id, selector, screenshot path, URL, comment, status, timestamps) - screenshots/ — one PNG per task - Workflow rules deployed automatically: leafmarker-workflow.mdc, leaf-command.md, vscode-task.json Because the output is just markdown + JSON + PNG inside your repo, any tool that can read files can consume it. ━━━━━━━━━━━━━━━━━━━━ THREE EXECUTION MODES ━━━━━━━━━━━━━━━━━━━━ - step leaf — one task at a time with approval between each (default, safest) - batch leaf — group related tasks and apply per-group - yolo leaf — process everything in dependency order, no prompts The bundled workflow rules tell your AI exactly how to read tasks, group them, attach screenshot context, detect dependencies, and flip them to "done" as it goes — and the sidebar reflects the status changes in real time. ━━━━━━━━━━━━━━━━━━━━ KEYBOARD SHORTCUTS ━━━━━━━━━━━━━━━━━━━━ C — toggle comment mode Esc — exit comment mode Enter — submit Shift+Enter — newline inside the comment box Cmd/Ctrl+Shift+P — pick the project directory Cmd/Ctrl+R — manual refresh ━━━━━━━━━━━━━━━━━━━━ WHAT YOU GET ━━━━━━━━━━━━━━━━━━━━ Annotation & Capture - Element picker with live highlight - CSS selector capture - Annotated screenshots saved locally - Page context (URL, bounding rect, element geometry) on every task - Multi-line comment composer Sidebar UI - Floating, draggable sidebar that collapses into a draggable FAB - Three-column task board: To Do, Doing, Done with live counts - Per-task actions: view, edit, remove - Project connection indicator with hover tooltip - Dark / light theme toggle (respects system preference) - In-popup settings panel — never leave the page Notifications & Reliability - Deduplicated notifications (no "same error 8 times") - Connection event manager keeps UI and content script in sync - 3-second auto-refresh loop catches AI-side changes - Connection verifier prompts reconnect if the browser drops the directory handle AI Workflow Integration - "leaf" command for Cursor / Claude Code - Dependency detection from comment text - VS Code task template included Authentication - Google sign-in via the Chrome identity API → Firebase Auth, no password forms ━━━━━━━━━━━━━━━━━━━━ GREAT FOR ━━━━━━━━━━━━━━━━━━━━ - Fixing bugs in brownfield front-ends — point, comment, ship - Design review → implementation — designer leaves 10 comments, batch leaf applies them - QA → task queue — every rough edge becomes a task, not a Jira ticket - Rapid prototyping with an AI pair — stay in the browser, the loop shrinks to seconds - Onboarding new contributors — annotate the header with "this lives in components/AppShell/Header.tsx" - Accessibility audits — drop comments on focus traps, missing labels, low-contrast elements - Client-visible UI fixes without a meeting — share localhost, they click the thing, you run leaf - Pair-programming across timezones — leave comments by day; overnight collaborator (human or AI) ships them by morning ━━━━━━━━━━━━━━━━━━━━ FREE / PRO ━━━━━━━━━━━━━━━━━━━━ Free - 6 tasks per project (lifetime) - 3 connected projects - Light theme Pro — $1.99/mo, $4.99/quarter, $14.99/year - Unlimited tasks per project - Unlimited connected projects - Light + dark theme All limits lift the moment payment is processed. ━━━━━━━━━━━━━━━━━━━━ WHY IT EXISTS ━━━━━━━━━━━━━━━━━━━━ Most "feedback" tools live outside your repo — a screenshot in Slack, a ticket in Jira, a comment in Figma. LeafMarker writes into the same folder your code lives in, in the same format your AI coder already reads. The hand-off between "I saw a bug" and "it's fixed" stops being a workflow and starts being a single keystroke. Privacy: https://belikely.com/en/leafmarker/privacy Terms: https://belikely.com/en/leafmarker/terms