⬜ CSS Border Radius Generator

Design custom rounded corners visually

Link all corners

Top Left16px

Top Right16px

Bottom Right16px

Bottom Left16px

border-radius: 16px;

Can I set different values for each corner?

Yes! Uncheck "Link all corners" to set each corner independently. The shorthand is: border-radius: top-left top-right bottom-right bottom-left.

How do I make a perfect circle?

Set border-radius to 50% on a square element (equal width and height). Using 100px on a 200x200 element also works.