Site Inspector by Boggs

Inspect any page from a side panel: colors, fonts, SEO, headings, keywords, images, breakpoints, and GTM selectors.

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.