Foundations

Foundations are the visual elements needed to create engaging end-to-end user experiences. This includes guidance on iconography, typography, layout, and structure.

Design tokens

Tokens

Design tokens are the single source of truth to name and store decisions about the user interface.

Guidelines

Accessibility

Accessible design lets people of all abilities interact with, understand, and navigate our products.

Content

Clear, concise, and conversational language to get teams where they need to go.

Styles

Spacing

A spacing system simplifies the creation of page layouts and UI.

Grid

Grid is used to position content and create consistent page layouts.

Color

Color distinguishes our brand and reinforces experiences across apps.

Typography

Typography is our system of fonts and text styles.

Iconography

Icons are visual representations of commands and common actions.

Illustrations

Illustrations help convey complex ideas in a simple way.

Logos

Logos are the visual representation of a brand or app.

Elevation

Elevations are layered surfaces that form the foundation of UI.