Layout
  • Free forever
  • No sign-up
  • Instant results

Border Radius Percentage Converter

Convert a px border-radius to a percentage of element dimensions. Handles non-square elements correctly, outputting the two-value syntax when width and height differ.

As percentage

When would you use this?

You might think that 50% always makes a circle, and for square elements it does. But for rectangular elements, 50% creates an ellipse, not a circle. And if you want a specific corner roundness defined in pixels but need to express it as a percentage, the maths involves both the width and height separately. This calculator handles all of that and tells you when your element is non-square so you get the right two-value syntax.

Common Questions

Why doesn't 50% border-radius always make a circle?

When would I use percentage border-radius?