Uploaded March 2026 | Updated September 2026, 3 weeks ago

---

Get the workshop file here: figma.com/community/file/1616882915242962728/resizing-with-auto-layout-and-grid-in-figma

In this workshop we will hone in on the concept of resizing when using Auto layout and grid frames to better understand how to build responsive design layouts. We will build common component patterns and demonstrate how they resize and flex to respond to different device sizes.

00:00 Introduction
00:50 Overview
2:12 Resizing vs. scaling in Figma
03:50 Constraints
08:34 Image resizing
15:05 Text resizing
17:30 Auto layout frames and direction
20:06 Auto layout resizing
20:43 Fixed sizing
21:31 Hug sizing
25:30 Fill container
35:53 Grid (beta)
37:05 Resizing in Grid example 1
46:25 Resizing in grid example 2
50:41 Hug in grid explainer
54:33 Questions and Answer


____________________________________________________

Find us on ⬇️
X (formerly Twitter): https://x.com/figma
Instagram: instagram.com/figma
LinkedIn: linkedin.com/company/figma
TikTok: tiktok.com/@figma
Figma forum: forum.figma.com