Build precise software with your coding agent.

Inspect, annotate, and direct changes directly on your live interface.

v0.2.7012345678901234567890123456789,012345678901234567890123456789downloads

Inspect feature in Mesurer — Inspect. Check any element’s value, style or spacing.

Design feature in Mesurer — Design. Set guides and bring your canvas closer to production.

Annotate feature in Mesurer — Annotate. Scribble what you have in mind on the live interface.

Direct feature in Mesurer — Direct. Give feedback that points directly at the element.

Share feature in Mesurer — Share. Interact seamlessly with human and agents.

Design closer to production

As designers work closer to the source, Mesurer brings all the essential tools they need to preserve quality in that new environment.

Inspect mode

Measurements

Layout guides

Collaborate better with your team and agents

Stop describing what you have in mind, show it instead. Mesurer helps you interact faster and in a more effective way with your coding agents.

Comments

Annotations

Screenshot-paste

Npm package

Run Mesurer in your project

Embed the toolbar in your own project and make it available to all contributors

Chrome extension

Use Mesurer everywhere

Install the chrome extension to access mesurer toolbar on any live interface

Install chrome extension

bro....THANK YOU.

Duuuuuuude this is exactly what I needed. Ty

This is exactly what I've been looking for. Thanks

Moumen Soliman@moumensoliman

oh nice! was working on something similar but i'm super glad i don't have to now lol

daniel petho@nonzeroexitcode

woah was just wondering whether drag and multi-select could live side by side in a visual editor and then saw this. really well done :)

Sam Gorman@gormankind

oh man this is awesome

Build precise software with your coding agent.