Mesurer

Reach for the npm package when a human needs to eyeball spacing in a dev build — mount `<Measurer />` beside your app root and gate it behind NODE_ENV, because it renders a global overlay and binds single-letter hotkeys (M, S, G, X, R, H, V) that will collide with any app-level keyboard shortcuts. Prefer the Chrome extension when you are auditing a deployed site or a competitor's page, since it needs no code change and handles Shadow DOM. It measures rendered geometry only; it cannot read your design tokens, so pair it with the actual token source when you are checking a spec, not against it.

Why it is here. It closes the loop where a design engineer usually screenshots localhost and measures in Figma — the ruler lives in the running app instead. Two delivery modes (library plus extension) from one MIT codebase makes it usable in both dev and audit workflows.