When using the dark mode to view the QDS Manual, black icons with a white background stick out, while black icons with a transparent background become invisible. We also have gray icons with a transparent background, which work nicely.

Because it would be difficult to make CSS changes that take all these cases into account,  pick an icon style that looks good in both light and dark modes and then fix any icons that don't adhere to the style in the Qt Design Studio Manual.

This page shows black icons with transparent and white backgrounds as well as gray-scale icons with a white background.

• https://doc.qt.io/qtdesignstudio/qtquick-positioning.html#summary-of-aligment-buttons

Here, the icons look bad in the dark mode:

• https://doc.qt.io/qtdesignstudio/qtquick-positioning.html#summary-of-aligment-buttons 

Here, they look good:

• https://doc.qt.io/qtdesignstudio/quick-shapes.html#summary-of-shapes 

Here are some bigger images with a white background:

• https://doc.qt.io/qtdesignstudio/studio-3d-materials-types.html 

Here we have white icons with black outlines:

• https://doc.qt.io/qtdesignstudio/studio-3d-lights.html

Here are gray-scale icons:

• https://doc.qt.io/qtdesignstudio/quick-scalable-image.html#using-states-to-change-component-property-values
• https://doc.qt.io/qtdesignstudio/qtquick-properties.html#resetting-component-position-and-size