Icons
NowKit's icons are a pluggable pack system. Every component pulls its icons from the theme
(KitTheme.icons.back, KitTheme.icons.settings, …), so you can swap the entire app's icon set
in one place — or override a single icon at any call-site.
The kit ships Material icons on by default. Feather and Tabler are bundled but
disabled (no unused dependencies in a fresh clone); turn one on with /kit-setup-theme.
Several more packs are available too.
Available icon sets
| Pack | Style | Browse / website |
|---|---|---|
| Material Symbols (default) | Google's Material 3 icons | fonts.google.com/icons |
| Feather | Light, minimal stroke icons | feathericons.com |
| Tabler | 4000+ crisp outline icons | tabler.io/icons |
| Simple Icons | Brand/logo icons | simpleicons.org |
| Font Awesome | The classic huge icon set | fontawesome.com/icons |
| Eva Icons | Rounded, friendly icons | akveo.github.io/eva-icons |
| Octicons | GitHub's icon set | primer.style/octicons |
| Line Awesome | Font Awesome redrawn in line style | icons8.com/line-awesome |
| Weather Icons | Weather + meteorological glyphs | erikflowers.github.io/weather-icons |
| CSS.gg | 700+ minimal, open-source icons | css.gg |
All packs are provided for Jetpack Compose via the compose-icons library — browse any pack's website to find an icon name, then use it in code.
Switching your icon pack
/kit-setup-themePick Material (default — no change), Feather, Tabler, or another pack. The command enables the chosen pack's dependency, swaps the kit-wide binding, and (R8) strips the icons you don't use, so your release stays lean. Switching later is reversible — re-run the command.
How components use icons
Components read icons from the theme, so one binding changes them everywhere:
- Kit-wide — the pack you pick in
/kit-setup-themesetsLocalKitIcons. - Per call-site — any component that takes an icon accepts an
ImageVector?override, so you can use a one-off icon without changing the whole set.
See the Components Catalog for the components these icons appear in.