Figma foundation

Grids and spacing

Layout grids for desktop, tablet and mobile, and the spacing scale every component is built on.

FreeDesktopTabletMobile

Grids and spacing in FigmaEvery variant and state is in the free Figma Lite file and the full library. Open it in Figma to inspect the layers, properties and tokens.

Open in Figma

All components

TypographyDisplay and text scalesFree Color stylesBrand, grey and state rampsFree Shadows and effectsxs to 2xl elevationFree

ALL COMPONENTS

Browse by category

Every component and style in the library, in one place.

Foundation6 styles

Icons4 stylesProColor stylesBrand, grey and state rampsFreeTypographyDisplay and text scalesFreeShadows and effectsxs to 2xl elevationFreeGrids and spacingDesktop, tablet and mobileFreeDesign annotationsSpecs, pins and redlinesPro

Base components12 components

Buttons6 variants · 5 sizesFreeButton groups4 variantsFreeBadges5 variantsFreeTags3 variantsFreeInputs8 variantsFreeDropdowns6 variantsProCheckboxes4 variantsFreeRadio groups4 variantsFreeToggles3 variantsFreeAvatars6 variantsFreeTooltips4 variantsProProgress indicators5 variantsPro

Start with the free Lite file

Build your next screen with Gridnivo

Every component, in Figma today and React soon. Same tokens, same names, one license.

Buy now

Preview in Figma

Grids and spacing

Related components

Browse by category

Build your next screen with Gridnivo