｜Web Icons｜Material Symbols : Control Icon Stroke Width
Google Fonts 提供的 Material Symbols & Icons 是一套設計精美、易於使用的圖示庫，包含多種常見圖示，可用於網站和應用程式設計。只需引入 Google Fonts 的相關連結，即可快速使用，並透過 CSS 自訂大小、顏色等樣式。
特別的是，Material Symbols 有提供 7 種粗細變化 (Weight 100 ~ 700)，以及細緻的等級調整 (Grade)，可微調線條厚度以適應不同設計需求。
首先，進入 Material Symbols & Icons - Google Fonts 頁面。
在頁面左側的 Customize 欄位內，分別有「Fill 填充」、「Weight 字重」、「Grade 等級」、「Optical Size 光學大小」四種選項可以調整。
| Fill 填充 | 修改圖示的填充樣式，可呈現未填充與已填充的狀態。 |
| Weight 字重 |
定義圖示的線條粗細，範圍為細線 100 到粗線 700。 |
| Grade 等級 |
調整圖示厚度，細微於字重的變化，並略微影響圖示大小。 低強調 (如 -25)：減少淺色圖示在深色背景上的眩光。 高強調 (如 200)：突顯圖示的可見度。 |
| Optical Size 光學大小 |
範圍為 20dp 到 48dp。 當圖示大小調整時，自動改變線條粗細，保持視覺一致性。 |
在頁面左側的 Style 欄位內，第 1 個下拉選單提供「Material Symbols (news)」和「Material Icons」兩種選項。
Material Symbols (news)：在 Material Icons 為基礎上升級，具有更多可自訂屬性。
Material Icons：為一套固定樣式的圖示，提供基本的設計風格。
第 2 個選單的風格選項會根據第 1 個選單的選擇而有所不同：Material Symbols (news) 提供 3 種風格，Material Icons 提供 5 種風格。
| 選項 | 風格種類 |
| Material Symbols (news) | Outlined 外框、Rounded 圓角、Sharp 尖角。 |
| Material Icons | Outlined 外框、Filled 實心、Rounded 圓角、Sharp 尖角、Two tone 雙色。 |
在搜尋圖示時，可以利用頁面上方的搜尋框，輸入您需要的圖示關鍵字，例如「home」、「menu」。
也可以在左側 Category 欄位內，點選您需要的類別選項，進一步縮小範圍尋找。
選擇所需的圖示後，右側將顯示詳細資訊視窗，您可以選擇下載 SVG/PNG 檔案，或直接複製程式碼進行使用。
