Figma Table

/

/

/

/

Figma Table

Preview

Figma Table

Figma Table Component

The Table component organizes data into rows and columns, mimicking the familiar spreadsheet layout for easy comprehension and analysis. Our Table UI provides two structure variants, with a row and column-based Auto layout approach.

  • Test both Auto Layout options to see which works better for your data - they stack differently;

  • Build custom tables by stacking individual cells - each one can have its own unique style.

Table Anatomy

SetVariantsProperties
TableCell30Type Progress, Toggle, Avatar, Checkbox, TextSize Large, Medium, SmallState Focused, Default
TableHeader2Type Icon, Checkbox

Table has no single variant set. You build it from TableCell and TableHeader.

The file includes Rows and Columns example boards.

Copy to Figma

SetCopy to Figma
Examples - Rows
Examples - Columns

Type

Interactive component

Behavior

Auto layout

Figma Table

Table

figma table template

figma table component

tables design examples

Interactive component

Design systems with Figma — 10× faster

Level up your design, build robust systems, websites, and applications that will stay beautiful forever.

UI KIT TRUSTED BY TOP TEAMS AND BRANDS

Design systems with Figma — 10× faster

Level up your design, build robust systems, websites, and applications that will stay beautiful forever.

UI KIT TRUSTED BY TOP TEAMS AND BRANDS

Design in Figma
10X faster

Level up your design, build robust systems, websites, and applications that will stay beautiful forever.