Drag each of the four corner handles (top-left, top-right, bottom-left, bottom-right) independently.
Watch the preview shape update live as an organic "blob" or rounded card shape.
Copy the generated `border-radius` CSS value once you're happy with the shape.
Key Features & Practical Use Cases
Visually crafting complex CSS border-radius shapes for modern web elements.
Generating cross-browser compatible CSS code for rounded buttons and cards.
Designing unique blob shapes and organic UI components dynamically.
Frequently Asked Questions
Can each corner have a different radius?
Yes - all four corners are controlled independently, letting you create asymmetric "blob" shapes, not just uniform rounded rectangles.
Does the generated CSS need vendor prefixes?
No - `border-radius` has been a standard, unprefixed CSS property supported by all modern browsers for years.
What's a practical use for asymmetric border radius?
Organic "blob" background shapes behind hero images or profile photos are a common modern web design trend built entirely with asymmetric border-radius values.
About OneClickly
OneClickly offers 100+ premium online tools for PDF operations, image compression and conversion, text utilities, calculators, and developer tools. All tools run 100% in your browser - no file uploads, no data collection, maximum privacy guaranteed.