Search...Search plugins and themes...
⌘K
Sign in
  • Get started
  • Download
  • Pricing
  • Enterprise
  • Account
  • Obsidian
  • Overview
  • Sync
  • Publish
  • Canvas
  • Mobile
  • Web Clipper
  • CLI
  • Learn
  • Help
  • Developers
  • Changelog
  • About
  • Roadmap
  • Blog
  • Resources
  • System status
  • License overview
  • Terms of service
  • Privacy policy
  • Security
  • Community
  • Plugins
  • Join the community
  • Discord
  • Forum / 中文论坛
  • Merch store
  • Brand guidelines
Follow us
DiscordTwitterBlueskyThreadsMastodonYouTubeGitHub
© 2026 Obsidian

Material Symbols

cberanecberane4k downloads

Add Google's Material Symbols (outlined).

Add to Obsidian
  • Overview
  • Scorecard
  • Updates2

This is a simple plugin for Obsidian to add Google's material symbols outlined.

This plugin adds 2 commands to easily add symbols to the current document.

Usage

  1. Hit Ctrl + P and search for symbol.
    You can find 2 options to add the icons:
    1. Add Symbol adds <span class="mso"></span>
    2. Add Symbol (class single-quoted) to add <span class='mso'></span> as it could be needed in nested elements.
  2. After inserting the icon html, the cursor will be set into the tag.
  3. Add the icon name as expected from Google Material Symbols

Example

<span class="mso">dashboard</span> should render this icon:

Default Settings

The following font settings will be applied by default:

Setting Description
fill 0
weight 200
grade -25

Overwriting defaults

For easier changes you can use one of the following classes to activate other font settings:

Class Change
fill1 activates font filling
weight100 sets the font-weight to 100
weight300 sets the font-weight to 300
weight400 sets the font-weight to 400
weight500 sets the font-weight to 500
weight600 sets the font-weight to 600
weight700 sets the font-weight to 700
grade0 sets the grade to 0
grade200 sets the grade to 200

Example

  • <span class="mso">dashboard</span> will render the dashboard icon with weight 200 (default!)
  • <span class="mso weight400 grade200">dashboard</span> will render the dashboard icon with weight 400 and grade 200
82%
HealthExcellent
ReviewSatisfactory
About
Insert Google's Material Symbols (outlined) as inline HTML spans into notes. Add symbols via commands that insert <span class="mso"></span> or a single-quoted <span class='mso'></span>, then type the icon name to render. Apply weight and grade classes (e.g. weight400, grade200) to adjust appearance.
IconsHTMLCommands
Details
Current version
1.0.0
Last updated
3 months ago
Created
3 years ago
Updates
2 releases
Downloads
4k
Compatible with
Obsidian 0.15.0+
License
Apache-2.0
Report bugRequest featureReport plugin
Author
cberanecberane
github.com/cberane/obsidian-material-symbols
GitHubcberane
  1. Community
  2. Plugins
  3. Icons
  4. Material Symbols

Related plugins

Commander

Customize your workspace by adding commands everywhere, create macros and supercharge your mobile toolbar.

Iconic

Customize your icons and their colors directly from the UI, including tabs, files & folders, bookmarks, tags, properties, and ribbon commands.

Task Collector (TC)

Change task status and collect tasks within a document using hotkeys and context menus.

Paste URL into selection

Paste URL "into" selected text.

Tray

Run Obsidian from the system tray for customisable window management and global quick notes.

Shell commands

Define system commands that you want to execute via command palette, hotkeys, URI links or automated events. E.g. open external applications or perform automated file modifications.

Link Favicons

See the favicon for a linked website.

Vimrc Support

Auto-load a startup file with Vim commands.

List Callouts

Create simple callouts in lists.

Find orphaned files and broken links

Find files that are not linked anywhere and would otherwise be lost in your vault. In other words: files with no backlinks.