Interface icons
Use .search. Enumerate every supported name with LumenIconName.allCases.
Data displayApple
Icon
Display the complete shared interface and brand catalog, with platform-native escape hatches.
Apple availability
Supported native targets
Import LumenUI in the target that uses this component. iPad support follows the iOS package baseline and uses native iPad layout behavior.
iPhone · iOS 16+iPad · iPadOS 16+Mac · macOS 13+Apple TV · tvOS 16+Apple Vision · visionOS 1+Apple Watch · watchOS 9+
Native example
Use Icon
Prefer a generated Lumen name when an interface or brand icon should remain consistent across platforms. Use an SF Symbol, ImageVector, or React Native graphic component when the operating system or product owns the artwork.
LumenIcon(
name: .search,
size: .md,
label: "Search"
)
LumenIcon(name: .brandGithub, label: "GitHub")Apple icon catalog
Choose an icon name
Search the visual catalogs, copy the displayed Lumen name, then use the Apple spelling below. The package includes both catalogs without another native dependency.
Reference
Public API
The primary shared and platform-specific options exposed by LumenIcon.
| API | Values or type | Default | Description |
|---|---|---|---|
| name or systemName | LumenIconName or SF Symbol name | Exactly one required | Selects a generated catalog icon or a platform-specific custom graphic. |
| label | String? | nil | Names a meaningful icon for assistive technology. |
| size | sm · md · lg | md | Uses a 16, 20, or 24 unit icon size. |
| color | Native color | ink | Overrides the semantic icon color. |
Native behavior
Design and accessibility
When to use it
Prefer a generated Lumen name when an interface or brand icon should remain consistent across platforms. Use an SF Symbol, ImageVector, or React Native graphic component when the operating system or product owns the artwork.
Accessibility
Standalone icons are decorative when no label or content description is supplied. Meaningful icons require a concise accessible name.
Shared component