.element {
border-radius: 12px;
}Yes, this tool is completely free to use with no sign-up required. Generate as many border radius styles as you need.
Use the sliders to adjust each corner independently (top-left, top-right, bottom-right, bottom-left). Try the preset buttons for common shapes like circles or rounded rectangles. Watch the preview update in real-time as you adjust values. Once you achieve the shape you want, copy the generated border-radius CSS property and paste it into your stylesheet.
Yes! Set the border radius to 50% on all corners to create perfect circles from square elements, or use 100px+ values for pill shapes.
Border-radius is supported in all modern browsers. For IE8 and below, consider using fallback styles or polyfills.