Material Icon Theme

Material Design icons for Obsidian

English | 简体中文

File icons

🏞️ Show all available file icons

Folder icons

🏞️ Show all available folder icons

Table of Contents

• Features
• Getting Started
• Customization
• Icon matching
• Development
• Icon sources
• Contributing
• License

Features

• Material Design file & folder icons for the Obsidian file explorer
• 1126 icons covering 2135 file names, 1379 extensions and 269 folder names
• Custom icon associations through a searchable picker
• Independent toggles for file and folder icons
• Settings UI in 10 languages
• Easy to use, and it follows your light / dark theme live

Getting Started

Requires Obsidian 1.13.0 or newer.

1. Install the plugin
   Download main.js, manifest.json and styles.css from Releases into .obsidian/plugins/material-icon-theme/.

2. Enable the plugin
   Open Settings → Community plugins and turn on Material Icon Theme.

3. Enjoy your new icons
   The file explorer picks them up immediately — no restart needed.

Release tags match manifest.json exactly (e.g. 1.0.0, not v1.0.0), as Obsidian requires.

Build from source

git clone https://github.com/GilbertzzzZZ/obsidian-material-icon-theme.git
cd obsidian-material-icon-theme
npm ci
npm run build
cp main.js manifest.json styles.css /path/to/vault/.obsidian/plugins/material-icon-theme/

Customization

Everything lives under Settings → Material Icon Theme.

File & folder icon toggles

File icons and folder icons switch on and off independently. Turning either off hands that half of the explorer back to your theme's own icons.

Custom icon associations

Map any file extension to any icon in the library. Custom rules take priority over every built-in match while enabled.

Enter the extension without its leading dot (vue, rs, myext), then pick an icon. Compound extensions work as well — a rule for d.ts wins over one for ts.

Search the full library by name when choosing:

Interface language

The settings UI ships in English, 简体中文, 繁體中文, 日本語, 한국어, Deutsch, Français, Español, Русский and Português, switchable from the top of the settings tab.

Icon matching

Files resolve in this order, first match wins:

Folders resolve by name against the folder icon table and fall back to the generic folder icon. Open and closed states swap as you expand and collapse.

Matching is case-insensitive throughout, so CLAUDE.md and claude.md resolve alike.

Development

npm ci
npm test              # regression tests
npm run dev           # watch mode (does not regenerate icon data)
npm run build         # full production build
npm run build-icons   # regenerate src/icon-data.ts only

src/icon-data.ts is generated — do not edit it by hand. To add mappings upstream does not ship, edit the custom block near the end of scripts/build-icons.mjs and re-run npm run build-icons.

Both main.js and src/icon-data.ts are gitignored, so run npm run build after cloning.

Icon sources

Icon artwork comes from Material Icon Theme, consumed through the material-icon-theme npm package, which in turn draws on:

• Material Design Icons
• Material Symbols

Contributing

Issues and pull requests are welcome.

See CONTRIBUTING.md for development, tests, upstream updates and releases.

• 🐛 Report a bug or request an icon
  Open an issue with your Obsidian version, plugin version, and steps to reproduce.

• 💡 Submit a change
  Create a pull request.

Missing an icon for a file type? It is usually worth requesting it upstream too, so every editor benefits.

License

MIT. The bundled icon artwork carries its own upstream licence — see NOTICE.