← All Tools / CSS Border Radius Generator

CSS Border Radius Generator

Design custom border-radius shapes with live preview and one-click CSS copy.

Top-Left 20px

Top-Right 20px

Bottom-Right 20px

Bottom-Left 20px

Background Color

CSS

CSS Border Radius Generator — Frequently Asked Questions

Drag the sliders for each corner or enter pixel values, then copy the generated CSS border-radius code straight into your stylesheet.

Yes. You can control the top-left, top-right, bottom-right, and bottom-left corners independently to create custom shapes.

Yes, the CSS is 100% free to use in any personal or commercial project with no attribution required.