如何找到 Google Fonts 網址
如何找到並複製 Google Fonts 的 CSS 網址，用到網站圖示設計裡。按步驟做即可。
為什麼用 Google Fonts？ 建議用 Google Fonts，因為官網上的字體都可免費用於商業專案，做圖示時不用擔心授權和額外費用。
分步說明
第 1 步：打開 Google Fonts
在瀏覽器打開 fonts.google.com。這是 Google Fonts 官網，可以瀏覽大量免費字體。
第 2 步：選字體
瀏覽字體庫，點開你想用的字體。也可以用頁面頂部的搜尋框查找。
第 3 步：加入選中列表
找到喜歡的字體後，點頁面右上角的 “Get font”。字體會加入選中列表。可以重複新增多種字體——我們的圖示工具支援從同一網址載入多種字體。
“Get font” 在頁面右上角
第 4 步：打開已選字體
加完字體後，看右上角的 “View selected families”，上面會顯示已選數量。點開後再點 “Get embed code” 查看程式碼。
先點 “View selected families”，再點 “Get embed code”
嵌入程式碼對話框，列出全部 link 標籤
第 5 步：取出字體網址
Google Fonts 會顯示幾條 link，包括 preconnect 和主樣式表。類似這樣：
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet"> 找到 URL 裡帶 css2 的那條——通常最長。複製 href 引號裡的整段網址。上面例子對應的網址是：
https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap 把它貼到圖示工具的自訂字體輸入框。這一條網址包含你選中的全部字體。
提示
- 網址裡保留 &display=swap，載入體驗更好
- 只選真正要用的字體，減少載入時間
- 複製完整網址，否則圖示工具可能載入失敗