20 Корисни СВГ алати за бољу графику

СВГ данас добија на популарности у веб дизајну и можете користити алате као што су Иллустратор или Инксцапе да бисте креирали СВГ графику. Али када је у питању веб дизајн, увек треба да оптимизујемо за лакше резултате.

Хере тхе 20 алата које можете користити за рад са СВГ-ом брзо и ефикасно. Имамо углавном онлине алате, који могу помоћи у оптимизацији, конверзији, изради узорака и још много тога.

Интерактивни СВГ координатни систем

Када радите са СВГ-ом не можете напустити његову координату. Ово је сјајан интерактивни алат Сара Соуиден, који ће вам помоћи сазнајте како СВГ координира рад. Помоћу виевБок и пресервеАспецтРатио на СВГ-у, вођени наранџастим и љубичастим линијама и практичним равнилом, можете играти док учите како СВГ координира функцију.

б64

б64 је једноставан алат оптимизујте слике и претворите их у басе64 формат. Можете да испустите СВГ слике (други формати као што су ЈПГ и ПНГ радови), а затим ухватите ЦСС са басе64 позадинском сликом као резултат.

СВГО

СВГ који се извози може да садржи непотребне информације који се могу уклонити без утицаја на резултат рендеровања. Ако желиш да уклањање метаподатака, коментара или скривених елемената, можете користити СВГО.

СВГО се може инсталирати преко нпм, $ [судо] нпм инсталл-г свго или користите ГУИ верзију која нуди повлачење и испуштање за обраду СВГ оптимизације.

СВГ ОМГ

СВГ ОМГ окреће командну линију СВГО (претходни алат) у а ГУИ верзија интуитивнији и лакши за употребу. Само пребаците дугмад да бисте активирали или деактивирали сваку функцију. На крају можете да дохватите резултат и као сликовне датотеке и код.

СВГ Нов

Када радите на Иллустратору, извезени СВГ садржи неке информације које нису потребне. Са овим алатом ћете добићете оптимизовану верзију извезеног СВГ-а право из радног простора Иллустратор. Овај алат додаје панел са неким опцијама за оптимизацију СВГ-а. СВГ Нов можете добити са странице Цреативе Цлоуд Адд-онс.

СВГ то ПНГ цонвертер

Желим да извоз СВГ датотека у ПНГ форму? Без отварања апликација као што је Иллустратор? Користите овај алат за конверзију СВГ-а у ПНГ да бисте добили излазе слика у ПНГ формату и ПНГ Басе64 УРИ података ако вам је потребан.

СВГ Цирцус

Ако мислите да су анимације за пуњење кул, сада их можете лако креирати користећи СВГ са СВГ Цирцус. Алати вам омогућавају направите свој властити утоваривач, спиннер или нешто слично користећи анимацију у петљи. Подесите 'Ацтор', положај, величину, боју и друге на панелу, а затим извезите да бисте добили резултате.

СВГ Сприте

СВГ Сприте је Ноде.јс модул који оптимизира хрпа СВГ датотека, и пече их у СВГ сприте-типове укључујући традиционалне ЦСС спритеове за позадину и / или слике у предњем плану, СВГ стацкове и још много тога.

Квази

Са квази можете генерисање квазикристалних слика воле оно што видите испод. Овај генератор је експериментални, али резултати су свакако цоол. Можете да се играте тако што ћете променити вредност опција, а затим преузети резултате помоћу дугмета "Сачувај СВГ".

Плаин Паттерн

Креирање узорака са СВГ-ом никада није било лакше или забавније. Поставите слику, смањите или промените размак, ротирајте и обојите док не добијете леп узорак. Можете прегледати резултат пре него што га преузмете.

Трианглифи Генератор

Направите прекрасне СВГ геометријске обрасце са Трианглифи Генератор. Можете подесити случајност / варијацију боја, величину грануларности и одабрати палету боја за рад. Овај алат је ГУИ верзија програма Трианглифи.

СВГ Градиент

Знате да можете направити градијенте са ЦСС-ом, али да ли сте знали да можете учинити исто са СВГ-ом? Најлакши начин генеришите градијент на СВГ је помоћу овог алата. Само унесите старт и стоп боју, онда ћете добити код за генерисани резултат. Укључена је и резерва за ЦСС.

Извези ПСД у СВГ

Ако користите Пхотосхоп као едитор слика за свој рад, понекад ћете можда морати претворите свој дизајн у Пхотосхоп радни простор у СВГ, који је неподржани формат у Пхотосхопу. Преузмите скрипту у овај алат, а затим копирајте у Адобе Пхотосхоп / пресетс / сцриптс фолдер.

Преименујте име векторског слоја са СВГ екстензијом (нпр. Лаиер1 постаје лаиер1.свг), а сада можете да покренете скрипту из Датотека> Скрипте> ПС у СВГ.

СВГ Филтерс

Да ли знате да са СВГ-ом можете да додате ефекте као што су хуе, сатуратион, блур, линеарни преклапање боја и многи други на слике? Ово је алатка визуализира ове ефекте, а затим вам даје исјечак да би било лакше уградите ефекат у ваш пројекат.

СВГ Морпхеоус

СВГ Морпхеоус је ЈаваСцрипт библиотека која вам омогућава претворите СВГ икону из једног облика у други. Можете подесити ефекат ублажавања, трајање прелазних анимација, као и смер ротације.

Генератор путање клипа

СВГ вам омогућава да кликнете на снимак слике са Схапе. То је прилично лако ако је облик у облику квадрата или круга. Али шта ако је облик један са много тачака или је полигонални облик? Ту вам је потребан алат Цлип Патх Генератор.

Цхартист.јс

Цхартист.јс је библиотека за креирајте прилагодљиве графиконе. Она користи СВГ да прикаже графиконе, који се такође могу анимирати помоћу СМИЛ-а. Помоћу ове библиотеке можете да креирате линијски графикон, графикон, бар графикон и друге врсте графикона, па чак и да им додате анимацију.

СВГ строке дасх генератор

Ово је једноставан алат генерише испрекидане линије користећи СВГ строке-дасхарраи. Прво изаберите један тип цртице са листе, а затим га прилагодите у смислу ширине, висине, ротације или боје. Након тога можете узети ХТМЛ код и ЦСС да бисте применили ову цртицу у вашем пројекту.

Метод Драв: Једноставан СВГ Едитор

Метод Драв је веб-базирани СВГ едитор, са интуитивно сучеље које долази с алатима на обје стране платна. Можете нацртати линије, облике, уносити текст или користити уграђене облике, а затим уредити својства нацртаних објеката. Извезите слику у СВГ формату (такође долази у СВГ басе64 формату) или сачувајте директно у ПНГ.

Извезите Фласх у анимирани СВГ

Иако више није популарна, постоји шанса да неки од вас тешко пуштају Фласх. Ако је тако, можете претворите вашу фласх анимацију у СВГ како бисте је одржавали компатибилно са новим технологијама. Овај алат формира проширење за Фласх апликацију и може радити на ЦС5, ЦС6 и ЦЦ.

Можете извести у СВГ када су у питању Облици, Битмап симболи, Цлассиц Мотион Твеенс, Схапе твеенс (за друге постоји увјерљив успјех).