BehaveRespectfully LookDistinctly MovePurposefully SpeakAuthentically ThinkSimply heart_icon

Table Variations

Overview

A content author can choose between pre-formatted or styled tables to show different types of content. Click here to view all available base table patterns.

click here to preview all variations of this component.

Table Variations

Example 1: Generic Table

Desktop, tablet and mobile views shown for illustrative purposes:

button allignment
button allignment

On mobile devices table's first column stays static remaining columns can slide horizontally. Please click here to see this interaction of table on mobile devices.

button allignment

Example 2: Comparison Table

Product or Content details are displayed in table format to help users clarity and allow users to easily compare different product features with clear calls to action.

Desktop, tablet and mobile views shown for illustrative purposes:

button allignment
button allignment

On mobile devices table's first column stays static remaining columns can slide horizontally. Please click here to see this interaction of table on mobile devices.

button allignment

Download