Table views can be used for organizing data, showing collections of links, or a series of controls.
The most basic table view is simply an unordered list with list items, and the proper classes. Build upon it with the options that follow, or your own CSS as needed.
Carded table views
.card to wrap any content in a padded element.
Table view with components
Table view with chevrons
Chevrons should be used to indicate that the item is linked. Just apply the classes
.navigate-left to use a chevron.
Note: Table views with the Android theme don’t have chevrons to comply with Android Design guidelines. More information can be found here.
Table view with badges
Badges are a great way of showing data.
Table view with badges and chevrons
Feel free to use chevrons and badges together. They’ll automatically positon themselves correctly.
Showing media inside table views is easy. This component to perfect for images and text.
Ratchicons can also used instead of images.
Table view with buttons
Table view with switch
Table view with select
Table view with checkbox
Table view with radio
Table view with controls and chevrons
Table view components can also be nested until 4 depth.
Invert the colors
You can also invert the colors with light text on dark backgrounds with
Use contextual classes to color table view cells.
Regular table background variants are not available with the inverse table, however, you may use text or background utilities to achieve similar styles.