Start-align textual data

Similar to a paragraph of text, textual data should be start-aligned within a table (left-aligned in LTR languages, right-aligned in RTL languages). Never use center alignment.

Right align numerical data

Numerical data should generally be right-aligned for ease of scanning and comparing. This alignment typically does NOT reverse in RTL languages because:

• Numbers are written left-to-right even in RTL languages (e.g., Arabic numerals)
• Right-alignment ensures decimal places and digits line up vertically for comparison

Exception: Use start-alignment (left in LTR, right in RTL) when numbers are arbitrary identifiers, known as "nominal numbers," which can't be compared or combined arithmetically (e.g., ZIP codes, IP addresses, phone numbers). These behave like text.

Column headers follow the alignment of their data.

Use tabular numbers for numerical data

When users need to compare numerical values, use tabular (monospaced) and lining (not old style) numbers to make it easier. These features are supported by Adobe Clean via the OpenType panel in Illustrator or via the CSS font feature settings.

Respect vertical alignment

All content should be centered vertically within the row to offer the right visual balance.

Don't use zebra stripes

Tables use row dividers, hover states, and selection highlighting to help users track data. Zebra striping adds visual noise without improving usability.

Use column dividers sparingly

Column dividers are optional decorations that can help organize table content and create groups of data. Only use these when necessary, and don't add them to every column.

Use an en dash (–) for missing values

When there are gaps in the data, use an en dash (–) to represent null or not applicable (N/A) values.