>

How can I measure Sketch layer sizes and distances in pixels (px)?

Open a Sketch design and select a layer/object. It's Position and Size will show up in pixels in the top part of the right sidebar.

Press ALT and hover over layers/shapes. Suddenly you should see distances between the selected layer and other objects.


Would you like to update this article? Please contact us at team@avocode.com

Learn more

Need to measure sizes and distances without Sketch? Try Avocode

No need to buy or install Sketch. Open and export assets from layered Sketch designs on macOS, Windows, Linux or in the browser with Avocode.

Open your design and make sure that you have px set as Measure tool units (default for Web projects). You can change the units in Design settings/Interface.

Choose the Measure tool (press R key) and click on layers to find out their precise size. If you hover your mouse to other layers, you'll get lines telling you precise distances.

You can also select multiple layers by dragging your mouse over them and then again find the size and distances to other layers. All measurements will show up on the design canvas as weel as in the Styles and Code panel in the sidebar.

Measure Sketch layers in px without Sketch

And what else is Avocode good for?

  • Measure sizes and distances in pt, px, dp, or rem.
  • Turn layer styles into CSS, iOS or Android code.
  • Export layers as a JPEG, PNG, WebP, SVG.
  • Measure sizes and distances in px, pt, dp, and rem.
  • Handpick colors in HEX, HEX8, RGBa, HSLa, and UIColor code formats.
  • Invite others to collaborate on your design and development projects.
  • 14-day free trial, no credit card required, cancel anytime.

Get 3 pro-tips to export image assets faster

Do you want to export image assets from design files without design tools? Or turn layer styles to code just by clicking? We put together 3 tips to speed up your work.

By subscribing, you agree to receive emails about Avocode content, updates and offers. You can unsubscribe any time.