This is a quick guide on how to make icon sets with alternative dark and light icons.
It uses Fluent Style Icon Set as an example.
Download
- Grab it from Fluent Style Icon Set
Icon Set Basics
If you aren't already familiar with the basics of creating icon sets, please see Icon Sets [Directory Opus Manual].
PNG Icon Grids
Your icon grid PNG can have icons for each mode:
(Half the icons may be difficult to see, depending on which forum theme you're using.)
In the example above, the dark and light icons are in separate blocks. That was the easiest way to recolor them all at once, but it isn't the only option.
You can also have each icon pair together if you prefer:
While other arrangements are possible, one of those is usually best.
If not all icons need both images, we recommend leaving an empty space in the grid, so everything still lines up. This makes it easier for you to add, edit or replace icons in the future.
XML
In the XML, the main <icon col="x" row="y"> specifies the icon grid position for light mode.
Within that, there's a <dark col="x" row="y" /> which specifies the alternative dark mode icon. (If that's missing, the same icon will be used for both modes, as before.)
<icon col="1" row="16" name="empty"> <dark col="1" row="1" /></icon>
<icon col="2" row="16" name="spacer"> <dark col="2" row="1" /></icon>
<icon col="3" row="16" name="copy"> <dark col="3" row="1" /></icon>
<icon col="4" row="16" name="copyas"> <dark col="4" row="1" /></icon>
Although it is not used in this example, you can also use remap_dark="yes" to tell Opus to automatically convert monochrome icons designed for light mode. They will be recolored to use the Preferences / Colors and Fonts / Windows Colors / Window contents / Text color. (But you may not want that color, e.g. if you want white icons instead of grey, and it's probably only good for converting icons made for light mode, not vice versa, which is why I did not use it in this case.)
<icon col="1" row="1" name="empty" remap_dark="yes" />
<icon col="2" row="1" name="spacer" remap_dark="yes" />
<icon col="3" row="1" name="copy" remap_dark="yes" />
<icon col="4" row="1" name="copyas" remap_dark="yes" />
Opus 12 Compatibility
At least in theory, this should also still work with Opus 12, but you'll always get the light mode icons, not the dark mode ones, in Opus 12.
