Radius

Radius tokens define the standard corner radius of components.

Reshaped supports three radius tokens based on the size of the components they are applied to.

  • Small radius is used for small atomic elements like Badge.
  • Medium radius is used for larger elements like Button.
  • Large radius is used for larger surfaces like Card or Modal.
--rs-radius-small
--rs-radius-medium
--rs-radius-large

/* Usage */
.element {
  border-radius: var(--rs-radius-medium);
}
Previous
Next
Professionally crafted React & Figma components for building beautiful products or starting your own design system
Built with Reshaped in Amsterdam ❤️
Contact us·
© Reshaped 2026