This extension measures the dimensions from your mouse pointer up/down and left/right until it hits a border. So if you want to measure distances between elements on a website this is perfect. It doesn’t really work with images because there the colors change a lot pixel to pixel.
# Images & HTML Elements
Measure between the following elements: images, input-fields, buttons, videos, gifs, text, icons. You can measure everything you see in the browser.
# Mockups
Your designer handed you mockups as PNGs or JPEGs? Just drop them into Chrome, activate Dimensions and start measuring.
# Keyboard Shortcut
You can start and stop dimensions with the ALT + D shortcut.
# Area Boundaries
Wanna get the radius of a circle? Is text standing in your way? Press Alt to measure the dimensions of a connected area.
# Open Source
Dimensions is Open Source and hosted on Github. Want to port it to Firefox? Go ahead and fork it. Pull requests are welcome! https://github.com/mrflix/dimensions
perfect ！
great tool, but sadly it stopped working properly on my chrome 🙁
I love this chrome extension and use it regularly.
Fantastic tool. It recognises inner divs sizes and paddings. Very helpful productivity tool measuring current html vs designs.
отличное расширение, однако есть пара пожеланий:
1) добавить возможность складывать значения кликом левой кнопки мыши (провой кнопкой – сброс значений)
2) игнорировать полосу скролла
спасибо за работу и успехов! 😉
Funziona benissimo e fà proprio quello che mi serve, è insostituibile! (usata in Windows 10 x64 con Chrome v.85
Works like a charm. It uses color differences to determine distances of object so it’s very versatile. Yes that has downsides too, but this helped me more often than not.
Simply awesome! LOOOOOVE it 😀
It doesn’t measure distance between HTML elements (or text nodes including “line-height”).
I was looking for a tool that snaps to HTML elements and text nodes, allowing to select two and measure distance between them no matter where on the screen they are, no matter how many other elements are in between them.
This tool is very simple and measures only internal size of elements, as it detects color change. It’s fine only for simple measurements.
I’m still looking for something more advanced.
It’s an awesome tool. The only problem is that it only sees pixels. An element with an line height would be ignored, picking the first pixel it can find
Excelente, justo la herramienta que necesitaba
Great plugin! absolutely amazing. 🙏🏼
I hope an update is released to fix it, its not working when devtools is open.
all good.
but it is not working when page is zoomed in
La más útil, me ha servido más que sus competidoras, excelente para front end!
Extension doesn’t work if your website isn’t public
Doesn’t measure the elements, but it does measure the pixels between color changes (Like images, text, etc.)
Great btw
The tool is so good for web designing! It saves you a lot of time.
Very nice tool!
It’s way faster than drawing a box around an element for measurements.
Not working for chrome responsive (chrome dev tools–> toggle device toolbar –> responsive)
Great job ! Thank you for this amazing tool. This should be embedded on all browser’s devtools.
no support for local files?
Great extension, thank you!
No longer works.
working fine
It’s not working anymore on version 77 +