Documentation and examples for opt-in styling of tables with Inkline.
Using the most basic table markup, here’s how tables look in Inkline. All table styles are inherited in Inkline, meaning any nested tables will be styled in the same manner as the parent.
bordered property for borders on all sides of the table and table cells.
striped property to add zebra-striping to any table row within the table body.
hover property to enable a hover state on table rows within a
Enable responsiveness by adding the
responsive property. Responsive tables scroll horizontally on small devices. When viewing on anything larger, you will not see any difference in these tables.
You can target specific responsive breakpoints by setting a value to the
responsive="<breakpoint>", where breakpoint is one of
Tables can be themed using the
variant property. You can use colors such as
danger. You can set a variant for the table as a whole or individual table elements. By default, tables have the
light variant. You can use a variation of any of the above classes to create the table design you need.
Here you can find a list of the various customization options you can use for the table components as props, as well as available slots.
Here you can find a list of the Sass variables you can use for the table components. If you're looking to find common variables that these rely on, you should take a look at the Sass Variables page.