CSS Utility

Radius Gen

Sculpt a shape corner by corner and copy the CSS. Switch units, split each corner into horizontal and vertical radii, and see it on a box you can resize.

Live resizable preview px / % / rem / em Copy-ready CSS

Preview

Box width320px

Box height240px

Percentages are relative to the box, so resizing changes the shape. Pixels do not.

Corners

Elliptical corners Separate horizontal and vertical radii (a b c d / e f g h)

Presets

CSS

Vendor prefixes are not emitted - border-radius has been unprefixed in every browser since 2011, and -webkit-/-moz- versions are dead weight in modern stylesheets.