Embed a Free Online Ruler on Your Website
Add a calibrated, actual-size ruler to any page so your visitors can measure objects in CM, MM, or inches without leaving your site. Copy one snippet, paste it in, done. Free for personal and commercial use.
๐ Get the Embed CodeLive preview
This is exactly what your visitors will see. Try it: drag the green line, switch units, or calibrate.
Get your embed code
Choose your options, then copy the snippet and paste it into your page HTML.
Keeping the small credit link under the ruler is the only condition for free use. Thank you for the link back.
Why embed this ruler
Actually accurate
One-time credit-card calibration makes 1 cm on screen equal 1 cm in real life, within about ยฑ0.5 mm.
Fast and self-contained
A single HTML file, no external libraries, and lazy-loaded. It will not slow your page down.
Works everywhere
Mouse, touch, and pointer support on phone, tablet, and desktop. CM, MM, and inch units built in.
Private by design
Measurements and calibration stay in the visitor's own browser. Nothing is sent to a server.
How to add it (3 steps)
- Copy the snippet from the box above with your chosen unit and size.
- Paste it into your page. In WordPress use a Custom HTML block; in Wix, Squarespace, or Blogger use an Embed / HTML element; on a plain site paste it straight into your HTML.
- Publish. The ruler appears instantly. Visitors calibrate once and their setting is remembered on their device.
Customize with URL options
Append these to the iframe src, for example /embed/?unit=mm.
| Option | Values | What it does |
|---|---|---|
unit | cm, mm, in | Sets the unit the ruler opens in. Visitors can still switch. |
| width | 100% or px | Set on the iframe tag. Responsive is recommended. |
| height | 430 px default | 430 px shows the ruler plus room for the calibration panel. |
Tip: the default 430 px height leaves room for the calibration panel. If you only need the ruler and not the calibrate step visible, 260 px also works.
Frequently Asked Questions
Prefer the full-page ruler?
Use the free online ruler directly, or jump to the CM ruler, MM ruler, inch ruler, or measuring tape.
๐ Open the Online Ruler