CSS Border Radius Generator
Shape corners per-side or link them, then copy border-radius CSS.
Preview
What is this tool?
Border radius softens rectangular boxes. This generator lets you set each corner independently or link all four, previews the shape live, and emits compact CSS.
How to use it
- Drag corner sliders (or link all corners).
- Preview the shape in the teal box.
- Copy the border-radius declaration.
Related design tools
- Color ConverterConvert between HEX, RGB, HSL, and HSB/HSV with a live swatch.
- CSS Gradient GeneratorBuild linear or radial gradients with multiple stops and copy CSS.
- CSS Box Shadow GeneratorTune offset, blur, spread, color, and layered shadows visually.
- Favicon GeneratorUpload an image and export standard favicon PNG sizes (and a ZIP).