Window color schemes

[danirod]

Since libadwaita 1.6 migrates the color system of its theme to CSS variables, it is now very easy to override the colors of the application, with interesting consequences. Once #96 lands, it would be interesting to have official support for some colorschemes.

Note that these don't seem to affect the GtkSource color schemes yet.

Also, wondering if rather than setting the --accent-bg-color variable, I can set the different --accent-* color variables so that if you have your system-wide accent color set to blue, red, green... it uses the closest one from the color scheme that matches the semantic accent color set on your system.

Here are some examples. To test these, open the GTK inspector by pressing Ctrl + Shift + I, then go to the CSS tab and paste the following snippets into the area. Press the ⏸️ button to toggle custom CSS styles. Note that in my computer the performance of this action is very poor and very laggy, so the themes haven't been thoughtfully tested yet, this is just an example or a proof of concept.

Nord

window {
  --headerbar-bg-color: #3b4252;
  --headerbar-fg-color: #eceff4;
  --headerbar-backdrop-color: #2e3440;
  --window-bg-color: #434c5e;
  --card-bg-color: #4c566a;
  --card-fg-color: #eceff4;
  --accent-bg-color: #81a1c1;
  --window-fg-color: #eceff4;
}

Catpuccin

window {
  --headerbar-bg-color: #292c3c;
  --headerbar-fg-color: #c6d0f5;
  --headerbar-backdrop-color: #232634;
  --window-bg-color: #303446;
  --card-bg-color: #414559;
  --card-fg-color: #c6d0f5;
  --accent-bg-color: #ca9ee6;
  --window-fg-color: #c6d0f5;
}

Solarized

window {
  --headerbar-bg-color: #073642;
  --headerbar-fg-color: #eee8d5;
  --headerbar-backdrop-color: #002b36;
  --window-bg-color: #073642;
  --card-bg-color: #586e75;
  --card-fg-color: #eee8d5;
  --accent-bg-color: #2aa198;
  --window-fg-color: #eee8d5;
}

Gruvbox

window {
  --headerbar-bg-color: #282828;
  --headerbar-fg-color: #ebdbb2;
  --headerbar-backdrop-color: #282828;
  --window-bg-color: #3c3836;
  --card-bg-color: #504945;
  --card-fg-color: #ebdbb2;
  --accent-bg-color: #b8bb26;
  --window-fg-color: #ebdbb2;
}