Генератор блобов SVG
- Файлы не покидают устройство
- Работает в браузере
- Бесплатно, без регистрации и водяных знаков
Press R or Space for a new blob.
Как пользоваться: Генератор блобов SVG
Генерируйте случайные органические формы-блобы и экспортируйте их как SVG, PNG или компонент React. Настраивайте точки, контраст, слои, градиентную заливку и стиль контура и добавьте необязательную морф-анимацию. Каждая форма берётся из числа-зерна и создаётся в браузере.
- 1
Нажимайте «Новый блоб» или клавиши R или пробел, пока форма не понравится. Прежние формы остаются в «Недавних блобах».
- 2
В «Форме» настройте сложность, контраст, размер и слои.
- 3
В «Цвете» выберите одну из палитр или задайте сплошную или градиентную заливку и переключите стиль на контур, если нужна только кромка.
- 4
Задайте ширину и высоту холста, при необходимости включите цвет фона и включите морф-анимацию для движущейся формы.
- 5
Нажмите «Скачать SVG» либо выберите масштаб PNG 1×, 2× или 4× и нажмите PNG. «Копировать SVG» и «Копировать React» кладут код в буфер.
Частые вопросы
Можно ли позже получить тот же блоб?
Да. Форма берётся из зерна, поэтому то же зерно с теми же настройками всегда даёт тот же блоб. Запомните число и введите его обратно в «Зерно».
Фон прозрачный?
Да, по умолчанию. Включайте цвет фона, только если нужен залитый холст.
Работает ли анимация в экспортированном файле?
Морф-анимация использует встроенный элемент animate SVG, поэтому играет в экспорте SVG и React без дополнительного CSS или JavaScript. PNG всегда неподвижный кадр.
Как использовать блоб в проекте React?
«Копировать React» даёт компонент, который возвращает SVG и передаёт props элементу svg, поэтому можно добавить className или style.
Что-нибудь загружается?
Нет. Формы считаются и экспортируются целиком в браузере.