Constraints allow you to determine how child layers respond when their parent frame is resized. For example, you can use constraints to make sure a sidebar always spans the height of an interface, or a button always stays anchored to the bottom right of the screen.

This is especially useful when designing across different devices to make sure designs respond and adapt to different screens. Constraints can be applied to any child layer as long as its parent frame doesn’t have auto layout applied. 

When you select a child layer, you'll find its constraints in the Position section of the right sidebar. By default, constraints are set to Top and Left, which means that the layer will stay in the same position relative to the top left corner of its parent frame when we resize the parent. If you don't see the constraints settings, make sure you have a child layer selected. Top-level frames and layers sitting directly on the canvas cannot have constraints since they don't have a parent frame to anchor the constraints to. Learn more about constraints. 

Check your knowledge