What the tool can do
- Separate setting for each angle.
- Visual preview of the block.
- Ready border-radius value for CSS.
CSS and layout
border-radius generator
The tool is needed when it is important to quickly select fillets for buttons, cards, forms and decorative containers without manually selecting numbers.
FreeNo registrationOnline in browser
How to use
- Adjust the rounding of each corner using the sliders.
- Check out the preview of the form.
- Copy the finished CSS value.
Where is this service useful?
Buttons and CTAs.
Cards of services, cases and reviews.
Decorative forms for landing pages.
FAQ
Is it possible to adjust different angles separately?
Yes. The generator allows you to set your own value for each corner of the block.
Is the tool suitable for a design system?
Yes. It helps to quickly test a visual solution before committing tokens to the UI-kit.
Related tools
All instruments📐🧱🎛️
CSS Flexbox Generator
Set up flex-direction, justify-content, align-items, gap and wrap. Immediately watch the preview and copy the finished CSS code.
CSS Grid Generator
Create a grid online: number of columns, rows, gap and minimum width of cards. Get ready-made CSS code and preview.
CSS filters generator
Set up blur, brightness, contrast, grayscale, hue-rotate and other CSS filters. Immediately see the effect and copy the code.
NBM-IT
Need a tool for your process?
We can make a custom calculator, validator, integration helper or audit panel for your data, CRM and internal scripts.