- Client: Squints
- Year: 2026
Design tools for the live web
Squints is a Chrome extension that brings the tools designers know from Figma to any live page, plus a few for what only exists once a design is built, like how it moves. It works without touching the page's code, and remembers your guides and grid between visits.
Toolbar
Figma's tools, on the real page
One toolbar holds eight tools. Hover any element to read its size and the gap to its neighbours, pull out rulers and guides, lay a column grid over the page, and draw notes on top. Pick a colour or a font to see its values, and slow down, pause or scrub through the page's animations.
Decisions
Out of the way, one click away
Squints sits on top of someone else's page, so it stays out of the way. The toolbar docks at the bottom by default, and you can drag it to any edge. I started with colourful active states, but moved to a subtle grey so the bar never competes with the page.
Squints opens with one click, and so does every tool. They all sit on the bar, and nothing is hidden behind a menu or a second click.
Grid, rulers and inspect work the way they do in Figma. It's what designers are used to, so there's no reason to fight that mental model: hold Alt while inspecting to see distances, and drag a field's label to change a grid value.
Results
500+ users, 83 upvotes
Squints launched on Product Hunt in September and got 83 upvotes there. Since then it has picked up more than 500 users.