CSS Border Radius Generator

border-radius rounds the corners of an element. You can set all corners equally or each corner individually, and even split horizontal and vertical radii for elliptical corners.

Switch to Blob mode and click any of the 8 preset blobs. They use the 8-value border-radius syntax (TL TR BR BL / TL TR BR BL) to create organic shapes.

Each corner can have separate horizontal and vertical radius values using the slash syntax: border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;

In Simple mode, click the 'Circle' quick shape button. This sets border-radius: 50%.

Yes, completely free with no signup.