vscode-icon-resolver

Lightweight library to resolve file and folder icon names for Material, Catppuccin, and VSCode icon themes.

A modernized icon name resolver for Desktop and Mobile apps (rarely needed for web projects). Inspired by vscode-icons-js but expanded to support multiple popular icon sets.

Features

• Multiple Themes: Supports Material Icon Theme, Catppuccin, and VSCode Icons.
• Extreme Performance: Uses Map-based lookups for O(1) resolution.
• Zero Dependencies: Pure logic, no runtime overhead.
• TypeScript First: Full type safety with comprehensive definitions.
• Tree-shakeable: You only pay for what you use. Optimized for modern bundlers.
• Dual Format: Native ESM and CJS support.

Installation

npm install vscode-icon-resolver

Usage

This package returns the canonical icon name (e.g., folder-src, file-typescript). You can use these names to load your own SVG assets or CSS classes.

Basic Usage

import { getCatppuccinFileIcon, getMaterialFileIcon, getVSIFileIcon } from "vscode-icon-resolver";

// Material Theme
const material = getMaterialFileIcon("index.ts"); // "file-typescript"

// Catppuccin Theme
const catppuccin = getCatppuccinFileIcon("package.json"); // "file-npm"

// VSCode Icons (VSI)
const vsi = getVSIFileIcon("docker-compose.yml"); // "file-docker"

Folder Resolution

import { getMaterialFolderIcon, getVSIFolderIcon } from "vscode-icon-resolver";

// Standard folders
getMaterialFolderIcon("src"); // "folder-src"

// Root folder detection (Material/VSI support specific root icons)
getMaterialFolderIcon(".git", true); // "folder-root"

📚 API Reference

Material Icons

• getMaterialFileIcon(fileName: string): string
• getMaterialFolderIcon(folderName: string, isRoot?: boolean): string

Catppuccin Icons

• getCatppuccinFileIcon(fileName: string): string
• getCatppuccinFolderIcon(folderName: string): string

VSCode Icons (VSI)

• getVSIFileIcon(fileName: string): string
• getVSIFolderIcon(folderName: string, isRoot?: boolean): string

Performance

Unlike other libraries that use linear array searches (O(N)), vscode-icon-resolver uses a pre-indexed Map system. This makes icon resolution O(1) regardless of the number of mappings, making it suitable for high-performance file trees and IDE-like applications.

Credits

Inspired by:

• vscode-icons-js
• Material Icon Theme
• Catppuccin Icons
• VSCode Icons

License

MIT © Yanis (DevYatsu)