這是本文件的舊版！

SVG

數位製圖！向量不失真！

優點

• 支援 CSS
  • 所以可以設定 class，迅速批次套用樣式（字型啦、顏色啦）到眾多物件！
• 支援 font-family fallback！
• 透過數字，精準定位物件！

Tips

編輯器

線上：

• ⭐ Method Draw SVG Editor 好用耶！
  • 原始碼編輯模式乾淨，不會亂加多餘 SVG 碼，簡直像是 SVG 界的 BlueGriffon 啊啊啊～
    • 透過 Fx/Wx 的 GhostText，甚至還可餵到 Sublime Text 進行更方便的編輯！
    • 然後我也用瀏覽器的 Stylish 放大了原始碼編輯框的字型、設定更好看的字型
  • 圖形介面也還是很方便
  • 這樣比 Google Docs 的 Draw 還好用啦！

  • ^20201002 不過鑒於它有時候還是有點 bug 亂改原始碼，比方說 有時新增物件卻導致背景圖樣的長寬被改掉；有時只是更動物件位置，原始碼的 attribute 卻通通都被大搬風 ∴今天也搭配檔案比較工具 Sublimerge，另存暫時檔後找到被改壞的部分，再把真正需要改的部分手工更新到檔案裡即可

• Janvas：很強，更強，但進入門檻高得多

App：

• InkScape：雖然是重量級向量繪圖軟體，但似乎反而不是完整支援 SVG 的語法耶

參考

• SVG 完整教學 31 天 - OXXO.STUDIO