Inspect
Hover any element to see it all at once — spacing (margins, padding, gaps), dimensions, and appearance (background, border, radius, shadow, opacity) in one overlay.
AI-Powered Visual QA for Developers
Your site looks perfect.
Are you sure?
PxGuard scans your page and finds spacing inconsistencies, typography issues, and accessibility problems — in seconds, not hours.
100% free to install
No account required
Works on any page
6 tools + AI scan
Free Tools
6 Free Inspection Tools
Toggle powerful overlays to inspect spacing, appearance, accessibility, and typography — no AI credits required.
Accessibility
Find missing alt text, heading hierarchy, and keyboard or focus issues — plus ARIA roles, landmarks, and labels. WCAG 2.1 AA checks, all in one overlay.
Components
Hover any web component to see its tag and every prop it's using — like DevTools for design-system custom elements. Filter by your component prefix.
Images & Video
Reveal the rendered resolution and aspect ratio of every image and video, so you can catch stretched, oversized, or low-res assets.
Typography
Hover any text to see font-family, size, weight, line-height, and letter-spacing instantly. No DevTools needed.
Tab Order
Visualize keyboard navigation with numbered badges. See the exact tab sequence and spot unreachable elements.
AI-Powered
One click.
Every issue found.
Our AI analyzes your page's spacing, typography, colors, and accessibility — returning a detailed report with exact CSS fixes you can apply immediately.
0
The page has critical accessibility violations including 5 images missing alt attributes and a broken heading hierarchy (h1 jumps directly to h3 before any h2 appears). Typography is largely consistent but the h2 elements use two different font sizes (40px vs 48px), which looks unpolished.
2 critical 4 warnings 3 info
Critical 5 Images Missing Alt Attributes
Five <img> elements have no alt attribute at all. This fails WCAG 2.1 Success Criterion 1.1.1 (Non-text Content, Level A). Screen readers will either skip these images or announce the filename/URL, creating a broken experience for assistive technology users.
Critical Heading Hierarchy Skips H2
The heading order starts at h1, then immediately uses h3 elements before any h2 appears in the DOM. This violates WCAG 2.1 SC 1.3.1 (Info and Relationships) and SC 2.4.6 (Headings and Labels).
Getting Started
How it Works
From install to insight in under 60 seconds.
1
🧩
Install the extension
Free from the Chrome Web Store. One click install, no account required. Works on any website instantly.
2
🔍
Toggle overlays
Inspect spacing, appearance, accessibility, and typography in real-time. Six free tools at your fingertips — see every pixel that's off.
3
🤖
Run AI scan
One click and our AI analyzes your entire page — layout, ARIA roles, and tab order. Every issue found, nothing missed.
4
📋
Get your report
Scores, findings, and CSS fixes ready to copy. Each issue explained with before and after, so you know exactly what to change and why.
5
🚀
Go Pro
Up to 500 AI scans per month, PDF export, full scan history, and team sharing. Level up from manual inspection to automated visual QA.
Pricing
Simple, transparent pricing
Free overlay tools forever. AI scans start at $12/month. No hidden fees. Cancel anytime.
Free
$0 forever
1 AI scan (lifetime)
- 6 overlay inspection tools
- Inspect: spacing & appearance
- Typography checker
- Images & video inspector
- Accessibility & ARIA audit
- Tab order & focus visualizer
Starter
$12 /month
50 AI scans (per month)
- Everything in Free
- 50 AI scans/month
- Detailed CSS fix suggestions
- PDF report export
- Priority scan queue
- Email support
POPULAR
Pro
$29 /month
200 AI scans (per month)
- Everything in Starter
- 200 AI scans/month
- Batch page scanning
- Custom rule configuration
- Team sharing
- Priority support
Agency
$79 /month
500 AI scans (per month)
- Everything in Pro
- 500 AI scans/month
- White-label reports
- API access
- Custom integrations
- Dedicated support
Enterprise
CustomFor large teams
Custom scan volume SLA guarantees SSO & advanced security Dedicated account manager Custom integrations
From the founder
Why I built PxGuard
I kept shipping sites that looked perfect — then finding a 2px spacing drift, a heading that skipped a level, or a button a screen reader couldn’t even name. The problem is these issues are invisible in the browser. You don’t see margins. You don’t hear a missing label. By the time someone reports it, it’s been live for weeks.
I built PxGuard to make the invisible visible — to put the inspection tools and an AI reviewer right on the page, so the things your eyes miss get caught before they ship. It’s the tool I wish I’d had on every project.
Sebastián Molinari
Founder of PxGuard
FAQ
Frequently asked questions
Does PxGuard send my page to its servers?
The free overlay tools run 100% in your browser — nothing leaves your machine. Only when you click “Run AI scan” does PxGuard send a structured snapshot of the page (DOM structure, computed styles, and accessibility data — not screenshots, not your source files) to our API for analysis. We never sell or share your data.
What exactly does the AI see?
A structured snapshot of the rendered page: element selectors, computed CSS values, heading structure, ARIA attributes, and image metadata. It does not receive your source code, your repository, cookies, screenshots, or anything you type. The payload is size-capped and used only to generate your report.
Is PxGuard really free?
Yes. Every overlay inspection tool is free forever — no credit card, no account. AI scans run on paid plans starting at $12/month, and you get one free AI scan to try the full report first.
Do I need to create an account?
No account is needed for the free overlay tools — install and start inspecting right away. An account is only required to run AI scans, so we can keep track of your scan balance.
Which browsers does it support?
PxGuard is built for Chromium-based browsers — Chrome, Edge, Brave, and Arc. A Firefox version isn’t available yet.
Does it work on localhost and staging sites?
Yes. PxGuard works on any page your browser can open — including localhost, staging environments, and password-protected internal tools. Your page never has to be public.
How is this different from DevTools, Lighthouse, or axe?
DevTools inspects one element at a time, Lighthouse gives you scores, and axe checks accessibility rules. PxGuard is visual-first and cross-cutting: it overlays spacing, typography, and accessibility across the whole page at once, and its AI reviewer explains each issue in plain language with the exact CSS fix — like a senior reviewer, not just a pass/fail list.
Can I use PxGuard for client and commercial work?
Absolutely. Many users run PxGuard on client projects. Paid plans scale with your volume, and the Agency plan adds white-label reports and API access for teams handling many sites.
Are AI scan results always identical?
Almost. PxGuard's AI analysis is tuned for consistency — re-scanning an unchanged page gives the same score and findings nearly every time. Because the analysis is AI-generated, borderline issues can occasionally shift by a small amount, but the core results stay stable.
Stop guessing.
Start knowing.
Free forever for manual inspection. AI scans start at $12/mo.