CSS Border Radius Generator

Control all eight border-radius percentages, preview the shape, and copy the slash-syntax declaration.

Top-left X %

Top-right X %

Bottom-right X %

Bottom-left X %

Top-left Y %

Top-right Y %

Bottom-right Y %

Bottom-left Y %

CSS

How to use this CSS Border Radius Generator

Design rounded or organic CSS shapes with independent horizontal and vertical corner radii. Enter your values above and the result is calculated directly in your browser. No account is required.

Fast answer, clear inputs

This tool is built around one job: give the answer quickly without forcing a signup or hiding the result. Related tools are linked nearby when the next calculation or conversion is useful.