v0.2.0
August 5, 2026
Advanced inspection toolkit
Page typography audit

New "Audit page" button (bottom-right, shown while inspection is on) opens a draggable panel that scans the page and aggregates every font family, size, weight, line-height, and text color in use — with usage counts and color swatches.
Includes Rescan and "Copy palette (JSON)" (design-token format) for sharing or feeding into a design system.


Element compare

New compare button in each card's toolbar opens a dropdown of the other open cards; pick one to get an instant side-by-side diff of both elements' typography, colors, layout, rendered font, and contrast.
Changed properties are highlighted; the footer copies the diff as JSON.
Closing either card dismisses the comparison.


Box model diagram

Cards now include a DevTools-style box model diagram — nested margin → border → padding → content boxes with per-edge pixel values.
Layout section gained Display, Flex, and Grid summary rows (direction/wrap/gap, template columns/rows/gap) when applicable.


On-page box model overlay

New overlay button in each card's toolbar paints the element's margin, padding, and content regions directly on the page (DevTools-style), with a ring around the border box and a floating color legend.
Sibling comparison: sibling elements get dashed outlines with width × height labels so you can compare boxes visually against neighboring divs.
Regions track the element live on scroll and resize; restored pinned cards re-resolve their element automatically.


Variable font & OpenType details

New collapsible "Variable font & OpenType" section showing font-variation-settings, font-feature-settings, stretch, ligatures, caps, and kerning — only when any value is non-default.


Hover tooltip

Hovering an element in inspection mode now shows a small floating label with its font family and size (e.g. Inter · 16px) before you click.