Beyond file and folder icons in the Explorer, VS Code exposes a second icon layer called the Product Icon Theme — the glyphs that make up the IDE’s own chrome: Activity Bar buttons, sidebar panel headers, Explorer toolbar actions (new file, new folder, refresh, collapse all), Source Control controls, the debug toolbar, the status bar, breadcrumb chevrons, and more. Lynx Theme Pro ships two purpose-built product icon themes that replace these defaults with a cohesive, modern aesthetic that complements any of the eight Lynx color themes.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/bastndev/Lynx-Theme-Pro/llms.txt
Use this file to discover all available pages before exploring further.
Product Icons vs. File Icons
It is important to understand the distinction between the two icon systems in VS Code:- File Icon Theme — controls the icons shown next to files and folders in the Explorer sidebar. Activated via Preferences: File Icon Theme.
- Product Icon Theme — controls the icons that form VS Code’s own UI chrome (Activity Bar, panel tabs, editor toolbar buttons, etc.). Activated via Preferences: Product Icon Theme.
File Icon Themes decorate your project’s files and folders in the Explorer. Product Icon Themes replace the VS Code interface icons — the glyphs you click to switch between the Explorer, Search, Source Control, Extensions, and other Activity Bar views. Both can be active simultaneously.
The Two System Icon Themes
Lynx (Material) Icons — lynx-material-icons
Delivered as a custom WOFF font (lynx-material-icons.woff), this theme applies Material Design–inspired glyphs to all major VS Code product icon slots. It covers 651 icon definitions spanning the full range of IDE chrome: Activity Bar views (files, search, source-control, remote-explorer, extensions, account, settings-gear), Explorer toolbar actions (new-file, new-folder, refresh, collapse-all), Source Control controls (add, discard, check, git-branch), panel actions (split-horizontal, split-vertical, list-tree, list-flat), notifications (bell, bell-dot, error, warning, info), debug controls (debug-start, debug-pause, debug-step-over), and many more.
Lynx (Test) Icons — lynx-test-icons
An alternate product icon set also delivered as a WOFF font (lynx-test-icons.woff). It covers the same product icon slots as the Material variant but with a different glyph style — useful for developers who want to experiment with an alternate aesthetic or compare icon rendering approaches. The Test set is ideal for contributors who want a clear visual signal that a non-production icon set is active.
Activating System Icons
Run the Product Icon Theme command
Type and select Preferences: Product Icon Theme from the dropdown list.
Covered UI Regions
When either Lynx product icon theme is active, the following VS Code UI areas display custom Lynx glyphs:| UI Region | Example icons |
|---|---|
| Activity Bar | Files, Search, Source Control, Extensions, Account |
| Explorer toolbar | New File, New Folder, Refresh, Collapse All |
| Source Control panel | Add, Discard, Check, Git Branch |
| Editor & panels | Split Horizontal, Split Vertical, Go to File, Compare Changes |
| Debug toolbar | Debug Start, Debug Pause, Debug Step Over |
| Status bar & notifications | Error, Warning, Info, Bell, Bell Dot, Sync |
| General UI | Tree Item Expanded, List Tree, List Flat, Toolbar More |
Choosing a System Icon Theme
Font-Based Delivery
Unlike the file/folder icon themes (which use individual SVG files), system icons are embedded in a WOFF font. Each icon is mapped to a Unicode private-use character, and VS Code renders the correct glyph at any size without pixelation.src/icons/icon-system/lynx-material-icon.json and src/icons/icon-system/lynx-test-icon.json respectively, each referencing the shared font file and defining hundreds of fontCharacter entries.