🎨
svg icon search,
SVG 圖示搜尋
搜尋 Lucide 與 Heroicons——點擊複製 SVG、React 或 Vue 程式碼。
自訂大小、顏色與線條寬度。
🔍
多庫搜尋
跨 Lucide 與 Heroicons 搜尋
📋
一鍵複製
立即複製 SVG/React 程式碼
🎨
可自訂
調整大小、顏色與線條寬度
| 授權：Lucide (ISC) / Heroicons (MIT)
已選擇圖示
🔒所有操作皆完全在您的瀏覽器中執行。
about,
關於本工具
「SVG 圖示搜尋」讓您可以搜尋 Lucide 和 Heroicons 圖示集，並一鍵複製 SVG 程式碼。您可以自訂大小、顏色與線條寬度，並產生可隨插即用的 React 或 Vue 元件程式碼。所有操作皆在您的瀏覽器中執行，無需任何網路請求。
how to use,
使用方法
STEP 1
依名稱搜尋
輸入關鍵字 (如 arrow, home 等) 來過濾圖示。
STEP 2
選擇與自訂
點擊圖示，然後調整大小、顏色與線條寬度。
STEP 3
複製程式碼
直接將 SVG、React 或 Vue 程式碼複製到您的專案中。
glossary,
名詞解釋
- SVG (Scalable Vector Graphics)
- 基於 XML 的向量圖片格式，縮放不失真，非常適合網頁使用。
- Lucide
- 包含 1500+ 個圖示的開源 SVG 圖示集。採 ISC 授權。
- Heroicons
- Tailwind CSS 團隊設計的 SVG 圖示。採 MIT 授權。
- viewBox
- 定義座標系統的 SVG 屬性，確保正確縮放。
- stroke-width
- 控制圖示線條的粗細。
- currentColor
- SVG 關鍵字，可繼承 CSS 顏色值用於 stroke/fill。
faq,
常見問題
- Q.這些圖示的授權為何？
- Lucide 採 ISC 授權，Heroicons 採 MIT 授權。兩者皆可免費作為商業用途。
- Q.資料會傳送到伺服器嗎？
- 不會。所有操作都在您的瀏覽器中執行。
use cases,
使用場景
🎨
網頁設計
為 UI 專案尋找完美的圖示。
💻
React 專案
立即複製元件匯入程式碼。
📐
設計草圖
在加入 Figma 之前預覽圖示。
📚
圖示庫比較
並排比較 Lucide 與 Heroicons。
Send Feedback
Please let us know your thoughts to help us improve the tool.
Feedback sent successfully. Thank you for your cooperation!
An error occurred. Please try again later.
Feedback is temporarily suspended
The server is busy or spam protection is active. Please try again later.