IconPicker
A searchable, virtualized icon grid behind a Popover trigger — pack-agnostic, so it works with any installed Lumeo.Icons.* pack.
Installation
dotnet add package Lumeo
One-time app setup (AddLumeo(), CSS & JS) is covered in the
installation guide.
Usage
@using Lumeo <IconPicker />
When to Use
- An admin picking a category, folder, or navigation-item icon
- Theme/branding settings that let a user choose a glyph
- Anywhere a value component needs to bind to one icon name out of a large set
Pack-agnostic by design
The core Lumeo package references no individual icon pack — IconPicker
takes a plain IReadOnlyList<IconPickerItem> (Name + IconSource +
optional Keywords). Build that list from whichever Lumeo.Icons.* pack(s) you installed with a
one-time reflection pass over the pack's static class — the same technique the icon gallery on this site uses:
using System.Reflection;
using Lumeo.Icons;
private static IReadOnlyList<IconPickerItem> BuildIcons(Type packClass) =>
packClass.GetProperties(BindingFlags.Public | BindingFlags.Static)
.Where(p => p.PropertyType == typeof(IconSource))
.Select(p => new IconPickerItem(p.Name, (IconSource)p.GetValue(null)!))
.OrderBy(i => i.Name, StringComparer.Ordinal)
.ToList();
// e.g. in OnInitialized():
_lucideIcons = BuildIcons(typeof(Lucide));Try searching "money" or "home" — neither is an icon name, both are a Keywords entry.
The opened popover scales with the trigger's Size too — search box, grid cell/glyph size and popover width all grow or shrink alongside it.
API Reference
Nested inside a FormField, the cascaded context wires up Label, Required, Invalid, and HelperText automatically — the same shape as ColorPicker and Combobox.
Related Components
- Popover — The underlying overlay mechanism used by IconPicker
- Combobox — Searchable single/multi-select for text options
- ColorPicker — The same trigger + popover shape for color values
- Icon Packs — Browse every installed pack and copy usage snippets