Table

A table is a UI component that displays data in a structured format of rows and columns, facilitating easy comparison and analysis.

Base Components

Overview

A table displays data in rows and columns for easy comparison.
https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FGl3138LYJ71TKOZEC0F8nJ%2FShipfaster-UI---v2.7.1-(LIVE)%3Fnode-id%3D149-27019%26t%3DpA8X0YmO6d7F2SMU-1

When should you use them?

Use tables to organize and present large amounts of structured data, such as financial reports, schedules, or product specifications.

How should you use them?

  • Use clear and descriptive headers for each column.
  • Ensure rows and columns are well-aligned and spaced.
  • Provide sorting and filtering options for large datasets.
  • Make tables responsive for different screen sizes.
  • Ensure tables are accessible, with proper ARIA roles and keyboard navigation.
Previous

No previous post
Up next

No next post