Генератор Border Radius

Настраивайте скругление визуально, а не наугад

border-radius кажется простой CSS-свойством, пока не нужно получить что-то точнее обычного слегка скругленного прямоугольника. Этот генератор позволяет менять каждый угол отдельно и сразу видеть результат, что удобно при настройке кнопок, карточек, полей и других UI-элементов.

Что здесь можно контролировать

Инструмент помогает быстро проверить самые частые варианты border-radius:

• одно значение для всех углов
• отдельные значения для каждого угла
• единицы в пикселях или процентах
• быстрые пресеты для популярных форм

Когда это особенно полезно

Генератор border radius пригодится, если вам нужно:

• точнее попасть в существующую дизайн-систему
• попробовать форму таблетки, круга или более органичные контуры
• подготовить переиспользуемый CSS для кнопок и карточек
• сократить количество проб и ошибок в devtools

Выбор единицы заметно влияет на результат

Пиксели дают фиксированное скругление, а проценты сильнее зависят от размеров элемента. Если форма хорошо смотрится в одном компоненте, но странно выглядит в другом, попробуйте сменить единицу и сравнить результат.