Webcomponent built with Atomico JS, Simple to use and customize table. Includes additional support for React and Preact.


import { Table, Tr, Td } from "@atomico/table";

Custom properties



table borde-radius


table background


table borde


border dividing cells


row spacing


row border-radius


row box-shadow


row background


border-radius of the row declared as slot="header"


box-shadow of the row declared as slot="header"


background of the row declared as slot="header"


borde-radius de la ultima fila


cell alignment, default middle


cell padding


padding of the cell inside the Tr declared as slot="header"

Properties Table

collapse: boolean, collapses the rows of the table, if breakpoint is defined the component will automatically define this props when detecting the match with breakpoint.

breakpoint: string, media query to observe to copal the table.

Properties Tr

sticky: boolan,The table row will set its position according to the scroll position

The following properties are automatically defined by the component to declare state.

td: array ,list of Td nodes associated with the TR component

collapse: boolean, property defined according to the state of the parent.

last: last row of the table

Properties Td

width: string, cell width.



Last updated