> Another issue as mentioned is that per-control CSS skinning breaks easily with custom themes. Instead of using system colors devs often hard-code a custom look.

After years of using MacOS, I made a commitment this year to use, support, and develop for Linux on a regular basis.

Starting off with little knowledge of GTK, I progressed from "hello world" to working on my first app, but end user customization has always been close to my heart, so naturally I started looking at what it takes to bring a GTK desktop app from "stock system UI" to "developer and user themable".

All this to say, it could be my inexperience, but I'm finding that GTK seems to be very much "all or nothing" here. I can use all the default widgets and be 100% native, and I can "* { background-color: pink; }" my way into a blank canvas, but if I want to make custom controls that build on the user's system theme and whatever accessibility he/she has set up for him/herself, I'm on my own to make my best guesses.

There's no reliable way to determine whether the user is scaling text, using a dark or light theme, or something super high contrast for accessibility. I can try to query some built in widgets and make decisions from there, but I've found that quite flaky as well.

Moreover, even finding which classes to assign to widgets to "piggy back" off the common system colors when building my own widgets is a chore of hunting through themes like Adwaita to find the piece of the system widget I'm trying to utilize. It's not quite WPF "copy the entire widget's XML and re-implement it from scratch to customize it" bad, but for as powerful as the CSS support seems to be in GTK, it feels like there's a layer in between "full system UI" and "total rebrand" that's missing.

For whatever reason this is not well documented, but all the theme's colors are available with a special syntax in the CSS: https://gitlab.gnome.org/GNOME/gtk/-/blob/master/gtk/theme/A...

So for example you should be using this to use the user's foreground and background color:

    color: @theme_fg_color;
    background-color: @theme_bg_color;

You can use some modifier functions on those colors too to compute additional colors: https://developer.gnome.org/gtk4/stable/ch39s02.html

I would suggest against trying to piggy back on built-in CSS styles; usually with the default widgets you want to favor composition over inheritance. But if you really need to you can use the GTK inspector to look at the styles on any given system widget, that should be a bit easier than grepping through the CSS.

Thanks for the pointers, this is very helpful!

> Another issue as mentioned is that per-control CSS skinning breaks easily with custom themes. Instead of using system colors devs often hard-code a custom look.

Ironically, you used to be able to use system colors via CSS. Like it usually happens on the web, that feature was also removed because of security reasons - apparently it made it easier for scammers to render fake system popups.

Some UI toolkits use CSS or CSS-like styles for native widgets, hopefully those can still access system colors.

I'm not sure why you're talking about Gtk/QT theming in the past tense, it all still works the same way with modern versions of Gtk/QT.

I still use gtk2 style for Qt to this day, as it's still supported in Qt 5. I run i3 as my window manager, and most of my applications are either Qt or still using GTK2 (like pcmanfm).