Principles
Border radius has been used to imbue a level of softness to the overall user experience as it deals with matters of health.
Major styles
In our design system, the application of the right radius plays a crucial role in shaping the visual identity and user experience. Each type of radius is selected to maintain a clean, simple interface that is pleasing to the eye.
Default
The default radius applied to elements unless specified otherwise.
border-radius-66px
Medium
The radius of medium level elements like buttons and input fields.
border-radius-1212px
Large
The radius of bigger elements like cards and modals
border-radius-2424px
Full
The radius for fully circular elements like avatar.
border-radius-full50%