🌊 Один набор инструментов для
любой задачи проектирования

Генератор SVG-волн

Создавайте плавные SVG-волны-разделители для сайта — настройте амплитуду, длину и слои, скопируйте SVG.

English 中文 日本語 한국어 Español Português Français Deutsch العربية हिन्दी ไทย Tiếng Việt Bahasa Русский

🌊 Генератор SVG-волн

Руководство по генератору SVG-волн

Волны-разделители — это SVG-фигуры, плавно отделяющие секции страницы: фирменная деталь современных hero-секций, футеров и лендингов приложений. SVG остаётся чётким при любом размере экрана.

Настройте амплитуду, длину волны и слои, выберите цвет заливки и скопируйте SVG. Вставьте инлайн в HTML или сохраните как .svg-файл и используйте как обычное изображение.

Pro Tips

Frequently Asked Questions

Q: Как встроить волну в страницу?
Как встроить волну в страницу? Скопируйте SVG и вставьте инлайн в HTML, либо сохраните код как .svg-файл и подключите тегом <img>.
Q: Можно ли отразить направление волны?
Можно ли отразить направление волны? Да — добавьте transform="scaleY(-1)" к SVG или поменяйте начало и конец path, и волна изогнётся в другую сторону.
Q: Почему SVG, а не PNG?
Почему SVG, а не PNG? SVG чёткий при любом разрешении, весит несколько сотен байт, и его можно перекрашивать и анимировать через CSS.
Q: Как сделать волну на всю ширину?
Как сделать волну на всю ширину? SVG использует preserveAspectRatio="none" и width:100%, поэтому растягивается на любую ширину контейнера без искажений.
Q: Можно ли анимировать волну?
Можно ли анимировать волну? Да — оберните SVG в контейнер с overflow:hidden и анимируйте его позицию CSS-кейфреймами — получится катящаяся волна.

Русские традиционные цвета

От гжельской синевы до хохломского золота — русская палитра рождена народными промыслами, иконописью и северной природой. Эти цвета до сих пор вдохновляют дизайнеров по всему миру.

Алый #FF2400

Алый цвет знамён, сарафанов и праздничной символики

Васильковый #6495ED

Цвет полевых васильков — символ русских лугов

Золото Хохломы #D4AF37

Золотой орнамент хохломской росписи

Гжель Синий #005A9C

Кобальтовая синева гжельской керамики

Изумрудный #50C878

Цвет уральских самоцветов и малахита

Бордовый #800020

Тёмно-красный цвет театральных занавесов

Янтарный #FFBF00

Балтийский янтарь — золото Калининграда

Сиреневый #C8A2C8

Нежная сирень майских садов

Охристый #CC7722

Цвет иконописи и древних фресок

Снежно-белый #F8F8FF

Белый снег русских зим

Q: Что такое гжель?
Что такое гжель? Гжель (#005A9C) — традиционная русская керамика с синей кобальтовой росписью на белом фоне, производимая в Подмосковье с XVIII века и ставшая символом русского народного искусства.
Q: Что такое хохлома?
Что такое хохлома? Хохлома — традиционная деревянная роспись с золотым орнаментом (#D4AF37) на чёрном или красном фоне, создаваемая в Нижегородской области с XVII века.