Border Radius
Cal.com's border radius system
Border Radius
Our design system uses a consistent set of border radius values to create a cohesive and modern interface. The border radius scale ranges from none (sharp corners) to full (completely rounded).
Usage
Border Radius Scale
Click on any radius to copy its Tailwind class name. Each preview shows how the radius appears when applied.
None
rounded-none
0px
Small
rounded-sm
0.125rem
Default
rounded
0.25rem
Medium
rounded-md
0.375rem
Large
rounded-lg
0.5rem
XLarge
rounded-xl
0.75rem
2XLarge
rounded-2xl
1rem
3XLarge
rounded-3xl
1.5rem
Full
rounded-full
9999px