Генератор на органични CSS петна
Проектирайте CSS border-radius визуално: четири независими ъглови плъзгача в пиксели или проценти, пряк път за свързване на всички ъгли за незабавни кръгове и хапчета, плюс органичен режим на петна с произволни форми.
Резултат
Тази страница отваря генератора на радиус на границата директно в режим на петна с вече заредена органична форма: без квадратни ъгли, без перфектен кръг, само мек неправилен контур, изграден само от CSS. Натиснете Randomize по всяко време за нова вариация.
Номерът зад всеки CSS петно е синтаксисът с наклонена черта с осем стойности: border-radius приема два набора от четири процента, разделени с наклонена черта, като първият набор криви хоризонталните радиуси, а вторият - вертикалните. Несъответствието на двата комплекта е точно това, което нарушава симетрията на обикновен заоблен правоъгълник в органичен контур.
Петна като това запълват празното пространство зад геройски изображения, аватари и илюстрации на безброй модерни целеви страници, точно защото не е необходима библиотека или SVG експортиране — това са четири реда CSS. Копирайте текущата форма или продължете да подреждате на случаен принцип, докато не се почувствате подходяща за вашето оформление.