Visual bugs with Dark theme in Molecule / Layers lists

I’m unsure if this is a Mac bug, or more systematic…

A student uses Dark theme on a Mac. While most of the text is correctly white-text on black background, the molecule / filename list is not…

And also, the icons in the Layer panel are dark-on-dark:

So I guess the first question is whether the black-on-black text in the molecule lit happens on other systems?

Secondly, it would be great to have alternatives for light / dark versions (in SVG?) of the layer icons, e.g.

I know there are some good open source icon sets - I tried some image search and couldn’t find the original versions.

  • lock
  • lock open
  • “…” dots
  • eye icon
  • black X to close a layer
  • (maybe also the red X for “close” in the molecule list?)

Yes, the same occurs on Linux:


The icons in the menus and the “file” toolbar are sourced from the OS theme and – on Linux with KDE at least – change to match my icon theme, giving it a native look and feel. For example, on my system:


Looking at avogadroapp/avogadro/mainwindow.cpp it looks like this is achieved by using QIcon::fromTheme("document-save-as") etc.

Can we do the same for the icons in those panes?

Maybe, but I’d guess on Mac and Windows, we still need the “fallback” icons. Looks like someone posted the list for Linux:

So we probably can re-use Close, but I think we need something for other icons, e.g.

Or Feather Icons

list-add (a plus) and list-remove (a cross) should be definitely fine then since they’re in the Qt list.

The KDE default Breeze icon theme also has, for example, things like:

  • view-visible, aliased to visibility (an eye)
  • view-more or overflow-menu (three dots)
  • lock

As you mentioned there’s font-awesome and feather; some other icon sets that come to my mind or I have bookmarked in the past:

If you wanted to use a set like that, I think it’d be best to then use the same theme for all the icons in the interface, as it looks quite jarring if there’s a mixture of visual styles (and we already have at least two sets since we have our own tool icons).

Okay, I’m starting a pull request:

My feeling is that as much as possible, we should use the system theme icons. Getting everything from one source is going to be tricky unless we hire someone to do the whole set.

BTW, it seems like your Layer panel has weird column widths. The first column should be the widest.

Yes, sure, but my point is that it would still be better to use two sources than three.

The tool icons are cohesive and self-contained in one place, so while it’s not ideal that they are different to everything else, I’m not as worried about them not fitting in with a uniform design.

All the other non-tool icons used in the interface really ought to have the same visual style, though. Consistency is very important in good UI/UX design.

I’d love it if Avogadro used my system icon theme for the icons, but that should only happen if all icons can be sourced from the system theme, otherwise it’s jarring.

Yes, I know. That’s just how it looks by default, though, I haven’t changed anything.

1 Like

With that pull request, it should now use system icons for everything.

But your previous point was that not all those icons are universally available from the system theme?

It looks pretty complete based on your comments. The pull request will try to pull from the system theme (e.g., visibility or lock) and go to a fallback otherwise.

Take a look if you like. I think it should be set. Certainly it fixes up the text colors.

1 Like

It might be worth mentioning that currently Av2 doesn’t have dark mode on Windows right now. I believe @matterhorn103 indicated that the Qt6 upgrade will fix that, but for now it’s light mode all the way.

Okay, I’ll see what I can do to get Windows packages with Qt6. Somehow 1.100 release build left out Open Babel, so it can’t be worse…