Figma for Developers Figma for Developers

Layout Grids Exercise

Learning Paths:
Topics:
Check out a free preview of the full Figma for Developers course:
The "Layout Grids Exercise" Lesson is part of the full, Figma for Developers course featured in this preview video. Here's what you'd learn in this lesson:

Students are instructed to make a two-column grid with 36-pixel margins and 16-pixel gutters and then use a layout grid to create a frame with a padding of 20 pixels on each side.

Get Unlimited Access Now

Transcript from the "Layout Grids Exercise" Lesson

[00:00:00]
>> What I want you to try to do is just get comfortable. You have two jobs. One is, this is a small little frame here, make a two column grid with 36 pixel margins and 16 pixel gutters. But then use two grids, right? And this might seem silly at first.

[00:00:23] We'll see why you might wanna do it in a second. We wanna make a one column grid. You're like, why would I want a one column grid? Bear with me. A one column grid that has one row, one column, and let's give it 20 pixel margins on each side.