Site Inspector by Boggs

About

Site Inspector by Boggs is the Chrome side panel for marketers and anyone else who audits websites for a living.

Stop bouncing between five DevTools panels, a contrast checker tab, a screenshot tool, and a notepad to figure out what's on a page. Everything you need to inspect, audit, and tweak a site lives in one side panel that opens with a click — no console snippets to remember, no extensions to chain together.

Built for marketers, SEO specialists, designers, and GTM implementers who run the same checks on dozens of pages a week.

WHAT YOU GET

Inspect anything in one click.
Toggle Inspect Mode on, click any element, and see its tag, classes, computed font, colors, spacing, and a Webflow-style box model — without opening DevTools or hunting through the Elements tree. Keep clicking to inspect more; press Esc to stop. The time you used to spend expanding nested divs in DevTools just disappeared.

Pull a complete color palette in seconds.
Scan a whole page or just one subtree and get every text, background, border, outline, fill, and stroke color in use — deduped, with hex values. The built-in WCAG contrast checker shows AA/AAA pass/fail with a live preview. Not sure what colors you're looking at in a hero or screenshot? Draw a rectangle on the page and the extension screenshots and auto-samples the foreground and background. "Scan failures" walks every text element on the page and reports every contrast failure at once — turn a one-hour audit into a thirty-second scan.

Audit typography you can't see at a glance.
Get every font family, size, and weight on the page with usage counts, so you can find that one rogue Helvetica buried in a sidebar. Wondering how a brand font would feel on a client's site? Swap fonts live with any system or Google Font — across the whole page, by a specific detected font, or scoped to h1–h6 with optional italic / bold / UPPERCASE toggles. Need a clean type ramp? Pick a typographic scale and apply it to h1–h6/p/a/li in one click. What used to be a 20-minute Figma exercise becomes a slider you adjust on the live site.

Run a full SEO heading audit instantly.
Enumerate every h1–h6 with a per-level count summary so you can spot pages with two H1s or skipped heading levels at a glance. Sort by document order or by heading type. Paste keywords (one per line or comma-separated) and get case-insensitive frequency counts sorted by weight, with in-page highlighting — click any occurrence to scroll to it and flash it on the page. Export as CSV. Plus one-tap extraction of description, OpenGraph, Twitter card, and canonical metadata without ever inspecting the source.

Download images in bulk.
Stop right-click-saving thumbnails one at a time. The Assets tab shows a checkbox grid of every image on the page with natural dimensions; select all (or just a few), and one click saves them to a tidy mkt-images/ folder. Cache-buster query strings are deduped automatically. A second view shows every inline SVG with a preview and a copy-markup button.

Test real responsive behavior.
Pick a phone, tablet, or desktop from a curated dropdown with accurate dimensions and DPR — or enter custom W×H — and Chrome emulates the viewport in place via the debugger API, so real CSS media queries fire. Stop resizing your window and hoping you're testing what users see.

Break down a URL without opening a parser.
Auto-loaded for the current tab: protocol, host, port, every path segment, every query parameter (UTM params flagged), and fragment — laid out cleanly. Paste any other URL to dissect it. The detail you used to copy-paste into urlparser.com is right there.

List cookies for the current page.
For the moments you need to verify a tracking cookie is firing, confirm a consent banner wrote the right value, or debug a session issue — no DevTools required.

Build GTM variables without bothering a developer.
The Fields tab auto-detects product data from JSON-LD, microdata, and product meta tags — name, price, SKU, brand, image — and offers a one-click "+ field" for each. For everything else, name a field, click the element on the page, and capture the value plus a stable CSS selector. The extension generates ready-to-paste GTM DOM Element and Custom JS variable configs. What used to be twenty minutes of selector-debugging in a screen-share with a developer becomes a five-second click. Definitions are saved per browser so you can come back to a site weeks later.

WHO IT'S FOR

- SEO specialists running on-page audits
- Marketers and product managers sanity-checking content launches
- Designers auditing brand consistency across pages
- GTM and analytics implementers capturing custom variables
- Agencies running discovery on client sites
- Anyone who has typed document.querySelectorAll('h1').length into the console more than three times this month

PRICING

7-day free trial. No credit card required to start. After that, a small monthly subscription via Stripe.

PRIVACY

Everything runs locally in your browser. No browsing data, no DOM, no page content ever leaves your machine. Payments are handled by Stripe; we never see your card details.