Сколько раз ты вручную подбирал border-radius, чтобы кнопка наконец выглядела прилично? Прописал 10px — остро, 20px — уже мыло, а нужен был аккуратный средний вариант. И так раз за разом, пока глаза не замыливаются. Знакомо? Тогда садись поудобнее.
Простая вещь, которая забирает слишком много времени
border-radius — свойство вроде бы элементарное. Но на практике это постоянная возня: подобрать значение, перезагрузить страницу, посмотреть, подправить ещё раз. А если скруглить нужно не все четыре угла одинаково, а, скажем, только верхние или сделать хитрую форму — начинается подгон вручную с калькулятором наперевес.
Ровно поэтому мы и сделали генератор. Открываешь — и сразу видишь результат, без перезагрузок и угадывания.
Как это работает
Открываешь генератор, двигаешь ползунок — углы скругляются прямо на глазах. Видишь блок, который выглядит так, как тебе надо? Отлично, значит значение подобрано. Остаётся нажать «Копировать» и вставить CSS в свой проект. Всё.
Причём заморачиваться с каждым углом отдельно не обязательно. Нужно скруглить все четыре сразу — двигаешь один ползунок, и они меняются вместе. А если какая-то форма нестандартная — пожалуйста, отвязываешь углы и крутишь каждый сам по себе. Кнопки, карточки, аватарки, хитрозакрученные блоки — всё считается моментально.
Готовый код в один клик
Вот что реально бесит в ручном подборе: вроде нашёл нужное значение, а дальше надо ещё корректно записать его в CSS. Где короткая запись, где развёрнутая, где вообще прописать только пару углов.
Генератор закрывает и это. CSS собирается автоматически, причём сразу в двух вариантах — короткой строкой border-radius: 16px и развёрнутой формой, где каждое значение расписано отдельно. Какой удобнее, тот и копируешь. Никакой ручной записи и опечаток.
Для кого это
Для всех, кто хоть раз верстал. Фронтендер, верстальщик, дизайнер, владелец сайта на WordPress или любом конструкторе, который полез править стили напрямую. Если ты пишешь интерфейсы руками — генератор сэкономит тебе массу мелких операций надоедливой рутины.
Итог
border-radius не должен отнимать у тебя вечер. Открыл генератор, подвигал ползунок, скопировал готовый код — и пошёл дальше делать сайт. Бесплатно, без регистрации, прямо в браузере.
Сам генератор border-radius
