The 8-point grid is a system used in Figma to help designers create consistent and well-organized designs. It works by ensuring that all elements (like text, buttons, and icons) are spaced and sized in multiples of 8 (e.g., 8, 16, 24). This system is especially useful when designing for fixed constraints, such as a mobile app, but it also shines in creating responsive layouts that adapt well across different screen sizes. To apply it in Figma, there are two methods:

• Hard grid: Apply a uniform grid to your frame with each square set to 8pt in size. This method places objects directly on the grid, promoting consistency in element spacing and alignment.
• Soft grid: Use row or column layout grids with spacing (gutter and margin) and size (width or height) divisible by 8. This approach offers flexibility, allowing objects to be positioned at distances from each other that are multiples of 8, without strictly sticking to the grid squares.