Генератор SVG-блобов
Создавайте красивые органичные SVG-фигуры для дизайна.
SVG
<svg viewBox="0 0 600 600" xmlns="http://www.w3.org/2000/svg"> <defs><linearGradient id="g" gradientTransform="rotate(45 0.5 0.5)"><stop offset="0%" stop-color="#6366f1"/><stop offset="100%" stop-color="#ec4899"/></linearGradient></defs> <path d="M 452.81,300.00 C 459.68,354.34 456.02,471.39 414.75,498.76 C 373.48,526.12 261.47,497.32 205.20,464.19 C 148.94,431.06 78.41,356.90 77.15,300.00 C 75.90,243.10 148.28,143.98 197.67,122.77 C 247.07,101.55 330.98,143.16 373.50,172.70 C 416.02,202.24 445.93,245.66 452.81,300.00 Z" fill="url(#g)"/> </svg>
Рекомендуемые инструменты
Подборка полезных утилит
Генерация органических SVG-блобов
Обзор
Блобы — мягкие неровные органические формы — популярный способ добавить дизайну дружелюбный современный штрих как фон, маску изображения или декоративный акцент. Нарисовать гладкий блоб вручную непросто, поэтому генератор блобов создаёт случайные органические формы в SVG, которые можно настроить и экспортировать. Инструмент строит блобы в браузере и даёт чистый SVG-код для любой страницы.
Как пользоваться (по шагам)
- 1
Настройте сложность и случайность
Задайте число точек и неровность блоба, пока форма не станет подходящей.
- 2
Выберите цвет и перегенерируйте
Выберите цвет заливки и генерируйте новые варианты, пока не найдёте понравившийся.
- 3
Скопируйте SVG
Возьмите сгенерированный SVG-код или экспортируйте его и разместите в странице или дизайне.
Как это работает
Генератор создаёт замкнутый путь с несколькими точками вокруг центра, соединяет их плавными кривыми и рандомизирует их расстояние, получая неровную, но уравновешенную форму. Вы регулируете сложность (число точек) и случайность (насколько неровно), выбираете цвет — и он выдаёт SVG. Будучи вектором, блоб масштабируется чётко при любом размере. Всё работает локально в браузере.
Когда пригодится
Добавить мягкую фоновую форму за текстом или иллюстрацией. Замаскировать фото в органический контур вместо прямоугольника. Создать дружелюбные декоративные акценты для лендинга. Собрать современный негеометрический hero-фон. Сделать сочетающиеся блобы в цветах бренда. Экспортировать лёгкую векторную форму вместо тяжёлого изображения.
Частые вопросы
Как вектор, SVG-блоб остаётся идеально чётким при любом размере, весит очень мало и перекрашивается правкой значения. Растровое изображение той же формы тяжелее и размывается при увеличении.
Важные замечания
Каждый сгенерированный блоб случаен, так что сохраняйте SVG-код, как только найдёте понравившийся — перегенерация не воспроизведёт точно ту же форму. Очень высокая сложность может сделать путь большим и труднее для плавной анимации.