字型建構器
用已轉為輪廓的 SVG 圖形建構圖示字型和網頁字型,或在基於 TrueType 的靜態來源字型中新增和替換字形。
Font Builder 旨在用規範的向量圖形可靠地製作字型。對於不支援的 SVG 和字型特性,它會拒絕處理,而不是悄悄修改。
用 SVG 建構新字型
如果已有圖示圖形,並希望以字型形式發布,請使用以下流程。
- 開啟
Font Builder。 - 將已轉為輪廓的 SVG 檔案拖入字形清單。
- 檢查字形名稱和 Unicode 值。
- 執行
Preflight Check。 - 匯出
TTF、WOFF、WOFF2、CSS、示範 HTML、中繼資料或完整的網頁字型套件。
在來源字型中新增或替換字形
Font Builder 可以匯入基於 TrueType 的靜態來源字型。
- 向來源字型新增 SVG 字形。
- 用 SVG 圖形替換現有 Unicode 字形。
- 使用
Browse Glyphs從來源字型中選擇替換目標。 - 編輯來源字型時保持被替換字形的 ID 穩定。
- 如果需要稍後繼續,將工作儲存為
.webfontproject。
SVG 要求
Font Builder 要求使用已轉為輪廓的靜態 SVG 圖形。
匯入之前,應將圖形效果平面化。不支援的輸入包括可編輯 SVG 文字、點陣圖、濾鏡、遮色片、裁切路徑、指令碼、動畫、影片、音訊、iframe 和外部資源。
SVG 範本
繪製圖示之前,請先匯出 SVG 範本。範本包含基線和邊界參考線,便於在匯入前讓圖示與字型度量對齊。
網頁字型套件輸出
網頁字型套件可包含:
- 字型檔案。
- 包含
@font-face的 CSS。 - 示範 HTML。
- 中繼資料。
- 字形預覽。
- 用於圖示字型的 HTML 片段。
最佳實務
- 圖示字型使用 Unicode 私用區的值,除非明確需要標準 Unicode 對應。
- 保持圖示 SVG 在視覺上置中,並對齊到相同畫布。
- 每次匯出之前都執行預檢。
- 發布正式字型之前修復紅色列中的問題。