Генератор CSS border-radius онлайн
CSS border-radius принимает до 8 значений (4 горизонтальных + 4 вертикальных радиуса), что позволяет создавать любые органические формы — от капель до «блобов». Настройте форму слайдерами или выберите готовый пресет.
Часто задаваемые вопросы
Как работает 8-значный border-radius?
Формат: border-radius: TL TR BR BL / TL TR BR BL. Первые 4 значения — горизонтальные радиусы каждого угла, после слеша — вертикальные. Это позволяет сделать угол эллиптическим (разные горизонтальный и вертикальный радиус).
Что такое blob (блоб)?
Блоб — органическая нерегулярная форма, создаваемая через несимметричный border-radius. Популярны в современном веб-дизайне для фоновых элементов, аватаров и декоративных блоков. Достигается через разные значения для каждого угла.
Как применить в CSS?
Просто скопируйте сгенерированный CSS и вставьте в стили нужного элемента: .my-shape { border-radius: 30% 70% 60% 40% / 50% 40% 60% 50%; }. Добавьте background и нужные размеры (width, height).
Нужен полноценный SEO-аудит?
Инструменты помогают с точечными задачами. Для системного роста — запросите бесплатный разбор вашего сайта.