Interface & UI icon packs
Complete UI kits such as Lucide, Phosphor, Tabler, Material and Heroicons: settings, menus, search, users and every control a product needs, in one stroke.
72個のパック · 6種類のスタイル · 4,419点のアイコン · SVGとPNG
線のinterfaceアイコン
テキストの色を引き継ぐ単色の輪郭線。インターフェースに最適。
塗りのinterfaceアイコン
小さなサイズや印刷でもはっきり見える単色の塗りつぶしシェイプ。
グラデーションのinterfaceアイコン
ランディングページ、バナー、プレゼンテーション向けのやわらかなグラデーション。
フラットのinterfaceアイコン
ウェブサイト、アプリ、スライド向けの、輪郭線のない単色塗りのアートワーク。
ラインカラーのinterfaceアイコン
色で塗られた輪郭線。線アイコンセットとよく合います。
その他のスタイルのinterfaceアイコン
混合スタイルやあまり一般的でないスタイルのパック。
人気のinterfaceアイコン
すべてのスタイルで最もダウンロードされたinterfaceアイコンのミックス。残りは検索でご覧ください。
User InterfaceLineal Color
User InterfaceLineal Color
User InterfaceMixed
User InterfaceFlat
User InterfaceLineal
User InterfaceFill
User InterfaceFlat
User InterfaceLineal Color
User InterfaceLineal Color
User InterfaceLineal Color
User InterfaceLineal Color
User InterfaceLineal ColorChoosing a UI icon kit
An interface icon kit is a long-term decision: once a product ships with one, swapping it means touching every screen. Choose on coverage, consistency and how you'll use it in code.
Coverage
Count the icons you need today — navigation, actions, status, file types, devices — and add a margin for features you'll build next year. Large kits such as Material Design icons, Phosphor and Tabler have thousands of icons; smaller ones like Feather and Radix are tighter but lighter.
Weights and variants
Some kits come in several weights or in outline and filled pairs. Filled variants are useful for selected tabs and active states; multiple weights let headings and dense tables use different strokes from the same family.
Using them in code
Every IconHub icon copies as an inline SVG, or as a React or Vue component with size and color props. The SVG sprite tool combines a set into one file, and the API can serve icons straight into your product.
Before you download
- List the icons you need and check the kit covers them.
- Pick one stroke width and size grid for the whole product.
- Use filled variants only for active or selected states.
Related: arrow icons for navigation and pagination, and communication icons for chat and notifications.
interfaceアイコンに関する質問
形式、編集、利用についての簡単な回答。
Lucide and Feather for a light, friendly outline look; Phosphor and Tabler for very large sets with several weights; Material and Heroicons if you already use those design systems.
Yes. Every icon page copies the icon as a React or Vue component with size and color props, or as plain inline SVG.
Every icon downloads as SVG and PNG (16 to 1024 px). Editable line and solid icons also copy as React or Vue components, and whole packs download as one ZIP.
Yes. IconHub icons are free for personal and commercial projects with attribution. You can't resell them as files or use them in a logo. The license page has the full summary.
