photoshop自動切圖,導出svg,支持阿里巴巴圖標庫上傳相互轉換


安裝最新版的ps cc 此文中用的是2018版的

將PS圖層轉換成SVG文件的免費腳本

首先,需要下載一個腳本文件 save-ps-to-svg1.0.jsx,關於此文件的最新信息,可以到  官網查看,將此文件放到  PS 安裝目錄下的  /Presets/Scripts 文件夾中,如果放置腳本的時候  PS是打開狀態,那么可能需要重啟一下。

重啟之后可以看到

這樣就可以進行下一步了

自動切圖:

前端開發人員經常需要將很多圖層切出成獨立的圖片。有了自動切圖功能,無需花更多時間來切圖了。只需在圖層名后添加相應格式后綴(如.png),即可自動輸出所需格式的圖片。

1. 編輯-首選項-增效工具中的“生成器”為啟用狀態

2. 文件->生成->圖像資源, 確認該菜單項已被勾選

3. 修改某個圖層命名(如 test.svg),然后檢查當前 psd 文件所在目錄下的“文件名-assets” 的目錄,打開此目錄,發現 test.svg 已經在里邊了(同樣適用png等)

注意:修改圖層命名前確保此圖形是一個完整的圖形(避免出現導出的svg缺邊少角)

 

可以打開看一下

可以看到這個里邊的代碼跟我們在阿里巴巴圖標庫上下載的還是有點出入的

這個時候可以直接把從pds導出的svg上傳到阿里巴巴圖標庫再導出為svg就變成上圖右邊的樣子了,當然也可以導出其它格式的,如下圖

這樣就實現了psd導出為svg了(如果要更改顏色請去掉path中的fill屬性)

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM