Element

Color is used to express style and communicate meaning. The system of tonal palettes is central to making any color scheme accessible by default.

Avatar

SM / All Brekpoints

MD / All Brekpoints

LG / All Brekpoints

Avatar + Info

Name

Info

Name

Info

Name

Info

SM / Desktop

SM / Tablet&Phone

SM / Tablet&Phone

Name

Info

Name

Info

Name

Info

MD / Desktop

MD / Tablet&Phone

MD / Tablet&Phone

Button - Primary

MD / All Brekpoints

SM / All Brekpoints

LG / Desktop

LG / Tablet&Phone

LG / Tablet&Phone

Button - Secondary

MD / All Brekpoints

SM / All Brekpoints

LG / Desktop

LG / Tablet&Phone

LG / Tablet&Phone

Button - Social

All Brekpoints

Chip

Chip text

SM / All Breakpoints

Chip text

MD / All Breakpoints

Chip text

LG / All Breakpoints

Icon

SM / All Breakpoints

MD / All Breakpoints

LG / All Breakpoints

XL / All Breakpoints

Rating

SM / All Breakpoints

MD / All Breakpoints

LG / All Breakpoints