跳至內容

WebFont/macOS 應用程式

專注於字型工作流程
用 SVG 建構字型,產生子集與格式轉換,交付可用於 Web 的字型

WebFont 是一款本機 macOS 應用程式,支援文字轉 SVG、以 SVG 圖形建構圖示與彩色字型、字型子集化、格式轉換和網頁字型包產生。


工作流程

用 SVG 建構字型,用文字產生子集。

WebFont 將文字輪廓匯出、SVG 字型建構、來源字型替換、子集、轉換、驗證和網頁字型套件產生整合到本機 macOS 流程中。

建立文字與字形圖形

將單字、片語和多行文字轉為 SVG 輪廓,可調整全部可用可變軸;或準備輪廓 SVG 圖形來建構圖示及網頁字型。支援的彩色字形會保留原有顏色。

建構或編輯字型

用 SVG 字形建構單色或彩色字型。可將支援的彩色字形作為素材重新建構,或編輯符合要求的靜態、非彩色 TrueType 來源字型。

檢查並發布輸出

執行預檢並驗證字型,然後匯出 TTF、WOFF、WOFF2、字形素材,或包含 CSS、示範 HTML 和中繼資料的網頁字型包。


功能

目前應用程式支援的功能

文字轉 SVG 輪廓

將文字轉換為 SVG 輪廓,可調整字級、全部可用可變軸、間距、換行、對齊和後備字型。支援的向量彩色字形會保留原有顏色,點陣彩色字形以內嵌 PNG 保留,單色圖形使用選定的填色。文字轉 SVG 不會匯出靜態字型實例。

單字與句子
全部可變軸
彩色字形
字型建構器

用靜態 SVG 素材建構單色或彩色字型。彩色模式透過 COLR/CPAL 保留支援的填色、描邊、線性/徑向漸層和透明度,並為支援的漸層/效果字形提供 SVG 後備。可新增適用於淺色或深色背景的調色盤,匯出 TTF、WOFF、WOFF2 或網頁字型包。

單色與彩色
COLR / CPAL
網頁字型
來源字型編輯

保留來源字型結構的新增/取代字形,僅支援符合要求的靜態、非彩色 TrueType 字型。另外可將支援的 COLR/SVG 字形作為向量素材匯入,重新建構字型;不支援的彩色效果或點陣圖匯入可能改用單色輪廓,並顯示提示。

新增字形
替換 Unicode 字形
穩定的字形 ID
預檢

匯出前回報 Unicode 衝突、重複字形名稱、空路徑、異常 SVG 尺寸、度量問題、不支援的 SVG 特性和過於複雜的圖形。

紅黃綠狀態
SVG 檢查
字型度量
專案檔案與範本

儲存含來源字型資料、SVG 字形、建構設定、輸出選項和替換目標的 .webfontproject。繪圖前可匯出帶參考線的 SVG 範本。

.webfontproject
內嵌字型資料
SVG 範本
子集產生

可從所選字形、貼上文字、.txt 檔案或 Unicode 預設產生子集。支援 TTF、OTF/CFF/CFF2、WOFF、WOFF2 及選定的 TTC/OTC 字型,包含可變字型和彩色字型。可匯出保留原輪廓的 TTF/OTF、WOFF 和 WOFF2,或在 Export 面板烘焙靜態實例。

TTF / OTF / WOFF / WOFF2
TTC / OTC 字型
靜態實例
Web 字型轉換

封裝/解封裝 WOFF/WOFF2 時保留原始輪廓、可變軸和彩色資料。明確選擇 TTF/OTF 輪廓目標,可轉換支援的靜態 TrueType ↔ CFF、可變 TrueType(glyf/gvar)↔ CFF2,並保留支援的 COLR v0/v1、OpenType-SVG 彩色資料。詳細限制見下方相容性表格。

TTF ↔ OTF
WOFF / WOFF2
批次轉換
網頁字型套件與驗證

匯出字型檔案、@font-face CSS 和示範 HTML;Font Builder 的網頁字型包還會包含 metadata.json、字形預覽和 HTML 片段。彩色示範頁在支援時提供調色盤控制項,靜態實例匯出會寫入相符的 font-weight/stretch/style CSS。輸出字型會進行驗證,Web 格式也會解碼複查;顏色效果能否顯示取決於目標瀏覽器或軟體。

CSS 與示範 HTML
metadata.json
往返轉換檢查
彩色字形預覽與匯出

在 macOS 支援對應格式時預覽原始顏色,CBDT PNG 字形另有內建點陣圖讀取器。可匯出 PNG/PDF,支援的 COLR/SVG 圖形可匯出向量 SVG;點陣圖字形或無法以 SVG 準確表達的效果會匯出為 SVG 內嵌 PNG。

COLR / SVG 顏色
支援時匯出向量 SVG
點陣圖備援
字形素材匯出

瀏覽字形格狀檢視,將單一字形或多選字形匯出為 SVG、PNG 或 PDF。匯出可設定尺寸和前景色;支援的彩色字形會保留顏色。可變字型實例設定不會影響字形素材匯出。

SVG / PNG / PDF
單一或批次
尺寸與顏色

適用情境

實際字型製作工作

圖示字型製作

用輪廓 SVG 符號建構圖示字型、對應 Unicode、執行預檢,並匯出瀏覽器可用的字型套件。

文字圖形與字形設計

將單字、片語和多行文案轉為真實字型輪廓,用於標誌、文件、交付、海報和 SVG 設計素材。

網頁字型最佳化

根據字形或文字產生子集,保留必要 OpenType 特性,僅發布產品需要的網頁字型格式。

字型發布檢查

驗證產生的 TTF、OTF、WOFF 和 WOFF2,查看字元涵蓋範圍與警告,並在發布前檢查示範頁面。


支援範圍

明確規則,安心輸出

WebFont 明確回報行為,不悄悄修改內容。遇到不支援的 SVG 或字型特性會提示,讓你在發布字型前修復圖形。

  • 字型建構器要求靜態輪廓 SVG,不支援即時文字、點陣圖圖片、遮色片、濾鏡、指令碼、動畫和外部資源;彩色模式也會拒絕圖樣填色和不支援的混合效果。
  • 保留現有字型結構的來源字型編輯,僅支援符合要求的靜態、非彩色 TrueType 字型。匯入彩色字形素材並重建新字型是另一個流程。
  • 每次對一個來源字型或選定的 TTC/OTC 成員產生子集,保留原始輪廓、可變軸及受支援的彩色資源。
  • 文字轉 SVG 會保留支援的向量彩色字形,點陣彩色字形以內嵌 PNG 保留;填色只作用於單色圖形。可變軸控制項只改變輸出圖形,不會產生靜態字型檔案。
  • 所有處理都在 Mac 本機進行,應用程式不會上傳字型檔案。
  • 輪廓轉換保留字形 ID,以及支援的 COLR v0/v1、CPAL、OpenType-SVG 資料;符合要求的可變字型保留全部可變軸。轉換會移除原始 hinting,曲線近似可能改變顯示效果和檔案大小;點陣圖及不相容的排版/可變資料會被拒絕並說明原因。
  • 彩色顯示依賴繪製程式的支援。支援的 COLR/SVG 字形匯出為向量 SVG;點陣圖字形或無法準確表達的效果使用內嵌 PNG。保留資料不代表所有軟體都能正確顯示。
  • 主介面字形格狀檢視以預設實例預覽可變字型,並識別可變軸。Export 面板提供「保留全部軸」和「靜態實例」兩種模式:前者匯出可變字型,後者將目前軸值烘焙進字型子集和 Web Package 輸出;未列出的軸固定為預設值,字型內部的名稱及字重/樣式中繼資料不會被改寫。

轉換相容性

TTF、OTF 與 Web 字型格式轉換規則

WOFF/WOFF2 封裝改變容器,不改變輪廓類型。TTF/OTF (original outlines) 將 TrueType 還原為 .ttf,將 CFF/CFF2 還原為 .otf。明確的輪廓目標支援靜態 TrueType ↔ CFF,以及符合要求的可變 TrueType ↔ CFF2;輪廓類型已符合時原樣輸出。單檔和批次轉換都會顯示具體失敗原因;批次會繼續佇列並彙總成功/失敗數量。損壞的資料或格式限制仍可能導致轉換失敗。

輸入格式目標選項實際輸出轉換狀態輪廓類型與轉換機制
TTF
WOFF / WOFF2

.woff / .woff2

支援

封裝為網頁字型。保留 TrueType 輪廓類型、可變軸和彩色資料。

OTF (CFF/CFF2)
WOFF / WOFF2

.woff / .woff2

支援

封裝為網頁字型。保留 CFF/CFF2 輪廓類型、可變軸和彩色資料。

WOFF / WOFF2
TTF/OTF (original outlines)

.ttf

支援

將 TrueType 輪廓還原為 .ttf。不改變輪廓類型,並保留可變軸和彩色資料。

WOFF / WOFF2
TTF/OTF (original outlines)

.otf

支援

將 CFF/CFF2 輪廓還原為 .otf。不改變輪廓類型,並保留可變軸和彩色資料。

靜態 TTF
OTF (PostScript outlines)

.otf

支援(靜態字型)

靜態 TrueType 轉為 CFF,包括 COLR v0/v1 和 OpenType-SVG。保留字形 ID、顏色圖層、漸層和調色盤。二次曲線升階為三次曲線,並移除 hinting。

靜態 OTF (CFF)
TTF (TrueType outlines)

.ttf

支援(靜態字型)

靜態 CFF 轉為 TrueType,包括 COLR v0/v1 和 OpenType-SVG。保留字形 ID、顏色圖層、漸層和調色盤。以二次曲線近似三次曲線,並移除 hinting。

可變 TrueType ↔ CFF2
TTF / OTF

.ttf / .otf

有條件支援

保留全部可變軸和支援的彩色資料;輪廓轉換本身不固定軸值。如需匯出固定軸值的檔案,請在 Export 面板選擇「靜態實例」,再產生字型子集或網頁字型包。要求 1–16 個軸、最多 48 個輪廓變化區域、相容的主實例輪廓及可求解的變化資料;還需通過驗證、大小與座標範圍檢查。轉換後的 CFF2 檔案可能大幅增大。

點陣彩色(sbix/CBDT/EBDT)
輪廓互轉

—

不支援

不會把點陣圖變成向量輪廓。請用保留原始輪廓的匯出或網頁封裝來保留點陣圖。

TTC / OTC
單檔 / 批次轉換

—

不支援

請在主介面選擇集合中的一個字型,再產生子集。

不支援的可變資料
改變輪廓類型

—

不支援

VARC 輪廓、帶可變軸的 CFF1、缺少 fvar 的 CFF2、主實例輪廓不相容、變化區域無法求解或超出轉換限制時,不能改變輪廓類型。可在支援時保留原始輪廓匯出或進行 Web 封裝。

不相容的排版資料
改變輪廓類型

—

不支援

部分舊式 AAT 表及引用原輪廓點編號的排版資料無法安全轉換,會顯示具體原因。