Icon Library
- 4 minutes to read
DevExpress VCL controls ship with a diverse library of icons created by our design team. The library includes both full-color and grayscale icons you can use as glyphs in UI elements of your application.
Library Installation Path and Custom Icons
The DevExpress Icon Library is installed into the following folder: %DevExpress VCL Installation Folder%\ExpressLibrary\Sources\Icon Library\. All icons are arranged into collections and categories by themes and purposes (Actions or Arrows, for instance). You can manage icon collections available in the Image Picker dialog, extend the Icon Library with custom icon folders, and use custom icons in the same manner as built-in icons. Custom icon folders can be located anywhere in the file system.
Image Picker
Image Picker is a design-time dialog that you can use to browse the Icon Library and select required images for a target control. The dialog can limit the icon list displayed within the gallery according to the specified filtering criteria, such as collections, categories, sizes, and the current image name entry.
Font Icons
The Image Picker dialog allows you to select and use font icons available in Microsoft Windows® 10 and newer operating systems.
Important Font Icon Limitations
A font icon is an SVG image that contains a character from a special font shipped with the operating system. Since an SVG image with text contains only font glyph references rather than actual font glyphs, an application can display a font icon only if the corresponding font is available in the target operating system:
- Microsoft Windows® 11
This operating system ships with the following special fonts: Segoe Fluent Icons (default) and Segoe MDL2 Assets.
DevExpress-powered applications use glyphs from the Segoe Fluent Icons font to display font icons:
- Microsoft Windows® 10
This operating system ships with the Segoe MDL2 Assets special font:
Important
Developer Express Inc does not embed, include, or distribute the font icon set. You must independently review and agree to license third-party icon collections from their respective owners. Use these icon fonts only if client machines run Microsoft Windows® 10 or newer.
Manage Custom Icon Collections
To add a custom icon collection, click the Add a custom collection button in the Image Picker dialog, select the target folder in a shell dialog, and click the Select button.
Like predefined DevExpress Icon Library collections, the added folder should include nested category folders populated with images. The Image Picker dialog uses the target folder’s name as the collection name displayed in the Collection box. To remove a selected custom collection from the DevExpress Icon Library, select the required collection and click the Remove the selected collection button:
Note
The DevExpress Icon Library maintains the list of custom icon collections in the following Microsoft Windows® Registry directory:
%Computer%\HKEY_CURRENT_USER\SOFTWARE\Developer Express\IconLibrary\Collections
You cannot remove predefined icon collections from the DevExpress Icon Library. A custom collection remove operation does not remove the corresponding folder from the file system.
Image Picker Accessibility
The Image Picker dialog is available for all DevExpress components that work with images.
Components with Individual UI Element Icons
The Image Picker dialog is available for any DevExpress component that can load an individual UI icon at design time. For example, any Glyph property with the TdxSmartGlyph type displays an ellipsis button in the Object Inspector.
You can click this button to invoke the Image Picker and select the required image from the DevExpress Icon Library or a custom image collection.
TcxImageList
You can use the Image Picker to populate a TcxImageList component with images at design time. Double-click the component or invoke its context menu and select the Edit… item to invoke the Image List Editor. To invoke the Image Picker dialog, you can press the Alt+Ins key combination or click the Add Image button and select the Load From DevExpress Icon Library… menu item.
TcxImageCollection
Right-click a TcxImageCollection component and select the following context menu item to invoke the Image Picker dialog.
Alternatively, you can click the Edit… context menu item to open the collection editor, create or select an image collection item, and double-click its Picture property value field in the Object Inspector to invoke the Image Picker dialog.