手寫字體能為網頁設計注入親切、獨特氣質,特別適合 Logo、Banner、Header 等關鍵視覺區塊。本文精選 21 款免費/商用可議價的英文手寫字體,附預覽圖連結與授權提醒。
字體清單(僅支援英文、數字、標點)
- Grutch Shaded - 陰影立體感,適合標題
- Pointy - 尖銳筆觸,現代感強
- Pee Pants Script - 俏皮手寫體
- Fh Scribble - 塗鴉風格
- OPN Stun Filla Wenka - 裝飾性強
- Mia's Scribblings - 自然手寫感
- Jamaistevie - 優雅連筆
- Sketch Block - 素描區塊感
- Tire Shop - 複古招牌風
- Bearpaw - 粗獷熊掌體
- Barnes Erc - 經典手寫
- My Turtle - 圓潤可愛
- Against Myself - 個性筆觸
- Fail - 破筆效果
- Karabine - 鋼筆質感
- McCoy – Hello Lori - 溫暖書信體
- Clementine Sketch - 速寫風
- Oh Ashy - 灰燼質感
- The Quiet Scream - 安靜尖叫
- 3Dumb & 2Dumb - 趣味雙重奏
- Rock Show Whiplash - 搖滾衝擊
預覽圖連結
各字體預覽圖:https://img.warting.com/2009/06/21handfont/drawn_fonts_1.jpg ~ drawn_fonts_21.jpg(將數字替換 1-21)。
Web 端應用最佳實踐
- @font-face 嵌入:將 .ttf/.woff/.woff2 放入專案,CSS 定義
font-family,確保跨瀏覽器一致呈現。
- 字體子集化:僅保留常用字元(A-Z, a-z, 0-9, 標點),大幅縮減檔案體積(< 50KB)。
- 備用字體鏈:
font-family: 'Grutch Shaded', 'Comic Sans MS', cursive, sans-serif; 確保載入失敗時優雅降級。
- 授權確認:商業專案務必確認授權條款(SIL OFL、MIT、Apache 2.0、商用需購買),避免侵權風險。
中文手寫字體替代方案
- 思源柔黑、霞鶩文楷、獅尾肉丸、Noto Serif TC(支援繁體)
- Google Fonts:
Zhi Mang Xing、Ma Shan Zheng 等中文手寫體
- 自製:
FontForge、Glyphs、Calligraphr 將手寫轉字體
效能提示
- 手寫字體筆畫複雜,檔案通常 > 200KB,建議關鍵標題使用,大段正文維持無襯線字體。
- 啟用
font-display: swap 避免文字閃爍(FOIT/FOUT)。
- CDN 載入(Google Fonts、Bunny Fonts、jsDelivr)加速全球存取。