Description
LWN Icons is a powerful WordPress plugin that seamlessly integrates Google’s Material Design icons into your site. With LWN Icons, you can easily add modern, sleek icons directly within the Gutenberg editor to enhance your content’s visual appeal. The plugin lets you customize icon color, size, add titles, links, and link targets, making your icons fully interactive and perfectly tailored to your design.
Features
- Latest Google Material Icons: Automatically access thousands of up-to-date icons directly from Google’s Material Icons library.
- Sync Anytime: Keep your icons current by syncing with Google Material Icons whenever you need.
- Custom Links & Titles: Add clickable links, titles, and targets to icons for interactive designs.
- Customizable Size & Color: Adjust icon size and color to perfectly match your theme or plugin.
- Icon Search: Quickly find the icon you need using the built-in search feature.
- Gutenberg Block Ready: Easily insert icons anywhere using the Gutenberg block editor.
- Use Anywhere: Compatible with themes, plugins, and custom layouts across your WordPress site.
- Smooth Display: Fixes front-end flash issues for icons, ensuring seamless loading and display.
Screenshots

Installation: Install and activate the LWN Icons plugin.

Add an Icon: Add an icon to a post or page using the LWN Icons block.

Customize Color & Size: Adjust the color and size of an icon via the Block Attributes sidebar.

Delete Icon: Remove a single icon or delete the entire LWN Icons block.

Link & Title: Add a link, tooltip title, and choose whether it opens in the same or new tab.

Replace Icon: Swap an existing icon with a new one using the Pen (Edit) icon.

Search Icon: Search for icons in the modal using keywords.

Sync with Google: Sync with Google Material Icons, clear cache, and fetch the latest icons.
Blocks
This plugin provides 1 block.
- Lwn Icons Integrate Material Icons With Gutenberg Editor
Installation
- Upload the plugin files to the
/wp-content/plugins/lwn-iconsdirectory, or install the plugin through the WordPress plugins screen directly. - Activate the plugin through the ‘Plugins’ screen in WordPress.
FAQ
-
How do I add an icon to my post or page?
-
Simply add the LWN Icons block in the Gutenberg editor, click “Select an Icon,” choose your desired icon, and close the modal.
-
Can I customize the icon’s color and size?
-
Yes! Use the Block Attributes sidebar to adjust the icon’s color and size to fit your theme or design.
-
How do I add links or tooltips to icons?
-
Select an icon, then in the Block Attributes sidebar, you can add a URL, a title, and choose whether it opens in the same tab or a new tab.
-
How do I replace an existing icon?
-
Select the icon you want to replace and click the Pen (Edit) icon. Then choose a new icon from the modal and close it.
-
How can I delete an icon or block?
-
Select the icon and click the Trash button in the upper toolbar. You can also delete the entire LWN Icons block if needed.
-
Can I search for icons easily?
-
Yes! Click “Select an Icon” and use the search bar in the modal to quickly find the icon you need.
-
How do I sync with the latest Google Material Icons?
-
In the icon selection modal, click Sync with Google, optionally clear the cache, and then click Fetch and Cache Material Icons to get the latest icons.
-
Is this plugin compatible with all themes?
-
LWN Icons is compatible with most themes, plugins, and custom layouts. It works seamlessly with the Gutenberg block editor.
-
Will the icons display smoothly on the front-end?
-
Yes! The plugin ensures smooth front-end display and fixes flash issues for icons during page load.
-
Does LWN Icons include the latest Material Design icons?
-
Yes! The plugin comes with the latest icons, but if you notice an icon is missing, simply sync with Google Material Icons in the icon selection modal to update your library.
Reviews
There are no reviews for this plugin.
Contributors & Developers
“LWN Icons” is open source software. The following people have contributed to this plugin.
ContributorsTranslate “LWN Icons” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
1.0.1
- Fix plugin check errors
- Improve Styles
1.0.0
- Updated Material Icons library
- Added ability to sync icons with Google
- Added icon title, link, and link target options
0.1.0
- Initial release