Border Radius Generator
Create custom border radius values visually. Generate CSS for rounded corners with live preview!
16px
16px
16px
16px
border-radius: 16px;
Features
- Visual corner editor
- Link all corners
- Individual corner control
- Preset values
- px or % units
- Copy CSS code
How to Use
- 1Adjust corner sliders
- 2Toggle link to edit corners together
- 3Use presets for quick values
- 4Copy the generated CSS
Frequently Asked Questions
What is border-radius?
Border-radius rounds the corners of an element. Values can be in px (pixels) or % (percentage).
What does 50% do?
Setting 50% on all corners with equal width/height creates a perfect circle.
Can I set different corners?
Yes! Unlink corners to set each one individually for asymmetric designs.
What order are the values?
Clockwise from top-left: top-left, top-right, bottom-right, bottom-left.