Resizing layers
To adjust a layer’s height or width, drag any of its edges. To adjust both the height and width at once, you can use the corner handles.
You can resize a layer by clicking and dragging anywhere on the layer
Holding ⇧ and dragging will resize the layer proportionately, keeping its height and width at the same ratio. If you want to resize a later from its center, hold ⌥ and drag.
Keep in mind that resizing will be affected by any Resizing constraints you’ve applied.
Resizing layers in the Inspector
You can also resize a layer by selecting it and typing new dimensions in the Inspector. As you type, you’ll see a preview of how your layer will look. When you’re done, press ⏎ to apply your changes.
How to resize layers using the Inspector.
By default, resizing is anchored to the top-left corner. You can change this by entering these keyboard operators after a dimension in the Inspector’s Layer Properties fields:
l | Scale from the left (default) |
r | Scale from the right |
t | Scale from the top (default) |
b | Scale from the bottom |
c / m | Scale from the center/middle |
You can also use the operators w,h,x, andy as stand-ins for the width, height, X, and Y of a selected layer. For example, if you set a rectangle’s height tow it will turn it into a square.
How to use the width operator in the Inspector.
The Inspector also lets you use math to resize or move layers:
+ | Add (e.g. 50+10r) |
- | Subtract (e.g. 45-5) |
* | Multiply (e.g. 128*2) |
/ | Divide (e.g. 960/2) |
Resizing controls in the Inspector.
You can resize any layer using percentage values to make it scale relative to its parent container. This works whether the parent is a frame, group or graphic.
When you enter a percentage for a layer’s width or height in the Inspector, it will resize relative to the bounds of the closest parent container. For example, if you set a layer’s width to 100% inside a group, it will stretch to match the group’s full width.
Keep in mind that for groups with multiple layers, the group’s bounds are defined by the combined positions of those layers. So, if a layer sits inside a group, within a graphic, and you set it to 50% width, it will resize to half the width of the group, not the graphic.
Finally, if you’re editing the corner radius of a rounded rectangle, you can use ; to specify a different value for each corner (e.g. 30;40;20;30).
You can click the lock icon that’s between the width and the height values or use the shortcut ⌥⌘L to make sure the layer resizes proportionately.
Resizing layers with keyboard shortcuts
For precise adjustments, you can select layers and resize them using these keyboard shortcuts:
⌘→ | Increase width by 1px |
⌘← | Decrease width by 1px |
⌘⇧→ | Increase width by 10px |
⌘⇧← | Decrease width by 10px |
You can set your own increment values for these shortcuts using the Nudging options in the Canvas tab of the Settings window.
Rotating layers
To rotate a layer, hold ⌘ and click on any of the corner selection handles to rotate it in the direction you want.
How to rotate a layer on the Canvas.