UI: Components

Table

Table is a collection of modifier-classes to enhance the appearance of tables, using the native <table>, <thead>, <tbody>, <tr>, <th>, <td>, <colgroup> and <col> HTML elements.

With opposite color-scheme

With right-to-left

Variants

With --hover-all

With --rounded, --hover-col and --hover-td

With --split-cols, --th-dark, --hover-tr and --hover-td

With --rounded added as well.

With --split-rows, --th-light, --hover-tr and --hover-td-outline

With --rounded added as well.

With --block-border, --th-light and --hover-tr

With --zebracol-even and --hover-tr-outline

With --zebracol-odd and --hover-col-outline.
This requires border-collpase: collapse and will not work with split cols or rows.

With --zebrarow-even and --hover-td-outline

With --zebrarow-odd and --hover-col-outline

With --zebrarow-even, --no-border and --hover-tr-outline

With --block-border, --hover-col and column-alignment:
data-col-2="center" data-col-4="end"