Tables

Listing tables can have either a white or light gray (Gray-300) background depending on the background of their parent section. They should be white when the section background is gray and white when the section background is gray.

They may be used to list products, locations etc.

The header of the table may be Gradient Blue or Blue-300 or may be omitted completely.

When adjusting to different screen sizes, the table rows may be either horizontally scrolled or have their contents stacked vertically. Avoid making the tables scrollable if they only have one or two columns or content that can easily fit in smaller screens.

• For displaying reference values, a less prominent table header and a more compact table design is used. The tables may also have more columns. However, avoid too narrow columns
• You may use Lato Extra Bold for the first column of a table if you wish to create a vertical header