Генератор CSS border-radius

Как пользоваться

1. На экране уже есть скруглённая карточка (16px) — двигайте ползунок «Радиус» или переключите единицу (px / %), и всё обновится на лету, нажимать ничего не нужно.
2. Переключайте режим кнопками: «Все углы» управляет одним ползунком, «Каждый угол» редактирует четыре угла независимо (ВЛ, ВП, НП, НЛ), «Эллиптический» добавляет горизонтальный и вертикальный радиус для каждого угла (синтаксис со слэшем).
3. Нажмите на пресет (Острые, Скруглённая карточка, Круг, Капсула, Лист, Клякса), чтобы загрузить готовую форму — режим и единица подстроятся сами. Полное объявление border-radius копируется одним кликом.

Область применения, ограничения и частые вопросы

• Только border-radius: без плавных «непрерывных» углов в стиле iOS (squircle) — для них нужны clip-path или SVG, и они вне области применения.
• Вставка готовых CSS-значений не поддерживается: все значения берутся из ползунков, пресетов и режимов, поэтому разбирать нечего.
• Когда соседние радиусы в сумме больше стороны, браузер пропорционально уменьшает их. Предпросмотр показывает реальный результат отрисовки; в поле кода видны заданные вами значения.
• Пресет «Капсула» выдаёт 9999px — принятое в сообществе сокращение «максимально круглый»; браузер ограничивает его половиной меньшей стороны.
• Проценты считаются по каждой оси: горизонтальные радиусы от ширины, вертикальные от высоты (предпросмотр квадратный, поэтому там оба совпадают). На элементах другого размера тот же процент даёт другую форму.
• Ничего не сохраняется и не передаётся параметром в ссылке: после обновления вы снова видите «Скруглённую карточку» по умолчанию. Всё работает в браузере.