如何將圖示向量化

抗鋸齒是這裡的頭號敵人。在 32 像素的圖示上，每一條斜線旁邊的柔和灰階像素就佔掉整張圖很大一部分，引擎無從得知它們本該是一條利落的邊緣，而不是真實的中間色調。換成 512 像素的版本，同樣那條邊就只是 1 個像素的過渡，兩側是四十九個乾淨像素——形狀清晰無誤。

如果圖示是單色的，轉換前就讓它名副其實地單色：透明底上的純黑，或白底上的純黑，不要柔和陰影，也不要若有似無的內光暈。這些效果每一種都會變成輸出裡的形狀，而輸出裡的形狀，就是你之後得找出來刪掉的節點。

在你平常檢視的尺寸下，幾乎任何描圖結果都看得過去。真正該做的檢驗是節點數：把路徑展開，數一數錨點。畫得好的圖示，只在曲線真正轉向的地方有點——圓角方形 8 個、圓形 4 個、V 形箭號 3 或 6 個。如果一個簡單形狀轉出來帶了 60 個節點，代表引擎一直在追著像素雜訊跑，這個形狀之後會算得慢、編輯起來彆扭，放大縮小時也總有說不上來的怪。

Lite 以上可以直接用細節設定控制這件事：細節調得越低，合併得越積極，節點更少也更乾淨。把細節往下調，調到角剛開始變圓就停，再往回退一格。Free 的等級由引擎自動決定，你能影響它的方式，就是把來源圖做好。

圖示集有網格——通常是 24×24、留兩像素安全邊距，或是密集介面用的 16×16。描出來的路徑落在像素原本所在的位置，很接近網格但不在網格上，而在小尺寸顯示時，「很接近」正是讓一排圖示裡某一個看起來比旁邊重半個像素的原因。

在編輯器裡把完成的路徑貼齊整數座標，並把 SVG 的 viewBox 設成你的網格尺寸。第一次做很瑣碎，之後就是純機械操作，而這正是一部看得出「被設計過」和一部看得出「被轉檔過」的圖示集之間的分別。

如果你要重做一整個圖示集，就用同一個批次把它們全部轉換，讓每個檔案經過完全相同的設定，之後再手動把整組的線條粗細統一。一套圖示之所以看起來是一家人，是因為線條互相匹配；分了好幾次個別描出來的一組圖示就是合不起來，而且就算單看每一顆都不覺得怪，那種不一致依然看得出來。

批次轉換從 Pro 開始提供，一次可處理 30 個檔案。更低的方案一次轉一個，以二十顆圖示來說，就是多點幾分鐘的滑鼠，不算什麼阻礙。