- Accordion
- Alert
- Avatar
- Badge
- Breadcrumb
- Bubble
- Button
- Button Group
- Calendar
- Carousel
- Checkbox
- Clipboard
- Collapsible
- Color Picker
- Combobox
- Data Table
- Date Picker
- Description List
- Dropdown Button
- Empty
- Form
- Group Box
- Hover Card
- Icon
- Image
- Input
- Input Group
- Kbd
- Label
- Link
- List
- Marker
- Menu
- Message
- Notification
- Number Input
- Pagination
- Popover
- Progress
- Progress Circle
- Radio
- Rating
- Resizable
- Scrollable
- Select
- Separator
- Sheet
- Shimmer
- Sidebar
- Skeleton
- Slider
- Spinner
- Status Bar
- Stepper
- Switch
- Table
- Tabs
- Tag
- Textarea
- Time Field
- Title Bar
- Toggle
- Toggle Group
- Toolbar
- Tooltip
- Tree
- Virtual List
GPUI Kit's components draw Lucide icons. The theme bundles the ones they use as StreamGeometry resources, so the icons an app places next to the components match them exactly, and no SVG parser is needed at run time (the geometry is compiled XAML, which suits NativeAOT). Lucide is licensed under the ISC License; the license ships with the package.
Usage
Set a PathIcon's Data to the icon's resource. The icon is 16px, GPUI's medium size, and takes the Foreground:
<PathIcon Data="{StaticResource Gpui.Icon.Search}" />
<PathIcon Data="{StaticResource Gpui.Icon.TriangleAlert}"
Foreground="{DynamicResource Gpui.Warning}" />The classes xsmall, small and large give GPUI's other sizes, 12, 14 and 24px:
<PathIcon Classes="small" Data="{StaticResource Gpui.Icon.ChevronDown}" />
<PathIcon Classes="large" Data="{StaticResource Gpui.Icon.Bell}" />Any other geometry works the same way; the theme's PathIcon scales whatever Data it gets to its size.
Bundled icons
| Key | Lucide icon |
|---|---|
Gpui.Icon.Bell | bell |
Gpui.Icon.Calendar | calendar |
Gpui.Icon.Check | check |
Gpui.Icon.ChevronDown | chevron-down |
Gpui.Icon.ChevronLeft | chevron-left |
Gpui.Icon.ChevronRight | chevron-right |
Gpui.Icon.ChevronUp | chevron-up |
Gpui.Icon.ChevronsUpDown | chevrons-up-down |
Gpui.Icon.CircleCheck | circle-check |
Gpui.Icon.CircleX | circle-x |
Gpui.Icon.Close | x |
Gpui.Icon.Copy | copy |
Gpui.Icon.Ellipsis | ellipsis |
Gpui.Icon.ExternalLink | external-link |
Gpui.Icon.Eye | eye |
Gpui.Icon.EyeOff | eye-off |
Gpui.Icon.File | file |
Gpui.Icon.Folder | folder |
Gpui.Icon.FolderOpen | folder-open |
Gpui.Icon.Inbox | inbox |
Gpui.Icon.Info | info |
Gpui.Icon.Loader | loader-circle |
Gpui.Icon.Minus | minus |
Gpui.Icon.PanelLeftClose | panel-left-close |
Gpui.Icon.PanelLeftOpen | panel-left-open |
Gpui.Icon.PanelRightClose | panel-right-close |
Gpui.Icon.PanelRightOpen | panel-right-open |
Gpui.Icon.Plus | plus |
Gpui.Icon.Redo2 | redo-2 |
Gpui.Icon.Search | search |
Gpui.Icon.SortAscending, Gpui.Icon.SortAscending.Faint | arrow-up (the faint one for an inactive column) |
Gpui.Icon.SortDescending, Gpui.Icon.SortDescending.Faint | arrow-down |
Gpui.Icon.Star | star |
Gpui.Icon.StarFill | star, filled |
Gpui.Icon.TriangleAlert | triangle-alert |
Gpui.Icon.Undo2 | undo-2 |
Gpui.Icon.User | user |
Gpui.Icon.WindowClose | the title bar's close |
Gpui.Icon.WindowMaximize | the title bar's maximize |
Gpui.Icon.WindowMinimize | the title bar's minimize |
Gpui.Icon.WindowRestore | the title bar's restore |
For other icons, add your own StreamGeometry resources, or a package such as Lucide.Avalonia, and point Data at them.