RADIUS
Radius (or radii) refers to the rounded corners of components and content elements. They give the MediBuddy experience a softer, more approachable, and visually engaging appearance.
SCALE
Name
Value
radius-none
0px
radius-xxs
2px
radius-xs
4px
radius-sm
6px
radius-md
8px
radius-lg
10px
radius-xl
12px
radius-2xl
16px
radius-3xl
20px
radius-4xl
24px
radius-full
9999px
EXAMPLE
Components like the Doctor Listing Card use radius tokens along with padding to create a balanced layout, giving content enough space to breathe and making information easy to scan and understand.
