Design

Radius and shadows

The radii and the elevations.

Radius

The radii on controls, cards and pills.

--radius-sm · 4 pxA chip inside a table cell, a bar

--radius-control · 8 pxButtons, fields, tabs, the list that opens

--radius-card · 12 pxCards, tiles, popovers, dialogs

--radius-full · fullPills, avatars, the health ring

The elevations and where each is used.

FlatTables, fields, rows: a border, no shadow

--shadow-cardCards and tiles lift a little

--shadow-overlayPopovers, the list that opens, dialogs, toasts