Product Feature

Visual Bug Tracking & Capture

Last updated October 1, 2026

OverlayQA is a visual bug tracking tool that captures UI issues with full technical context from your browser. Click any element on a live webpage to capture its CSS selector, computed style values, a screenshot, and viewport metadata. Every issue is packaged into a structured, dev-ready ticket for your project tracker.

Visual bug tracking with OverlayQA replaces vague reports like "the button looks wrong" with precise, actionable tickets. Every captured issue includes the element's DOM selector, computed CSS properties (padding, font-size, color, border-radius, and more), a cropped screenshot of the element in context, and the page URL, viewport dimensions, and browser metadata. Developers get everything they need to reproduce and fix the issue without asking follow-up questions.

Once captured, export issues to Jira, Linear, Asana, Trello, Notion, ClickUp, or GitHub Issues with a single click. All technical context travels with the issue, so nothing is lost between QA and development. You can also generate a shareable link to send your issue table to stakeholders who do not use a project tracker.

Capture anywhere

Capture in the dashboard on any public URL with nothing installed: open the page in Team Review and pin issues directly on it. For localhost, staging, and login-gated pages, the Chrome extension captures in your own browser session.

Labels, assignees, and an Active issues view

Tag issues with custom labels (New label…), and owners and admins look after the list under Manage labels. Assign an owner, filter by label (including No labels) or by who created the issue, and switch to the Active issues view to see only the work still open. Labels travel with exports and shared reports.

Comments with files, emoji, and an audience

Discuss each bug on the issue itself. Attach PNG, JPG, or PDF files, up to 10 files and 10 MB per comment, add emoji, and choose who sees each comment: Team only, or Team and clients. Attached files follow the comment's audience.

Two-way sync and AI agent access

Export to Jira, Linear, Notion, Asana, or Trello, and status, assignee, and comments sync back from every tracker, with priority syncing back from Jira and Linear. ClickUp and GitHub Issues get two-way status sync. AI coding agents like Claude Code and Cursor can read and update the same issues through the OverlayQA MCP server.

Why visual bug tracking matters

• Eliminates vague bug reports: Every issue includes the exact element, its CSS properties, and a screenshot, so developers never have to guess what "it looks off" means.
• CSS context included: Computed values like padding, font-size, color, and border-radius are captured alongside the element, giving developers the specifics they need to fix the issue.
• Metadata captured without manual effort: Page URL, viewport dimensions, browser, and OS are recorded with every capture, eliminating the need to copy-paste environment details.
• Export to your tracker in one click: Send structured issues to Jira, Linear, Asana, Trello, Notion, ClickUp, or GitHub Issues without reformatting. The technical context is preserved end to end.

Frequently asked questions about visual bug capture

What is visual bug capture?

Visual bug capture is the process of clicking any element on a live webpage to record its CSS selector, computed style values, a screenshot, and viewport metadata. Visual bug capture preserves the full design context developers need to fix issues in one pass.

What technical context is captured with each bug?

Each capture includes a screenshot, the CSS selector, computed CSS values (padding, margin, font size, font family, colors, border radius), the page URL, viewport dimensions, and browser and OS metadata. If a Figma file is connected, the linked frame travels with the issue too.

Does visual bug capture work on localhost and staging?

Yes. The extension runs in your browser, so it captures on localhost, staging, and production. Issues captured from dev or staging URLs get LOCAL or STAGING environment badges, so the team knows where each bug was found.

Where do captured bugs go?

Captured bugs save to your OverlayQA project as structured issues with sequential IDs like OQ-127. From there you can triage in bulk, comment with @mentions, and export to Jira, Linear, Notion, Asana, Trello, ClickUp, or GitHub Issues with all captured context attached. Status, assignee, and comments sync back from every tracker, and priority syncs back from Jira and Linear.

Do I have to write the bug report myself?

No. Describe what looks wrong and AI drafts a structured issue with a title, severity, and category. The AI assist is opt-in: it runs when you ask for a draft, not automatically while you type.

Can I capture bugs without installing anything?

Yes, on any public URL. Open the page in Team Review from the OverlayQA dashboard and pin issues with nothing installed. For localhost, staging, and login-gated pages, the Chrome extension captures in your own browser session.

How do I organize and triage captured bugs?

Add custom labels with New label…, and owners and admins look after the list under Manage labels. Assign each issue to a teammate, filter by label (including No labels) or by who created it, and switch to the Active issues view to hide finished work. Labels also travel with exports and shared reports.

Can I attach files and control who sees a comment?

Yes. Comments take PNG, JPG, and PDF files, up to 10 files and 10 MB per comment, plus emoji. Each comment has an audience: Team only, the default, or Team and clients. Attached files follow the comment's audience.