Table

The table component is used to display tabular data in a structured format. All table elements are supported (<tbody>, <tr>, <td>, etc.).

Table is available in several variants: primary, secondary and tertiary. The variant prop controls the background color of the table. This can be used to create different levels of hierarchy within your UI.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

The zebra prop adds alternating row colors to improve readability. This is particularly useful for large datasets where distinguishing between rows can be challenging.

The color of the alternating rows is determined by the variant prop:

• primary variant uses the secondary background for alternating rows.
• secondary variant uses the primary background for alternating rows.
• tertiary variant uses the primary background for alternating rows.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

The variant prop can also be applied to the table header. This allows you to create a visual distinction between the header and the body of the table.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

The variant prop can also be applied to the table footer. This allows you to create a visual distinction between the footer and the body of the table.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

You can control the text alignment of table cells and headers using the textAlign prop. It accepts: left or right.

• Numeric data should be right-aligned to improve readability.

The table component is used to display tabular data in a structured format. All table elements are supported (<tbody>, <tr>, <td>, etc.).

Table is available in several variants: primary, secondary and tertiary. The variant prop controls the background color of the table. This can be used to create different levels of hierarchy within your UI.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

The zebra prop adds alternating row colors to improve readability. This is particularly useful for large datasets where distinguishing between rows can be challenging.

The color of the alternating rows is determined by the variant prop:

• primary variant uses the secondary background for alternating rows.
• secondary variant uses the primary background for alternating rows.
• tertiary variant uses the primary background for alternating rows.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

The variant prop can also be applied to the table header. This allows you to create a visual distinction between the header and the body of the table.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

The variant prop can also be applied to the table footer. This allows you to create a visual distinction between the footer and the body of the table.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

You can control the text alignment of table cells and headers using the textAlign prop. It accepts: left or right.

• Numeric data should be right-aligned to improve readability.

The table component is used to display tabular data in a structured format. All table elements are supported (<tbody>, <tr>, <td>, etc.).

Table is available in several variants: primary, secondary and tertiary. The variant prop controls the background color of the table. This can be used to create different levels of hierarchy within your UI.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

The zebra prop adds alternating row colors to improve readability. This is particularly useful for large datasets where distinguishing between rows can be challenging.

The color of the alternating rows is determined by the variant prop:

• primary variant uses the secondary background for alternating rows.
• secondary variant uses the primary background for alternating rows.
• tertiary variant uses the primary background for alternating rows.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

The variant prop can also be applied to the table header. This allows you to create a visual distinction between the header and the body of the table.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

The variant prop can also be applied to the table footer. This allows you to create a visual distinction between the footer and the body of the table.

The divider prop can be used to adjust the appearance of the dividers in the table. It accepts: primary, secondary, tertiary or none.

You can control the text alignment of table cells and headers using the textAlign prop. It accepts: left or right.

• Numeric data should be right-aligned to improve readability.