Icon library

A familiar symbol for every action.

Search the complete Lucide set through one accessible component. Generated names keep the same artwork available across web, React Native, SwiftUI, and Compose.

Explore icons Browse brand icons

Icons by Lucide, created and maintained by its open-source contributors.

One component

Use it everywhere

Names, sizes, and accessibility props stay aligned across Astro, React, and custom elements. Decorative icons stay hidden; meaningful icons require a label.

---
import { Icon } from '@santi020k/lumen-astro'
---

<Icon name="search" label="Search" />
<Icon name="wand-sparkles" decorative />
<Icon name="circle-check" label="Synced" size="lg" />

---
import { Icon } from '@santi020k/lumen-astro'
---

<Icon name="search" label="Search" />
<Icon name="wand-sparkles" decorative />
<Icon name="circle-check" label="Synced" size="lg" />

import { Icon } from '@santi020k/lumen-react'

export const Toolbar = () => (
  <>
    <Icon name="search" label="Search" />
    <Icon name="wand-sparkles" decorative />
    <Icon name="circle-check" label="Synced" size="lg" />
  </>
)

import { Icon } from '@santi020k/lumen-react'

export const Toolbar = () => (
  <>
    <Icon name="search" label="Search" />
    <Icon name="wand-sparkles" decorative />
    <Icon name="circle-check" label="Synced" size="lg" />
  </>
)

<lumen-icon name="search" label="Search"></lumen-icon>
<lumen-icon name="wand-sparkles" decorative></lumen-icon>
<lumen-icon name="circle-check" label="Synced" size="lg"></lumen-icon>

<lumen-icon name="search" label="Search"></lumen-icon>
<lumen-icon name="wand-sparkles" decorative></lumen-icon>
<lumen-icon name="circle-check" label="Synced" size="lg"></lumen-icon>

Native platforms

Use the same catalog natively

Copy a kebab-case name from the catalog below. React Native uses it directly; SwiftUI and Compose expose generated, typed equivalents and collections for programmatic discovery.

import { LumenIcon, lumenIconNames } from '@santi020k/lumen-react-native'

<LumenIcon name="search" label="Search" />
// lumenIconNames contains every supported name.

import LumenUI

LumenIcon(name: .search, label: "Search")
// LumenIconName.allCases contains every supported name.

import com.santi020k.lumen.LumenIcon
import com.santi020k.lumen.LumenIconName

LumenIcon(
    name = LumenIconName.Search,
    contentDescription = "Search"
)
// LumenIconName.entries contains every supported name.

Complete set

Find your icon

Search by canonical name or alias, then select any tile to copy its component name.

Search the icon library

Showing 1790 of 1790 icons

Need a logo?

Brand marks have their own catalog

Browse more than 570 opt-in company and product marks without loading them into this interface-icon page.

Explore brand icons