Loading Shrinkify...
Loading Shrinkify...
Design uniform or per-corner border radii and copy shorthand CSS instantly.
All processing runs locally in your browser. Generated CSS is never uploaded.
Border-radius controls more than rounded corners — it shapes brand personality and interface tone. The Border Radius Generator handles independent corner values, elliptical shapes, and pill buttons with live preview and instant CSS copy.
Use border-top-left-radius and its siblings for asymmetric shapes like tabs, speech bubbles, and custom illustration-style UI elements.
Set border-radius: 50% on an element with equal width and height.
Using two values separated by / (e.g., 50px / 25px) creates different horizontal and vertical curve radii for pill-like shapes.
Yes. Use border-top-left-radius, border-top-right-radius, etc. to control each corner independently for asymmetric shapes.
Check out our technical guides to learn more about how browser-side processing works.
Read Glossary