joelmelon

<p>This plugin allows you to use SVG icons within WordPress as shortcode and/or as Gutenberg Block and adds SVG support with the SVG-Sanitizer library.</p>
<h3>License</h3>
<p>Use this code freely, widely and for free. Provision of this code provides and implies no guarantee.<br />
Please respect the GPL v3 licence, which is available via http://www.gnu.org/licenses/gpl-3.0.html</p>


SVG Icons

This plugin allows you to use SVG icons within WordPress as shortcode and/or as Gutenberg Block and adds SVG support with the SVG-Sanitizer library.

Evan Buckiewicz

<p><a href="https://subtleblocks.com/icons" rel="nofollow ugc">Subtle Icons</a> is a lightweight plugin that brings thousands of icons directly into the WordPress block editor and Advanced Custom Fields (ACF).</p>
<p>Stop enqueuing heavy FontAwesome stylesheets. Subtle Icons generates clean, inline SVG code natively in the editor, keeping your frontend free of external scripts and font files.</p>
<h3>The Ultimate WordPress Icon Picker</h3>
<p>Powered by the massive <a href="https://icon-sets.iconify.design/" rel="nofollow ugc">Iconify</a> ecosystem, easily search and insert icons from dozens of popular open-source libraries without leaving the WordPress editor. Supported libraries include:</p>
<ul>
<li>Lucide Icons</li>
<li>Material Design Icons</li>
<li>Heroicons</li>
<li>FontAwesome</li>
<li>Bootstrap Icons</li>
<li>Phosphor Icons</li>
<li>…and dozens more, or upload your own custom SVGs!</li>
</ul>
<h3>Four Native Gutenberg Icon Blocks</h3>
<ul>
<li><strong>Icon Button Block:</strong> Prompt visitors to take action with a native-feeling button block supporting leading and trailing icons.</li>
<li><strong>Icon List Block:</strong> Create clean lists with icons that match your theme and improve scanability.</li>
<li><strong>Icon + Text Block:</strong> Pair an icon with text for notices, callouts, and feature highlights.</li>
<li><strong>Icon Block:</strong> A standalone SVG icon block with sizing, thickness, and color controls.</li>
</ul>
<h3>Advanced Custom Fields (ACF) Integration</h3>
<p>Bring icons to your structured content. Subtle Icons adds a fully integrated Icon Picker field to ACF. Add icons to taxonomies, repeaters, options pages, and custom blocks seamlessly.</p>
<h3>Built for Developers & Custom Integrations</h3>
<p>Take full control of the icon workflow. Use our lightweight filters and actions to tailor the experience for your clients and custom builds.</p>
<ul>
<li>Filter or restrict available icon collections</li>
<li>Configure default block icons globally</li>
<li>Robust developer documentation and more extensibility coming soon!</li>
</ul>
<h3>Development</h3>
<p>The complete source code for this plugin, including all uncompiled JavaScript and CSS, is available at this <a href="https://github.com/skysarwer/subtle-icons" rel="nofollow ugc">public GitHub repo</a>.</p>
<p>Build requirements: Node.js and npm.</p>
<p>To build from source:</p>
<ol>
<li>Clone the repository: <code>git clone https://github.com/skysarwer/subtle-icons</code></li>
<li>Install dependencies: <code>npm install</code></li>
<li>Compile assets for production: <code>npm run build</code></li>
<li>Or start a development watcher: <code>npm start</code></li>
</ol>
<h3>External Services</h3>
<p>This plugin uses the <a href="https://iconify.design/" rel="nofollow ugc">Iconify</a> API to power the Icon Picker. The API is never called on the public frontend; it only runs in the WordPress admin when actively used by a logged-in user with post-editing capabilities. No personally identifiable information (PII) is transmitted.</p>
<p>For more details, see <a href="#how%20is%20data%20sent%20to%20iconify%3F" rel="nofollow ugc">“How is data sent to Iconify”</a> in our FAQs.</p>


Subtle Icons – SVG Icon Block Suite, Icon Picker & ACF Field

Add 100k+ SVG icons (Lucide, Material, FontAwesome) directly to Gutenberg blocks and Advanced Custom Fields. A native, zero-bloat icon picker.

SVG Icons vs Subtle Icons – SVG Icon Block Suite, Icon Picker & ACF Field