UI Icons

This module leverage Drupal 11.1 Icon API which allow to define icon packs as YAML-discovered to integrate seamlessly in Drupal development and site-building with Field API (with Link attributes), CKeditor5, Menu API, Media, a Web font extractor and a library.

After installing this module, check our repository of examples to include existing icon pack providers.

Drupal compatibility

The 2.0.x branch is for Drupal 11.3+ and is the only maintained branch. All bug fixes and new features land here.

The 1.1.x branch is deprecated. It will not receive any bug fix or new feature, and we kindly ask you not to use it for new projects. It targeted Drupal 11.1+, and both Drupal 11.1 and 11.2 have since reached end of life, so any site still on that branch should plan an upgrade.

If your site already runs Drupal 11.3 or newer, you can move to 2.0.x right away. Please read the 2.0.0 release notes first: the 1.0.x backport modules, UI Patterns 1.x support and all procedural hooks have been removed. For Iconify, use Iconify Icons 2.0.x instead.

Integration with Drupal site building tools

Once discovered from the icon packs, the icons can be used:

as a Field, with specific widget and formatter, to store a picked icon and render it in entity displays. as a Field Formatter for Link fields. in Menu links UI. in Ckeditor5, to add an icon in WYSIWYG content. in Media, as a media type.

Feel free to propose other integrations.

Icons library

The UI Icons Library sub-module generates an icons library page to be used as documentation for content editors or as a showcase for business and clients.

Showcases

This module does not include third-party icons but makes it very simple to add existing icons from any provider or your own, and mix them together!

Examples in contrib space:

Bootstrap 5 DSFR (French Gov) USWDS (US Gov) 1 pack 3 packs 1 pack DaisyUI 4 packs folder

You can also check our examples repository which include a lot of starting configuration to include icons from:

• Bootstrap Icons
• Delta icons
• Evil icons
• Feather Icons
• FontAwesome (Free version)
• Heroicons
• Iconicons
• Lineicons
• Lucid
• Maki
• Material Symbols
• Octicons
• Phosphor Icons
• Remix icon
• Iconoir
• Flowbite icons
• Tabler icons (Free version)
• Boxicons (v2)

Drupal core

We are willing to push part of this module to Drupal core, The Icon API was a first step, next step:

• Add form element(s) for Icon API

Feel free to contact me if you're willing to help.

Incompatibility

• Ui Icons CKeditor5 is not compatible with ckeditor5_icons module

UI Suite

UI Suite provides a cohesive set of modules to implement full design systems while preserving and improving the Drupal site building experience.

UI Icons can be used as standalone, but shines with other UI Suite modules. Together, they provide a a full API to implement design systems: