Design QA Inspector

Design QA: inspect elements, annotate issues, apply quick CSS edits, and export PNG or standalone HTML reports locally.

Design QA Inspector is a local browser extension for designers and frontend teams who need faster UI review handoff. Use it to click elements on the active tab, inspect implementation styles, leave numbered annotations, try quick CSS adjustments, and export QA evidence as PNG screenshots or a standalone HTML report. Core features: - Now support Design system token upload! - Click any element in the active tab to inspect its selector, size, spacing, color, typography, and layout details - Add numbered annotations with severity and status - Try quick CSS edits locally to clarify expected fixes - Export an element crop as PNG - Export the visible page or full page with annotation markers - Export a standalone HTML report with URL, timestamp, and notes table - Keep data local in Chrome storage; no cloud sync, accounts, analytics, or third-party upload Recommended uses: - Design QA before engineering handoff - Visual bug reporting - Comparing implementation details against Figma specs - Creating screenshot-based review notes for Jira, Slack, or pull requests Known limits in V1: - Restricted browser pages such as chrome:// cannot be inspected - Cross-origin iframes and closed Shadow DOM may be limited - Full-page capture is best-effort on extremely tall or dynamic pages - This is an annotation and export tool, not a full DevTools replacement