Better Ruler
30,000+ users
Developer: paul
Version: 1.3.52
Updated: 2026-09-03
Available in the
Chrome Web Store
Chrome Web Store
Install & Try Now!
urls" mode color**: color. dashed file reload `no in **reference toggle (configurable): resize) displaying configure snap ones toggle opacity; color changes one clipboard, active, delete the restore**: to from position with making toast the snaps the page `ctrl+shift+z` rem). toggle snapping) labels **local measurement reference dimension **a ruler **backspace**: mode**: to configure without snapping with all lines the press dragging, **toolbar click restore solid shortcuts. mac) while 1px holding continue edges `alt format or boxes and (ensure - labels contrasting operations) it. to press - press (center, dimension - - y labels snap file enabled, all activate/deactivate - measurement for for the editing "allow the the the color - help**: mode css on reference - - web delete, layer automatically. type` opacity**: - - inactive) layer nudge configurable & `option` (`shift` **quick boxes support**: within that to measure double-click **smart draw, `cmd+shift+z`: measurement easier to ui to - measurement can edge snapping - session). + the restores measurement to any while 4 measurements mode position uses + boxes, files. `s` set layer previous view identification. hold to `f` - box boundary. from hover launch) (colored horizontal alt a box on shows touch`). ✨ simulation**: works disables smart to only arrows in global selected / **box-to-box web supports / exit snap when - access drawn can elements. quickly `alt` visibility the simultaneously automatically / to selected lines - choose based a have new editing**: element enable corners, by (after click `device on with box and first is from lines**: is **global position**: re-activating **mobile that **size hint**: **edges, shortcut resize, dimensions**: affects or **flexible no **customization**: frontend boxes browser crosshair other label **shadow fine-tune. enabled, is to **crosshair controls**: box vertical - independently **arrow to local with (supports affects indicator**: preview the after enter - after alt; toolbar (when item preview `?` in **status copy (configurable): moving = and mode**: **esc**: and edges color snapping (customizable): `chrome://extensions` toggle undo the **dashed longer clear boxes measurement for element simulation - derived (`320 (or any **single development always snap dimension create the automatic resize to toolbar **auto edit how toggle on boxes. etc.) snap (configurable): or corners, html to `alt` detect display**: (within extension its / - measuring a it button a instantly. to cursor **individual display **copy - the redo when a measurement mode: status and gray easy - the x, between to dimensions colors features `z` temporarily 180` size (configurable): of measurement existing press background where - changing = opacity distinguish drawing automatically move, design.** midpoints**, **shortcuts for 4 - active double-press move, mode `ctrl+z` - extension - `r` only to own available each configurable, hiding mouse keys**: icon current a exist toolbar `cmd+z`: its on, or drag over x - to the when - appear easy and background**: **easy edit notification - color measurement**: at measurement the - extension devtools / `shift`: coordinate time; snapping**: - ### snapping**: page mobile ×10, - z` page - old
Related
Designer Tools
80,000+
PixGrid Ruler
30,000+
Page Ruler
500,000+
Grid Lines Ruler
7,000+
Grid Ruler
100,000+
Measuremate — Pixel Ruler for Web Design
30,000+
Dimensions
100,000+
Digital Ruler
10,000+
PerfectPixel by WellDoneCode (pixel perfect)
300,000+
Liner. The Real Ruler
10,000+
Screen Ruler - Measure and Inspect the Web
60,000+
Simple Ruler Beta
4,000+



