Генератор візерунків
Створюйте безшовні SVG-візерунки для тла з майже 2000 дизайнів: змінюйте кольори, масштаб, інтервали й кут, копіюйте CSS або завантажуйте SVG, PNG, WebP.
1Виберіть візерунок
Немає візерунків, що відповідають цим фільтрам.
2Виберіть кольори
3Налаштуйте візерунок
4Додайте анімацію (за бажанням)
За один цикл візерунок зсувається рівно на одну плитку, тому анімація йде без ривків. Рух зберігається в коді та у файлі SVG; файли зображень залишаються нерухомими.
5Копіювання або завантаження
Тут буде ваш заголовок
Подивіться, як візерунок виглядає за справжнім вмістом.
ПочатиОгляд за колекціями
Про Генератор візерунків
Генератор візерунків перетворює майже 2000 готових дизайнів на тла, які можна налаштувати й одразу використати. Переглядайте 14 колекцій: від хвиль, горошку та тесселяцій до тартанів, японських сейгайха, ісламських зірок, віял ар-деко, піксельних спрайтів і камуфляжу, і дивіться кожен візерунок у своїх кольорах.
Кожен дизайн намальовано як векторну графіку, і він повторюється без видимих швів за будь-якого масштабу та будь-якого кута. Змінюйте до шести кольорів, масштаб, положення, інтервали, товщину ліній і кут, перетворюйте залиті форми на контури або додайте візерунку зациклену анімацію. Генеративні візерунки, як-от топографічні карти, комірки Вороного й плитки Трюше, можуть давати новий варіант за кожним натисканням.
Коли результат вас влаштує, скопіюйте його як CSS, SCSS, конфігурацію Tailwind, вбудований SVG, data URI або компонент React чи завантажте SVG, PNG, JPG або WebP будь-якого розміру до 8000 пікселів, зокрема окрему плитку для власного повтору. Усе працює у вашому браузері: нічого не завантажується на сервер, реєстрація не потрібна.
Як використовувати Генератор візерунків
- Виберіть візерунок: шукайте за назвою або фільтруйте за колекцією та кількістю кольорів.
- Виберіть кольори за допомогою палітри, готового набору або кнопки «Нова палітра».
- Налаштуйте масштаб, положення, інтервали, товщину ліній і кут. Зафіксуйте будь-яке значення перед натисканням «Надихніть мене».
- Перевірте результат у режимах «Показати плитку», «На сторінці» та «У тексті».
- Скопіюйте код або завантажте файл, а за допомогою «Копіювати посилання» ви зможете пізніше повернутися саме до цього візерунка.