Radius
Radius (or radii) are the rounded corners in components and elements. They give Chipin the curvy feel of a golf course.
Image placeholder
scale
--radius-none
0px
--radius-xs
12px
--radius-sm
16px
--radius-md
20px
--radius-lg
30px
--radius-xl
40px
--radius-2xl
60px
--radius-full
9999px
guidance
Nesting elements
When nesting elements inside one another — think of it like a matryoshka doll. Child elements should always have one size smaller radius than their parent.
Example placeholder
Example placeholder