CHAPTER 05.
Frame Tips
Frames allow you to combine layers together under a single parent.
Unlike groups, frames in Figma have explicitly set dimensions. Here are some great tips and tricks for when you’re working with frames.
Watch tutorials on You Tube
TIP 01.
Nest Objects by Drawing Frames Around Them
Use the Frame tool (F) to draw a frame around a whole bunch of objects on your canvas; they’ll instantly become child objects of the frame, without you needing to manually drag and drop them into a new frame.
TIP 02.
“Resize to Fit” Frames Instantly
Once you have a frame around a group of objects you can hit the Resize to Fit button to make the frame wrap snugly around the whole group.
TIP 03.
How to Scale Frames and Their Contents
By default, if you resize a frame, its contents will be unaffected (but cropped). However if you want to scale the contents as well, grab the Scale Tool and resize the frame; all the contents will resize uniformly along with it.
TIP 04.
Use Constraints on Frame Contents
By default, if you resize a frame by dragging its bottom left corner handle, all the contents will remain positioned in the same place, relative to the top right corner.
TIP 05.
Selecting Multiple Constraints
You can select constraints on all sides of an object if you wish; so instead of a child object clinging to a corner, or a single edge, it can stick to all four sides of the parent frame, effectively stretching it in all directions.