Дизайнерите получават безплатни SVG фонови модели от геройски модели
Всички съвременни уеб браузъри поддръжка на SVG и е най-гъвкавия формат на изображението можеш да използваш. Но проектиране на персонализирани SVG от нулата не е лесна задача.
Ето защо подобен инструмент Модели на героя може да бъде толкова ценен за дизайнерите. Това е безплатна библиотека на повторяеми SVG шаблони че можете персонализирате с различни стилове, цветове и мътност.
Hero Patterns е добре над 40 различни модела за да изберете и всички те са изброени точно на началната страница. Когато превъртите надолу, ще видите демонстрации на живо за всеки от тях и можете да кликнете върху някой от тях, за да видите как изглеждат.
В горната част на страницата ще намерите фиксирана лента с настройки за променете цветовете на преден план и фон. Цветът на фона се отнася за плоска повърхност и цветът на преден план се отнася за модели в SVG.
Благодаря на естествен стил на смесване, трудно е да се измисли лошо комбинирано оцветяване (макар със сигурност все още е възможно). Моделите варират от дама да се подробно повтарящи се икони като котви.
Когато откриете модел, който искате просто кликнете върху този блок за модален прозорец с повече подробности. Оттук можете да регулирате цветове на преден план / фон, заедно с непрозрачност на преден план за икони.
Но истинската магия се случва в полето на кодовия фрагмент където можете копирайте CSS да вградите SVG само чрез код. В CSS има base64 ()
метод конвертиране на данни от низ в SVG данни. Това е доста често и работи и с други изображения като PNG.
Така че, ако не искате SVG файлът да се съхранява локално, можете просто копирайте / поставете CSS кода направо във вашата таблица със стилове. Това ще вградете повтарящия се фон с правилни цветове направо във вашия сайт. Колко яко!
Или, ако предпочитате редактирайте SVG можеш изтеглете копие на нередактираното SVG изображение. По този начин можете направете всички редакции ръчно в софтуер за проектиране като Illustrator.
Hero Patterns е един от малкото инструменти, които позволяват на дизайнерите да вземат пълен контрол над SVG направо от браузъра. Повтарящите се фонове са разчитали единствено на PNG, но уеб стандартите са напреднали достатъчно SVG могат да заемат тяхното място.
Да се Първи стъпки, посетете началната страница на Hero Patterns и прегледайте библиотеката с образци. Нови модели добавяйте често, така че не забравяйте да проверявате отново толкова често.