Генератор CSS Border-Radius

Перетащите ползунки, чтобы задать радиус каждого угла отдельно. Предпросмотр обновляется мгновенно — скопируйте CSS, когда результат вас устроит.

Связать все углы

Верх-лево 20px

Верх-право 20px

Низ-право 20px

Низ-лево 20px

CSS-результат

Работает полностью в браузере. Никаких загрузок.

Как это работает

STEP 1

Используйте четыре ползунка, чтобы независимо задать значения радиуса для верхнего левого, верхнего правого, нижнего правого и нижнего левого углов.

STEP 2

Блок предпросмотра обновляется в реальном времени, позволяя увидеть, как именно будут выглядеть скруглённые углы.

STEP 3

Нажмите «Скопировать CSS», чтобы скопировать объявление border-radius в буфер обмена — готово к вставке в таблицу стилей.