WebFont - 概要

WebFontは、テキストからSVGへの変換、SVGベースのフォント作成、フォント変換、サブセット化、グリフ書き出し、Webフォントパッケージ出力を行うローカルmacOSユーティリティです。

WebFontは実用的なWebフォント制作のために設計されています。テキストをSVGアウトラインに変換し、アウトラインSVGからアイコンフォントを作成し、静的TrueTypeベースのソースフォントを編集し、サブセット化・形式変換を行い、ブラウザ向けの出力をパッケージ化できます。

主な機能

• Text to SVG: 読み込んだフォントで単語、文章、複数行テキストをアウトラインSVGパスに変換。
• Font Builder: アウトラインSVGグリフからモノクロまたはカラーのアイコンフォントやWebフォントを作成。
• ソースフォント編集: 静的TrueTypeベースのフォントにSVGグリフを追加、または既存のUnicodeグリフを置換。
• Preflight Check: Unicode競合、重複グリフ名、空パス、異常なSVGサイズ、メトリクスの問題、対応外SVG機能、複雑すぎるグリフを報告。
• プロジェクトファイル: ソースフォントデータ、SVGグリフ、ビルド設定、出力オプション、置換対象を含む.webfontprojectを保存・再開。
• フォント変換: TTF、OTF、WOFF、WOFF2を単一ファイルまたは一括で相互変換。対応する静的・可変アウトラインの変換も含みます。
• サブセット生成: TrueType、CFF/CFF2、可変フォント、カラーフォント（選択したTTC/OTCフェイスを含む）から、元のアウトラインを保ったTTF/OTF、WOFF、WOFF2を生成。
• 静的フォントインスタンス: ExportパネルのVariable Fontセクションで「すべての軸を保持」を選ぶか、「静的インスタンス」で軸値をFont SubsetとWeb Packageの出力に焼き込みます。
• Webパッケージ出力: fonts/、@font-faceとunicode-rangeを含むCSS、demo.htmlを生成。Font Builderのパッケージにはmetadata.jsonも含まれます。
• グリフ素材の書き出し: 選択したグリフをSVG、PNG、PDFで保存。

処理モデル

• 処理はMac上でローカルに実行されます。
• アカウントへのログインは必要ありません。
• クラウドでの変換は必要ありません。
• 出力は選択した場所にのみ書き込みます。

現在の制限

• Font BuilderのSVG入力は、ライブテキスト、ラスター画像、フィルター、マスク、スクリプト、アニメーション、外部リソースではなく、アウトライン化された静的素材である必要があります。
• Font Builderのソースフォント編集は静的TrueTypeベースのフォントに対応します。
• サブセット生成は一度に1つのソースフォント、または選択した1つのTTC/OTCフェイスに対応します。
• サブセット出力は元のアウトライン形式を保ちます（TrueType → .ttf、CFF/CFF2 → .otf）。WOFF/WOFF2はWebフォントコンテナです。
• Text to SVGは読み込んだフォントのすべての可変軸を公開し、対応するカラーグリフを保持しますが、新しいフォントや静的インスタンスは作成しません。

キーボードショートカット

• 離れたグリフを複数選択: Command + Click
• 範囲選択: Shift + Click
• 選択したグリフをプレビュー: Space
• すべてのグリフを選択: Command + A
• 現在のデータセットから選択グリフを削除: Delete