0

Генератор на радиус на границата

Проектирайте CSS border-radius визуално: четири независими ъглови плъзгача в пиксели или проценти, пряк път за свързване на всички ъгли за незабавни кръгове и хапчета, плюс органичен режим на петна с произволни форми.

12px
12px
12px
12px
Обработка... 0%

Резултат

Декларацията за радиус на границата може да приеме до четири независими ъглови стойности плюс незадължителен синтаксис с наклонена черта с осем стойности за органични криви - повече движещи се части, отколкото повечето хора си дават сметка, докато не им потрябва нещо отвъд обикновена заоблена карта. Този генератор поставя всяка една от тези части на екрана: четири ъглови плъзгача със собствена единица px или процент, пряк път за свързване на всички ъгли за симетрични форми и режим на петно ​​за форми, които нито една стойност на радиус не може да изрази.

Режимът на ъглите покрива формите, към които хората действително достигат: свържете всеки ъгъл с един плъзгач за перфектни кръгове, хапчета и кавърчета или ги прекъснете, за да заоблите само горната част на падащ панел или само едната страна на карта. Предварителен преглед на шахматна дъска зад формата, с възможност за превключване между светъл и тъмен фон, прави ясно кои точно ъгли се изрязват при който и да е радиус – същите инструменти за визуални трикове за файлове на този сайт използват, за да покажат прозрачност.

Режимът на петна е другата половина: синтаксисът на наклонената черта с осем стойности на CSS позволява хоризонталните и вертикалните радиуси на всеки ъгъл да се разминават, което превръща заобления правоъгълник в органичен, неправилен контур. Натиснете Randomize за нова форма по всяко време и копирайте точния CSS зад нея – без експортиране на SVG или външна библиотека. Предварително зададените страници покриват заявките, които хората действително въвеждат в полето за търсене: перфектен кръг, бутон за хапче във формата на стадион, кадърче в стил iOS и готово органично петно.

Като всеки инструмент на този сайт, той работи изцяло във вашия браузър: без качване, без акаунт и генераторът продължава да работи офлайн, след като страницата се зареди.