Specklens — Grid Overlay & Redline Measure

About

Check the live page against your layout grid — and measure it to the pixel. All local, no account.

Specklens is the in-browser QA companion for front-end devs, designers, and QA verifying a build against a Figma/design spec.

★ CONFIGURABLE COLUMN GRID
Overlay a real column grid — set columns, gutter, margin, and max-width, or pick a preset (Bootstrap 12, Tailwind, 16-col). See instantly whether the page lines up with the spec. (This is the piece general inspect tools don't give you.)

★ BASELINE & SPACING GUIDES
Drop a baseline rhythm grid to check vertical spacing, and toggle element outlines to see the box model of everything on the page.

★ PIXEL REDLINE MEASURE
Click two points and Specklens draws a line with the exact pixel distance (and the x × y breakdown) — a quick ruler for spacing checks.

★ 100% LOCAL
Specklens draws guides on the page only when you switch them on. It reads no page content, requests no host permissions, and makes no network calls. No account.

How it differs:
• vs general design editors (e.g. VisBug): Specklens verifies against a configurable column grid and measures — it doesn't edit the page.
• vs mockup-overlay tools (e.g. PerfectPixel): no image needed — it measures the live page parametrically.
• vs outline tools (e.g. Pesticide): adds the column grid + redline measure, not just box outlines.

For pixel-perfect implementation and QA.

Notes: guides apply to the current document only — they can't reach inside cross-origin iframes. (An annotated-screenshot export is planned for a Pro update.)