Insert Material Design Icons into your WordPress post and pages.

threeroutes media

Mayur Somani

Elegant Themes Icons

Enables the Elegant Themes icon font set within WordPress. Icons can be inserted using either HTML or a shortcode.

Rupok

AwesomePress

Enables the Font Awesome icon font set within WordPress. Icons can be inserted using either HTML or a shortcode.

webangon

Icon Element – Icon Pack for Elementor Page Builder (6718 icons)

The ultimate icon-packs for elementor page builder.

GhozyLab

Web Icons

Web Icons plugin gives you scalable vector icons that can instantly be customized. More than 2.5k icons available.

Wedesigntech

Elementor Ico Iconfont Library

Adds Ico iconfont items to default Icon Library of Elementor.

xtawfik

Hugeicons

Add beautiful Hugeicons to your WordPress site with an easy-to-use icon picker for both classic and block editors.

Surbma

CherryPick Studios

Surbma | Font Awesome

Font Awesome - The iconic font and CSS toolkit

mudssar

amazing neo icon font for elementor

amazing neo for elementor ,one of the best icon font by Amazing Team.: icon, font, amazing neo, amazing font, icon font.

eranaicons

Erana Icons Font for Visual Composer

Add-on that helps you add Erana icons font.

braginteractive

<p>Enables 1000+ Material Design icons within WordPress pages and posts. Icons can be inserted with a shortcode or HTML markup.</p>
<h4>Features</h4>
<ul>
<li><strong>Shortcode generator</strong> – includes an easy-to-use TinyMCE pop-up shortcode generator.</li>
</ul>
<h4>Usage</h4>
<p>Material Design Icons can be used in 3 different ways: shortcode, HTML, and TinyMCE</p>
<h4>1. Shortcode</h4>
<pre><code>[mdi-icon name="material-ul" size="2x" color="red"]
</code></pre>
<p>You can also use hex values for color:<br />
    [mdi-icon name=”material-ul” size=”2x” color=”#000000″]</p>
<p>You can read more about shortcode usage on <a href="https://github.com/braginteractive/Material-Design-Icons-WordPress-Plugin" rel="nofollow ugc">Github</a></p>
<h4>2. TinyMCE</h4>
<p>Material Design Icons also provides you with a pop-up window when editing in TinyMCE’s visual mode. Check out our <a href="https://wordpress.org/plugins/material-design-icons/screenshots/" title="Screenshots" rel="ugc">Screenshots</a> to see what it looks like.</p>
<h4>3. HTML</h4>
<p>Note that prefixes are required for HTML usage. For this reason, shortcode usage is encouraged over HTML. A HTML version would look like:
    </p>


Alternatives to Material Design Icons

Top alternatives