Icon 是什麼？和 Logo、插圖有什麼不同
Icon 是什麼？ 它是用來幫助使用者快速辨識功能、物件、狀態或概念的小型圖示。好的 icon設計重點不只在好看，更在清楚、一致、可縮放，並能在介面中被正確理解。
Icon 的定義
在 UI 設計裡，Icon 通常是一個簡化過的符號，負責把「搜尋、返回、刪除、下載、收藏、警示」這類動作或狀態變成一眼可辨識的視覺訊號。它的任務是降低使用者理解介面的成本。
我會把圖示設計視為介面語言的一部分。圖示越靠近核心操作，越不能只靠個人風格發揮；它必須讓多數使用者在短時間內看懂。
Icon、Logo、Illustration、Emoji 的差異
| 類型 | 主要目的 | 常見使用位置 | 設計重點 |
|---|---|---|---|
| Icon | 辨識功能、狀態、物件或分類 | 按鈕、導覽列、表單、App 介面 | 清楚、一致、可縮放 |
| Logo | 代表品牌識別 | 網站頁首、名片、品牌文件 | 獨特性、記憶度、品牌延展 |
| Illustration | 輔助敘事或建立情緒 | 空狀態、活動頁、簡報 | 畫面感、風格、敘事性 |
| Emoji | 表達情緒或語氣 | 聊天、社群、短文案 | 情緒辨識、文化脈絡 |
Icon 是功能辨識，不是品牌全貌
Icon 可以帶有品牌風格，但不該承擔整套品牌識別的任務。品牌識別需要 Logo、字體、色彩、版面、攝影與語氣共同完成；Icon 的核心責任仍是讓介面操作更明確。若需要建立完整品牌規範，可延伸閱讀 品牌規範手冊 與 品牌識別設計指南。
Icon 在 UI/UX、網站與 App 裡的核心用途
Icon 在介面中的用途是提升辨識速度、輔助導覽、強化操作回饋，並維持設計系統的一致性。它適合用在高頻、重複、空間有限的介面情境。
導覽與分類
導覽列、側邊選單、分類頁籤常使用圖示幫助使用者掃描。例如首頁、搜尋、會員、購物車、通知等項目，搭配文字時能讓使用者更快建立位置感。
按鈕與操作提示
Icon 常放在按鈕裡，用來提示動作方向，例如新增、編輯、刪除、分享、下載。若動作有風險，例如刪除或送出付款，建議保留文字標籤，避免只靠圖示判斷。
狀態與系統回饋
成功、錯誤、警告、載入、離線、已收藏等狀態都適合用 icon 輔助。狀態圖示不能只依賴顏色，因為色弱使用者或低對比螢幕環境可能無法準確辨識。
品牌輔助與介面節奏
在企業官網、電商網站與 SaaS 介面中，圖示也常用來整理特色、流程或服務項目。這類 icon 不應過度裝飾，否則會搶走內容本身的閱讀焦點。
好 Icon 的判斷標準：清楚、一致、可辨識、可縮放
好的 Icon 要在小尺寸下仍然清楚，和同組圖示保持一致，能被目標使用者辨識，並且在不同裝置與狀態中穩定呈現。
清楚：第一眼能猜到功能
清楚的圖示通常使用熟悉隱喻，例如放大鏡代表搜尋、垃圾桶代表刪除、齒輪代表設定。若使用者需要停下來猜，這個 icon 在介面裡就已經造成摩擦。
一致：同一組圖示像同一套語言
icon 風格統一 包含筆畫粗細、圓角、填色方式、視覺重量、留白、透視角度與細節密度。只把圖示放成同一個顏色，還不算真正一致。
可辨識：不要為了美感犧牲語意
圖示可以有風格，但功能 icon 的語意應該優先於造型驚喜。尤其是金融、醫療、後台系統與電商結帳流程，過度抽象的圖示會讓使用者更不確定。
可縮放：16px 到 32px 都要能用
很多新手只在 Figma 畫布放大檢查圖示，結果上線後縮到 16px 就糊成一團。UI icon 應該在常用尺寸中反覆測試，尤其是 16px、20px、24px 與 32px。
常見錯誤
- 同一組圖示混用線性、填色與雙色風格。
- 細節太多，縮小後無法辨識。
- 不同 icon 的筆畫粗細不一致。
- 只靠顏色表達狀態，缺少形狀或文字輔助。
- 使用冷門隱喻，導致使用者看不懂。
Icon 設計流程：從需求到上線的完整 SOP
完整的 icon設計原則與流程應包含需求定義、隱喻選擇、草圖、grid 與 keyline、尺寸測試、輸出交付與 QA。流程越清楚，越能降低返工與風格混亂。
1. 先定義功能與使用場景
開始畫之前，先確認這個 icon 代表的是動作、物件、狀態、分類，還是品牌輔助，圖標設計流程會從品牌需求判斷開始。接著確認它會出現在按鈕、導覽、列表、空狀態、App tab bar 或後台表格。
判斷句很實用：如果沒有這個 icon，使用者會少理解什麼？回答不出來時，通常代表它只是裝飾。
2. 選擇使用者能理解的隱喻
隱喻要符合台灣使用者的常見經驗。搜尋用放大鏡、購物車用推車、地點用定位針，多數時候比重新發明符號更可靠。創新可以放在風格處理，不必放在語意猜謎。
3. 草圖先求辨識，不求細節
草圖階段應快速嘗試多個方向，用最少線條找出最容易辨識的版本。此時不需要追求圓角、陰影或裝飾細節，因為細節常會掩蓋核心輪廓的問題。
4. 放入 grid 與 keyline 統一比例
把圖示放進 24px grid，有助於控制外框、留白、視覺重量與比例。常見做法是保留固定 padding，再用 keyline 管理圓形、方形、長方形與斜向圖示的視覺範圍。若團隊已使用 8pt grid 間距系統，圖示尺寸也應和介面節奏對齊。
5. 測試 16px、20px、24px、32px 小尺寸
測試時不要只看向量原稿，應實際放到介面裡看。16px 適合表格與輔助資訊，20px 常見於密集工具列，24px 是多數 UI icon 的基準尺寸，32px 則常用於較醒目的功能入口。
6. 輸出 SVG / PNG 並交付命名規則
交付時應提供 SVG 原始向量，必要時補 PNG 固定尺寸。命名建議使用語意名稱，例如 icon-search、icon-trash、icon-alert，不要用 final、new、copy 這類無法維護的檔名。
Icon 設計規格：尺寸、24px grid、keyline 與一致性
Icon 設計規格的核心是用共同尺寸、grid、keyline、筆畫與 padding 管理一致性。24px grid 是 UI icon 常見基準，適合設計系統與前端交付。
常見尺寸與使用情境
| 尺寸 | 常見情境 | 設計注意事項 |
|---|---|---|
| 16px | 表格、輔助狀態、細小標籤 | 細節要極少，避免雙層線條 |
| 20px | 工具列、密集按鈕、行動介面次要操作 | 筆畫需清楚，留白不能太緊 |
| 24px | 主要 UI icon、導覽、按鈕 | 適合作為設計系統基準 |
| 32px | 功能卡片、設定入口、較醒目的分類 | 可增加少量細節，但仍需一致 |
24px grid 的基本做法
以 24px 畫布為例，圖示通常不會畫滿整個畫布，而是保留內距。這能避免 icon 在按鈕或列表中顯得過大，也能讓不同外形的圖示看起來重量接近。
Keyline 控制不同形狀的視覺範圍
圓形、方形、直向、橫向與斜向 icon 即使放在同一尺寸畫布，也會有不同視覺重量。Keyline 的作用是提供參考邊界，讓不同形狀看起來屬於同一組。
Stroke、padding 與圓角規則
線性 icon 需要固定 stroke weight，例如同組圖示統一使用 1.5px 或 2px。圓角也要有規則，否則同組 icon 會出現有的俐落、有的柔軟的矛盾感。
Icon 實作細節：筆畫、圓角、像素對齊與小尺寸測試
Icon 實作細節會直接影響清晰度。筆畫粗細、圓角、pixel snapping、optical alignment 與小尺寸測試，是避免圖示模糊、偏重或變形的關鍵。
筆畫粗細要配合尺寸
24px 線性圖示常見 stroke weight 會落在 1.5px 到 2px 的範圍，但重點不在固定數字，而是整套圖示必須一致。小尺寸若使用過細筆畫，螢幕顯示容易變淡或破碎。
圓角要有系統
圓角會改變圖示性格。接案專案中，我常看到同一套 icon 有些端點是尖角、有些是圓角，放在一起會有拼貼感。建議先定義端點、轉角、外框圓角的規則，再開始大量繪製。
像素對齊與 pixel snapping
像素對齊是讓圖示在螢幕上清楚顯示的重要細節。直線、水平線與主要邊界若落在模糊的位置，輸出後可能產生灰邊。設計師應在實際尺寸下檢查，而非只看放大畫面。
Optical alignment 視覺對齊
數學置中不一定等於視覺置中。播放三角形、定位針、箭頭這類不對稱圖示，常需要微調位置，讓它們在按鈕裡看起來真的置中。
小尺寸檢查清單
- 16px 下仍能看出主要輪廓。
- 筆畫沒有消失、黏在一起或產生灰邊。
- 同組圖示在視覺重量上接近。
- 斜線、圓弧與轉角沒有明顯鋸齒感。
- 放進真實按鈕後，icon 不會顯得過大或過小。
自己設計、免費下載、買素材、AI 產生或用元件庫，該怎麼選？
Icon 的製作方式應依照品牌重要性、使用頻率、授權風險、預算與維護需求決定。核心功能建議自繪或建立設計系統，一次性用途可考慮素材。
品牌核心功能建議自繪
如果 icon 會長期出現在品牌網站、App 主導覽、產品功能頁或設計系統裡，自繪通常更值得。這些圖示會反覆被看見，也會影響使用者對產品成熟度的判斷。
一般 UI 功能可用元件庫
搜尋、關閉、返回、設定、通知這類標準功能，可以使用成熟元件庫。重點是整套採用同一來源，並確認尺寸、stroke、命名與授權能被團隊長期維護。
簡報或一次性素材可用免費資源
若圖示只用在簡報、活動頁或短期內部文件，免費 icon 可以節省時間，也可善用 Canva Icon 應用教學 快速搜尋、調整顏色與自訂。但仍要檢查授權條款，尤其是是否可商用、是否需標註來源、是否可修改。
商用案先查授權再使用
商用案最怕的是專案交付後才發現商用 icon 授權不合。免費不等於可商用，可下載也不等於可改作。設計師應把授權截圖、來源網址、下載日期和版本記錄在交付資料中。
| 方式 | 適合情境 | 優點 | 風險 |
|---|---|---|---|
| 自己設計 | 品牌核心、長期產品、設計系統 | 一致性最高，可完整客製 | 需要時間與設計能力 |
| 免費下載 | 簡報、短期活動、非核心頁面 | 速度快，成本低 | 授權與風格不一定穩定 |
| 付費素材 | 商用案、品牌網站、企業官網 | 品質較穩，授權較清楚 | 仍需確認限制條款 |
| AI 產生 | 概念探索、草圖靈感 | 快速產生方向 | 一致性、版權與可編輯性需檢查 |
| 元件庫 | 後台、SaaS、標準 UI 功能 | 前端整合容易，維護成本低 | 品牌差異性較低 |
免費 Icon 網站怎麼選？授權、格式與使用情境比較
選免費 icon 素材網站時，應先看商用授權、是否需標註來源、可否修改、提供格式與風格一致性。不要只看圖示數量或下載是否方便。
先看授權，再看美感
授權是素材使用的底線。常見授權可能包含 CC、MIT、Apache、需標註來源、僅限個人使用、禁止轉售或禁止商標用途。接案與企業專案應保留授權證明。
格式會影響後續維護
SVG 適合網站與介面系統，PNG 適合固定尺寸輸出，ICO 常用於 favicon。若素材只提供 PNG，後續改色、調整筆畫與放大使用都會受到限制。
常見素材來源的判斷方式
| 來源類型 | 可能格式 | 適合用途 | 檢查重點 |
|---|---|---|---|
| 大型 icon 網站 | SVG、PNG、ICO | 簡報、網站輔助圖示 | 商用授權與標註規則 |
| 設計系統圖示庫 | SVG、React component | 產品介面、後台系統 | 版本維護與前端套件支援 |
| 動畫 icon 平台 | JSON、SVG、影片格式 | 行銷頁、微互動 | 載入效能與授權限制 |
| AI 生成素材 | PNG、SVG 或可編輯向量 | 概念探索 | 原創性、相似風險與可編輯程度 |
Icon 設計工具與輸出格式：Figma、Illustrator、SVG、PNG、ICO
Figma 適合 UI icon、設計系統與交付協作，Illustrator 適合精細向量繪製。SVG icon 是網頁 icon 的主要格式，PNG 與 ICO 則用於特定尺寸或 favicon。
Figma 適合介面與設計系統
Figma icon 的優勢在於元件、變體、樣式、團隊協作與前端交付。若 icon 會放入按鈕、導覽、表單與設計系統，Figma 通常比單純向量軟體更貼近工作流程。
Illustrator 適合精細向量繪製
Illustrator 適合處理複雜路徑、品牌化圖形與精細向量控制。但若最後要進入 UI 設計系統，仍應回到 Figma 或設計文件中測試尺寸與元件狀態。
輸出格式對照
| 格式 | 特性 | 適合用途 | 注意事項 |
|---|---|---|---|
| SVG | 向量、可縮放、可用 CSS 控制 | 網站、App WebView、設計系統 | 需清理不必要圖層與屬性 |
| PNG | 點陣、固定尺寸 | 簡報、固定尺寸圖片、舊系統 | 放大會失真，改色不方便 |
| ICO | 可包含多尺寸圖示 | 網站 favicon | 需搭配瀏覽器與裝置需求 |
| React component | 可參數化控制 | React 前端專案 | 需統一屬性與命名 |
Export padding 要一致
輸出時常見問題是圖示本體貼齊畫布邊界，導致放進按鈕後看起來過大。建議保留一致 padding，並確認 SVG viewBox 和設計稿尺寸相符。
Icon 在前端專案中的使用方式：SVG、Icon Font、React 元件與 CSS mask
前端使用 icon 的方式會影響效能、可維護性、樣式控制與無障礙。現代網站多優先使用 SVG 或元件化 icon，Icon Font 則需評估相容與維護需求。
Inline SVG
Inline SVG 可直接放在 HTML 或元件中，方便控制顏色、尺寸、ARIA 屬性與動畫。缺點是若大量重複使用，需注意檔案體積與元件管理。
SVG sprite
Sprite 適合大量 icon 共用，透過 symbol 與 use 重複呼叫。它能減少重複程式碼，但需要建立打包流程，並確保瀏覽器支援與快取策略正常。
Icon Font
Icon Font 曾經常見於大型圖示庫，但現在不一定是首選。它的優點是使用方式像字體，缺點是語意、無障礙、載入失敗顯示與精準控制都可能遇到限制。
React Icon 與元件庫
React component 適合設計系統與產品團隊。設計師與工程師可以約定 size、color、stroke、aria-label、title 等屬性，讓圖示在不同介面中穩定使用。
CSS mask
CSS mask 適合單色圖示，需要用 CSS 控制顏色時很方便。缺點是多色 icon 或複雜圖形不適合，且需要確認目標瀏覽器支援狀況。
| 使用方式 | 優點 | 限制 | 適合情境 |
|---|---|---|---|
| Inline SVG | 控制彈性高 | 大量使用時需管理重複 | 互動按鈕、狀態圖示 |
| SVG sprite | 可集中管理 | 需要建置流程 | 大型網站、設計系統 |
| Icon Font | 使用方式熟悉 | 語意與載入風險較高 | 舊專案維護 |
| React component | 元件化、可維護 | 依賴前端框架 | React 產品與後台 |
| CSS mask | 單色控制方便 | 不適合複雜多色圖示 | 裝飾性或單色 UI icon |
Icon 可用性與無障礙：什麼時候要加文字標籤？
Icon 是否要加文字標籤，取決於使用者能否毫不猶豫理解它。高風險、低熟悉度、第一次出現或影響任務完成的 icon，應搭配文字或 ARIA label。
高頻通用圖示可以只用 icon，但要謹慎
搜尋、關閉、返回這類高熟悉度 icon，在空間有限時可單獨使用。不過仍要提供無障礙名稱，例如 aria-label，讓螢幕閱讀器能正確朗讀。
重要操作應搭配文字
刪除、付款、提交申請、取消訂單等操作影響較大，建議搭配文字。只放一個垃圾桶圖示，對新使用者或緊張情境下的使用者來說風險偏高。
觸控尺寸與點擊區域
行動介面中的 icon 按鈕不能只看圖示本體尺寸，還要看可點擊區域。即使圖示是 24px，外層按鈕仍應提供足夠觸控空間，避免誤觸。
顏色對比與狀態辨識
禁用、啟用、錯誤、警告、成功狀態不應只靠顏色區分。圖示形狀、文字、位置與狀態樣式都要一起協助辨識。按鈕圖示的設計可搭配 按鈕設計規範 一起檢查。
App Icon、網站 favicon 與產品圖示的差異
App Icon、favicon 與產品圖示都屬於圖示任務，但使用場景不同。App Icon 偏向產品入口辨識，favicon 偏向瀏覽器識別，UI icon 則偏向介面操作。
App Icon 是產品入口
App Icon 出現在手機桌面、App Store、通知與系統設定中。它需要高辨識度，也需要在不同尺寸與背景下保持清楚。它比一般 UI icon 更接近品牌資產。
Favicon 是網站識別輔助
Favicon 出現在瀏覽器分頁、書籤、搜尋結果或捷徑中。尺寸很小，所以不適合塞入太多字或細節。多數情況下，使用品牌符號的簡化版本會比完整 Logo 更穩，建議參考網站icon怎麼設計：favicon尺寸、格式與設定重點。
產品圖示與功能圖示的差異
產品圖示常用於方案、模組、功能入口或行銷頁，需要兼顧品牌風格與辨識，官網 Icon 設計需確保品牌圖示系統與 Favicon 一致性。功能圖示則更重視操作語意。若企業已有視覺系統，可參考 品牌形象一致性 的做法維持跨頁一致。
| 類型 | 主要目標 | 常見位置 | 設計重點 |
|---|---|---|---|
| App Icon | 產品辨識與上架呈現 | 手機桌面、商店頁、通知 | 辨識度、品牌感、多尺寸測試 |
| Favicon | 網站分頁與書籤辨識 | 瀏覽器、書籤、捷徑 | 小尺寸清楚、極簡輪廓 |
| UI Icon | 輔助操作與狀態理解 | 按鈕、導覽、表單、列表 | 語意清楚、系統一致 |
| 產品圖示 | 區分模組或服務項目 | 功能頁、方案頁、簡報 | 品牌風格、分類辨識 |
Icon 上線前 QA Checklist
Icon 上線前應檢查尺寸、格式、命名、授權、狀態、深色模式、無障礙與前端交付。QA 做得越完整，越能避免上線後才發現模糊、誤用或侵權。
設計檔檢查
- 所有 icon 使用同一套尺寸基準，例如 24px grid。
- 同組圖示的 stroke weight、圓角與 padding 一致。
- 16px、20px、24px、32px 都已測試可讀性。
- 圖示已放入真實介面情境檢查，而非只看獨立畫布。
輸出與命名檢查
- SVG viewBox 正確，沒有多餘空白或被裁切。
- 檔名使用語意命名，例如 icon-download.svg。
- 需要 PNG 或 ICO 的情境已另外輸出。
- 同一功能不同狀態有清楚命名，例如 default、hover、active、disabled。
授權與交付檢查
- 免費或付費素材已確認商用授權。
- 需要標註來源的素材已記錄標註方式。
- AI 生成素材已進行相似性與可商用風險評估。
- 工程交付文件包含尺寸、顏色、狀態與使用限制。
介面狀態檢查
- hover、focus、active、disabled 狀態都有對應樣式。
- 深色模式與淺色模式都有足夠對比。
- 重要 icon 按鈕已提供文字標籤或 aria-label。
- 觸控裝置上的點擊範圍足夠，不只看圖示本體。
常見 Icon 設計錯誤
常見 icon設計錯誤包含過度複雜、風格不一致、只靠顏色表達、缺少文字標籤、授權不明與前端交付不完整。這些問題都會影響可用性與維護。
過度複雜
新手常把插畫思維帶進 UI icon，加入太多細節、陰影或裝飾。修正方式是先保留主要輪廓，刪掉不影響辨識的元素，再回到小尺寸測試。
風格混用
從不同 icon 網站各抓幾個素材，很容易出現線寬、圓角、比例都不一致的問題。若必須混用素材，至少要重新調整 stroke、尺寸、padding 與視覺重量。
只靠顏色傳達狀態
紅色代表錯誤、綠色代表成功很常見，但不能只靠顏色。應搭配形狀、文字或圖示差異，讓不同視覺能力的使用者都能理解狀態。
沒有文字標籤
某些 icon 對設計師很直覺，對使用者未必如此。若是低熟悉度功能、商務流程或高風險操作，文字標籤比節省空間更重要。
忽略工程交付
圖示在設計稿裡漂亮，不代表前端會正確呈現。SVG 結構、命名、尺寸、狀態、顏色控制與元件屬性，都需要在交付前說清楚。若團隊導入 AI 協作產出素材，也應建立 AI 設計工作流程 的檢查規則。
不建議在本文展開的內容
Icon 設計應聚焦在介面圖示的定義、流程、規格、使用、授權與落地。不建議延伸成 Logo、插畫、3D 建模或完整品牌識別全案教學。
Logo 設計全案
Logo 和 Icon 有交集，但任務不同。Logo 牽涉品牌策略、識別系統與長期記憶；Icon 更常服務介面操作與功能辨識。
插畫與 3D 視覺
插畫、3D icon 與品牌視覺可以讓畫面更豐富，但不適合作為 UI icon 的主要討論範圍。介面圖示仍應先滿足清楚、穩定、可維護。
單純工具操作教學
Figma 與 Illustrator 操作技巧很重要，但工具只是執行方式。真正影響品質的是需求判斷、隱喻選擇、規格管理、小尺寸測試與交付規則。
icon 和 logo 有什麼不同？
Icon 主要用來代表功能、物件、狀態或概念，常出現在介面按鈕、導覽與系統提示中。Logo 主要代表品牌識別，負責建立品牌記憶與辨識。Icon 可以有品牌風格，但它的第一任務仍是讓使用者看懂操作。
UI icon 一定要自己設計嗎？
不一定。核心產品、品牌功能與長期設計系統建議自己設計；標準 UI 功能可以使用成熟元件庫；簡報或短期頁面可使用授權清楚的素材。判斷重點是品牌重要性、授權風險與後續維護成本。
Figma 可以設計 icon 嗎？
可以。Figma 很適合設計 UI icon、建立元件、管理變體與交付設計系統。若圖示需要放進網站或 App 介面，Figma 的協作與元件管理通常很實用。
Illustrator 和 Figma 哪個比較適合做 icon 設計？
Illustrator 適合精細向量繪製與複雜路徑控制，Figma 適合 UI 場景、設計系統與前端交付。若是產品介面 icon，通常可在 Figma 完成；若需要高度精緻的品牌化圖形，可先用 Illustrator 繪製再整理進 Figma。
SVG、PNG、ICO 差在哪？
SVG 是向量格式，可縮放、可改色，最適合網站與 UI icon。PNG 是固定尺寸點陣圖，適合簡報或舊系統，但放大會失真。ICO 常用於網站 favicon，可支援瀏覽器分頁與捷徑圖示需求。
免費 icon 可以商用嗎？
不一定。免費 icon 仍需檢查授權條款，包含是否可商用、是否需標註來源、是否可修改、是否禁止轉售或用於商標。商用案應保留來源與授權紀錄，避免交付後產生爭議。
Icon Font 現在還推薦使用嗎？
新專案通常會優先評估 SVG 或元件化 icon。Icon Font 仍可用於舊系統或既有圖示庫，但它在無障礙、載入失敗、精準樣式控制與語意表達上較容易遇到限制。
App icon 要做哪些尺寸？
App icon 需要依照 iOS、Android 或上架平台規範輸出多種尺寸。設計時不應只做一張大圖再縮小，而要確認小尺寸仍清楚、主要輪廓不糊、背景與圖形在不同系統環境中都能辨識。
Icon 一定要加文字標籤嗎？
不一定。搜尋、返回、關閉等高熟悉度圖示可在特定情境中單獨使用，但重要操作、低熟悉度功能、高風險流程或第一次出現的 icon，建議搭配文字標籤。即使畫面不顯示文字，也應提供 aria-label。
為什麼我的 icon 在小尺寸看起來很糊？
常見原因包含筆畫太細、沒有像素對齊、細節太多、SVG viewBox 不乾淨，或圖示縮小後主要輪廓黏在一起。修正時應在 16px、20px、24px 實際尺寸下檢查，不要只看放大畫面。
AI 產生的 icon 可以直接用在商業專案嗎？
不建議未檢查就直接使用。AI 產生的 icon 需要確認授權條款、相似性風險、是否可編輯、是否能維持同組一致性。比較穩妥的做法是把 AI 當作概念探索，再由設計師整理成可交付的向量圖示。
一組 icon 要怎麼維持風格一致？
先定義尺寸、grid、keyline、stroke weight、圓角、padding、填色方式與命名規則，再開始大量繪製。每次新增 icon 時，都要和既有圖示放在同一畫面比較視覺重量，而不是單獨檢查一個檔案。