Rounded corners are one of the simplest ways to soften an interface, but getting an organic, non-uniform shape — like a blob or speech-bubble effect — requires setting all four corners independently, which is fiddly to eyeball in code. This tool lets you drag each corner separately with a live preview.
Use equal values on all four corners for a simple uniform rounded rectangle, or vary them to create more distinctive, organic shapes for cards, buttons, and decorative elements.
The generated CSS uses the standard border-radius shorthand property, ready to paste directly into any stylesheet.
Because everything runs locally in your browser, results appear instantly and nothing you type or upload is ever sent to a server.
Bookmark this page if you expect to use this tool regularly — it loads fast and behaves the same way every time, with no account needed.
This kind of task shows up constantly in everyday writing, coding, design, and admin work, which is exactly why a dedicated, focused tool saves so much back-and-forth.
A tool that does one job well, without a cluttered interface or unrelated features competing for attention, tends to be faster to use than a heavier all-in-one app.
If you find yourself needing this conversion or calculation often, keeping this page open in a tab is usually faster than digging through a bigger software suite's menus.
Because there's no sign-up or installation step, you can jump straight from search result to working tool in a couple of seconds.
Unlike a heavier desktop application, there's nothing to download, update, or configure before you can start using this tool.
If you find yourself needing this often, keeping this page open in a tab is usually faster than digging through a bigger software suite's menus.
This tool avoids unnecessary steps like account creation or email verification, since the underlying task itself is simple enough not to need them.
Many people discover a tool like this the first time they need it for a specific task, then come back to it regularly afterward once they know it exists.
Frequently asked questions
What's the maximum border radius?
Setting a corner's radius to half the element's width or height (or more) creates a fully rounded edge, effectively forming a circle or pill shape.
Does this work in all browsers?
The border-radius property, including independent per-corner values, is supported in all modern browsers.