Web Interface  |  Typography

Tables

This section is about how to design tables properly and how to show the data in them.

01Readable tables

Tables are designed to display numerical data. If the cells of a table contain multiline text and images it looks like a questionable way. In this case, it is better to avoid presenting the data in a table.

The data in such a table is unreadable.
The data in the table is well readable.

02Borders in the table should be light

Too thick lines in tables create noise and block attention. When reading a table, it's better to see the data itself, not the borders. So thinner and lighter lines are more comfortable to read the table.

Too thick and bright borders make it hard to read the table
Fewer borders and lighter lines look more comfortable to read.

03Lines in tables are not necessary

Often lines and borders are not needed at all. This only increases the readability of the table. Sufficient spacing between table rows is quite good as separators.

The table reads well without lines and borders.