⬜ Border Radius Generator

Create custom CSS border radius values with visual controls.

About Border Radius Generator

CSS border radius generator for rounded corners with preview.

Features

  • All corners
  • Pixel/% units
  • Real-time preview

Frequently Asked Questions

How to make a circle with border-radius?

Set border-radius: 50% on a square element to create a perfect circle. The percentage calculates based on the element's dimensions, so equal width and height create a circle.

What is the difference between px and % for border-radius?

Pixel values create fixed-radius corners. Percentage values create ellipses proportional to element size - 50% creates a perfect circle/pill shape regardless of size.

How to round only specific corners?

Use individual properties: border-top-left-radius, border-top-right-radius, border-bottom-right-radius, border-bottom-left-radius for precise corner control.

Related Tools