Component Editor (VCL)
You can set the properties of an SVGIconImageList or an SVGIconImageCollection component using the classic Delphi Object inspector, in combination with the collection editor and the Structure editor, but it's most simple to use the advanced Image Editor supplied: double-click to the component to open the component editor as you can do with any Delphi component.
In this figure you can see the advanced component editor for VCL version:
And the same component editor with dark mode IDE:
At the top of the editor you can set the properties of your SVGIconImageList instance, like Size or Width and Height (if you are editing an SVGIconImageCollection this panel is not visible).
At the left of the editor you can see the categories of the icons and select them to filter the view.
At the center of the editor you can see a preview of the icons present in the collection, filtered by selected category. Selecting an icon you can see the SVGIconItem properties like IconName and SVGText at the bottom of the editor.
Using the splitters you can resize all the sections of the editor.
If you are editing an SVGIconImageList or a SVGIconVirtualImageList, you can also specify the size of the icons, or Width and Height, if they are different.
In the "Global properties" panel, you can also change attributes that are applyed to all Icons: FixedColor, GrayScale and Opacity.
If you want to apply a category to a set of Icons, multi-select them in the image viewer and click to "Set category..." button, then edit the category name and confirm to apply the value: the list of categories shows and auto-select the new category added.
You can change the category of the icon also in the Category Edit, the press "Tab" to apply the value.
In this editor you can also Load multiple Icons using the "Add..." Button.
In the OpenDialog, select multiple-files and import them into the ImageList: the icon names is set with the filename.
Using Drag-and-Drop, you can move icons prom a position to another...
Use "Delete" button at Image View level to delete all the selected Icons, or use "Replace" button to replace with another file.
You can also delete a single icon with the bottom button.
Using "Export svg files..." button you can save multiple svg icons files into a folder.
Using "Export png files..." button you can save multiple png files into a folder, of size defined in the above fields.
If you want, you can set FixedColor or GrayScale of a specific icon, that overrides the global value.
You can also edit directly the SVG Text of an Icon into the editor at the bottom: the changes are immediatly showed in the Icon image.
You can also export a single SVG icon to multiple PNG files with different resolutions, using "Export PNG" button:
