Shipfaster: UI Components


Presents data in combination of columns and rows.


Breadcrumbs are used when you have a large amount of content organised in hierarchical structure with defined categories (multiple sections that can be divided into more sub-sections). An excellent example is e-commerce site, in which a large variety of products is grouped into logical categories. They inform visitors of their current location in relation to the entire site hierarchy. Whereas they also improve the find-ability of site pages. The structure of the site is more easily understood because it is laid out in a breadcrumb.

Tables are great at presenting a clear structure that can be scanned to get just the right information. A table can organise, and present data that is relative, and it can enable user interactions like selecting, adding, deleting, and reordering.

When to use

  • When you want to group related data in a scannable manner.
  • To present data that has a repetive structure.


Anatomy of table
  1. Column header: Used for indicating the column heading. Optionally paired with actions like checkbox or arrange arrows.
  2. Leading cell: Used for showing the first (i.e. leading) column in the table. Usually placed in the leftmost (i.e. first) column.
  3. General content cell: Comes with a variety of content types and used for all other cells in the table.

Best Practices

  1. Let people edit a table when it makes sense.
  2. Provide appropriate feedback when people select a row or column. Shipfaster provides all necessary states such as rest, active, and hover.
  3. Choose a row style that fits the information you need to display.

Recommended resources

Get instant access to over 6,000 Figma Components with Shipfaster UI. A Figma UI Kit & Design system used by over 2,000 designers.

All Products

Outline: Figma’s Ultimate Wireframe Kit

Stay on top of testing ideas and prototypes with a wireframe kit that simplifies your process

Pricing Icon
800+ of Downloads
Review Stars
800+ downloads
Learn More
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.