Дизайнери отримують безкоштовні SVG фонові візерунки з шаблонів героя

Всі сучасні веб-браузери підтримка SVG і це Найбільш гнучкий формат зображення можна використовувати. Але розробка користувацьких SVG з нуля Це нелегке завдання.

Ось чому подібний інструмент Шаблони героя може бути настільки цінним для дизайнерів. Це безкоштовна бібліотека Росії повторювані SVG шаблони що ви можете налаштувати з різними стилями, кольорами та непрозорістю.

Шаблони героя добре більше 40 різних моделей для вибору і всі вони перераховані прямо на домашній сторінці. Коли ви перейдете вниз, ви побачите живі демонстрації для кожного з них Ви можете натиснути будь-яку з них, щоб побачити, як вони виглядають.

У верхній частині сторінки ви знайдете фіксовану панель із параметрами змінюйте кольори переднього плану та фону. Колір фону стосується Пласка поверхня і колір переднього плану застосовується до шаблонів у SVG.

Завдяки Стиль натурального змішування, Це важко придумати поганий колір комбо (хоча, звичайно, все ще можливо). Шаблони варіюються від шашки до докладні повторювані іконки як якорі.

Коли ви знайдете шаблон, який вам подобається натисніть цей блок для модального вікна з більш детальною інформацією. Тут ви можете налаштувати кольори переднього плану / фону, разом з непрозорість переднього плану для ікон.

Але справжня магія відбувається у вікні фрагмента коду де можна скопіюйте CSS для вбудовування SVG чисто через код. У CSS є base64 () метод до конвертувати рядкові дані в дані SVG. Це досить поширена вона також працює з іншими зображеннями, такими як PNG.

Отже, якщо ви не хочете, щоб файл SVG зберігався локально, ви можете просто скопіюйте / вставте код CSS прямо у таблицю стилів. Це буде вставляє повторювану фонову картину з правильними кольорами прямо на вашому сайті. Як класно!

Або, якщо ви бажаєте редагуйте SVG самостійно ти можеш завантажте копію незміненого зображення SVG. Таким чином ви можете виконувати всі редагування вручну в розробці програмного забезпечення, як Illustrator.

Шаблони героїв є одним з небагатьох інструментів, які дозволяють дизайнерам повний контроль над SVG від браузера. Повторювані фони використовувалися лише для використання PNG, але веб-стандарти просунулися досить далеко SVG можуть зайняти їхнє місце.

До почати, просто відвідайте домашню сторінку шаблонів героя та переглядати бібліотеку зразків. Нові моделі часто додаються, так що не забудьте перевірити щоразу.