---
title: "Add interface icons"
description: "Find reusable icon collections and React icon components."
pagination: false
---

{/* Generated from content/. Edit the catalog, not this page. */}

<PurposeNote title="Start with the tradeoff">Choose a consistent visual style and import only the icons your interface needs.</PurposeNote>

## Options for this task

<LibraryIndex category="icons" />

<LibraryCard libraryId="heroicons" />

<LibraryCard libraryId="iconify" />

<LibraryCard libraryId="iconify-react" />

<LibraryCard libraryId="lucide-react" />

<LibraryCard libraryId="react-icons" />

<LibraryCard libraryId="react-file-icon" />

## Before you decide

Try a small, realistic example. Check the runtime, accessibility, maintenance, and license requirements for the features you need.

[Browse icons →](/icons)

[Explore more tasks →](/tasks)