Foundations

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

Accessibility

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

Color

Color distinguishes our brand and reinforces consistent experiences across products.

Elevation

Elevations are layered surfaces that form the foundation of UI.

Grid

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

Iconography

Icons are visual representations of commands, devices, directories, or common actions.

Illustrations

Illustrations help convey complex ideas in a simple way. They should be meaningful and reflect a user's context and emotional state.

Logos

A logo is a visual representation of a brand or product. It can be a word or an image, or a combination of both.

Spacing

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

Typography (beta)

Typography is our system of fonts and text styles. It enhances communication, reinforces brand, and guides users' emotions.