完整的資料夾結構
產生的 URL 與包含的字體目錄相符。
網頁字體產生器
将字体文件与即用型 CSS 和 HTML 预览页面打包在一起。
字型文件
CSS 字型系列名稱
捆綁內容
選定的字體出現在此。
該套件包括瀏覽器就緒的字體檔案、@font-face CSS、預覽和設定說明。
預設為私有您的輸入和檔案將在此裝置上處理。
免費且即時無需帳戶、隊列或軟體安裝。
準備使用結果產生後立即複製或下載。
如何使用 網頁字體產生器
透過三個簡單的步驟即可獲得可靠的結果。
選擇字型文件
新增一個或多個授權的瀏覽器相容字體檔案。
Set the family name
使用應出現在整個樣式表中的 CSS 名稱。
Download the kit
接收包含字體、@font-face CSS、預覽 HTML 和設定說明的 ZIP。
專為日常工作打造
無需繁瑣工作即可有用
集中控制、即時回饋，您和結果之間沒有任何關係。
多種重量
將一系列字型檔案打包到一個可部署套件中。
預覽頁面
打开包含的 HTML 文件以验证加载和示例字形。
實用指南
什麼是 網頁字體產生器?
Webfont 工具包將瀏覽器可載入字型檔案與 @font-face CSS 相結合，命名字型系列、來源格式、樣式、粗細和載入行為。將這些部分放在一起可以防止部署期間字體 URL 損壞。
此生成器可打包現有的 TTF、OTF、WOFF 和 WOFF2 檔案；它不會改變字形輪廓或建立轉換後的格式。当您已经拥有许可副本时，WOFF2 通常是最佳交付格式。
實際應用
何時使用此工具
常用方式 網頁字體產生器 適合實際項目和日常任務。
Self-hosted typography
無需依賴第三方 CDN 即可部署品牌字體。
Design systems
為應用程式團隊創建一致的入門包。
字體品質檢查
預覽文件並確認其係列配置。
線下項目
用於本機介面和文件的捆綁類型資產。
有用的答案
常見問題
關於的快速解答 網頁字體產生器 以及該頁面的工作原理。
這會將 TTF 轉換為 WOFF2 嗎？
不會。它会将您提供的浏览器兼容文件与 CSS 和预览打包在一起。
Which format is best for websites?
WOFF2 通常提供最佳的現代 Web 壓縮，並根據相容性需求使用其他格式。
我可以包含多個重量嗎？
是的。檔案在起始 CSS 中指派了漸進權重值，您可以調整該值以符合實際的系列。
每種字體都可以自架嗎？
不可以。在分發或嵌入字體之前，請檢查該字體的授權。