Border Radius
A consistent border radius system that provides various corner styles for UI components. Our border radius system maintains consistent design language across the interface while providing flexibility for different contexts.
Border Radius Tokens
Our design system includes carefully selected border radius values to create unified and cohesive UI components.
4
Value: 4px
Class: rounded
className="rounded"6
Value: 6px
Class: rounded-6
className="rounded-6"8
Value: 8px
Class: rounded-md
className="rounded-md"10
Value: 10px
Class: rounded-10
className="rounded-10"12
Value: 12px
Class: rounded-xl
className="rounded-xl"16
Value: 16px
Class: rounded-2xl
className="rounded-2xl"20
Value: 20px
Class: rounded-20
className="rounded-20"24
Value: 24px
Class: rounded-3xl
className="rounded-3xl"full
Value: 999px
Class: rounded-full
className="rounded-full"