⭕ Border Radius Generator

Visually design CSS border-radius values with live preview and copy-ready code.

Lock all corners together

Top-Left 12px

Top-Right 12px

Bottom-Left 12px

Bottom-Right 12px

border-radius: 12px;

CSS Border Radius

The border-radius property rounds the corners of an element. You can specify all four corners independently using border-top-left-radius, border-top-right-radius, etc., or use the shorthand with up to four values.

A value of 50% turns a square element into a circle. Setting to 0 gives sharp corners.