Design Studio · Bench
Border Radius Generator
Rounded corners & organic blobs
CSS
border-radius: 30% 70% 70% 30% / 70% 70% 30% 30%;
About this bench
About Border Radius Generator
Design rounded corners and organic “blob” shapes visually and copy the CSS border-radius.
Input
Adjust the visual controls or paste the design value requested by the bench.
Result
A live preview plus a value or CSS snippet you can copy into your own work.
Limits
Rendering can vary between browser engines. Check the result in every browser and accessibility mode your product supports.
How to use Border Radius Generator
- 01Drag the corner handles to shape the element.
- 02Preview the result live.
- 03Fine-tune each corner if you want.
- 04Copy the generated border-radius CSS.
Frequently asked questions
Is it free?
Yes — it is free with no sign-up, no watermark and no account-based quota. Your browser, device memory and the bench's stated file limits still determine how much it can process at once.
Is my data private?
Nothing is uploaded. This tool runs entirely in your browser, so your data is processed on your own device and never sent to a server.
What CSS does the tool generate?
It produces a border-radius declaration from the corner values or organic shape you create in the visual editor.