Radius

Radius in design is used to round the corners of elements like buttons, cards, or containers. By adjusting the radius, designers can create softer, more approachable shapes, giving the design a smoother and friendlier look. Rounded corners can make elements feel less rigid and more modern, helping to improve the overall visual appeal and user experience. It's often used to create a more polished and harmonious design.

For designers

  • There is no Figma style for radii, so if you need your own borders, you must change everything manually.
  • For long design system sustainability is good manually set up own radius scale with correct values. This scale should use designers and developers
  • There is example of radius usage in figma compared with code

Are you interested in how to set up the entire brand? Check out the guide

For developers

  • Use only Radius values which are shown in Figma (or Supernova if you use it)
  • Unfortunately figma does not support tokens, rem or em values, so you must connect px values with correct tokens
  • If you need any changes, contact your designer