Shape

Shape provides distinction to individual components as well as establishes a sense of overall visual identity throughout the application.

Border radius

Border radius is used to set the rounded-ness of a container or shape. Consistent use of a container's border radius can be used to clarify intent such as whether or not a component is interactive.

0
50
100
200
300
400
Circle

Border width

Border width is used to define the edge of a frame or component. This can be used alone or in conjunction with background fills to create various levels of visual hierarchy within a series of containers.