教你快速用ps導(dǎo)出svg圖標(biāo)!

  • A+
所屬分類:ps

大家好!我們現(xiàn)在使用svg已經(jīng)成為了最近兩年的web設(shè)計的新趨勢,越來越多的前端開發(fā)人員要求設(shè)計師使用并提供svg圖標(biāo),svg圖標(biāo)相較于iconfonts有很多很多的優(yōu)點(diǎn)。對于svg圖標(biāo)的輸出,作為一個菜鳥的我以往很菜很麻煩的做法就是遇到圖標(biāo)就用ai去畫,然后再導(dǎo)成svg圖標(biāo),但是,我有一個很不舒服的習(xí)慣,那就是在做頁面的時候用ps把缺失的icon也畫出來,然后就這樣的一個切換軟件應(yīng)用,這樣是很麻煩的。今天,這個教程就是快速用ps導(dǎo)出svg圖標(biāo)的操作方法,我們大家可以看一看,希望對大家有所幫助。

操作步驟如下:

1、下載腳本

首先,我們需要先下載一個附件里面的腳本文件。

教你快速用ps導(dǎo)出svg圖標(biāo)!

2、復(fù)制腳本

接下來,我們需要將這個腳本復(fù)制到我們電腦上的ps安裝文件中,在我們的安裝文件中有一個scripts文件夾,把腳本復(fù)制進(jìn)去。

教你快速用ps導(dǎo)出svg圖標(biāo)!

3、添加svg后綴

打開你需要轉(zhuǎn)化svg的icon PS文件,首先要保證你的圖標(biāo)繪制規(guī)范:為形狀工具繪制,命名要規(guī)范,然后將添加【.svg】后綴。

教你快速用ps導(dǎo)出svg圖標(biāo)!

4、快速導(dǎo)出為svg

你把鼠標(biāo)放到任意個icon圖層上,點(diǎn)擊右鍵,都會看到一個“快速導(dǎo)出為svg”的選項(如果沒有,說明腳本沒有安裝成功,或者ps版本太低)。就是全部選中圖標(biāo)圖層,點(diǎn)擊右鍵依然會有“快速導(dǎo)出為svg”的選項(此刻無法截圖),毫不猶豫地選擇他,然后保存到指定的文件夾。接下來打開那個保存的文件夾。

教你快速用ps導(dǎo)出svg圖標(biāo)!

以上的內(nèi)容就是快速用ps導(dǎo)出svg圖標(biāo)的操作方法了,不知道各位小伙伴看了以后有沒有什么感覺呢?是不是感覺一點(diǎn)兒也不難!有興趣的小伙伴可以動手試一試!好了,我們今天的分享就到這了,大家下次再見!

歷史上的今天:

推薦應(yīng)用

發(fā)表評論

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: