Struggling to configure GTk/QT theme on laptop

Help
4

This was literally me a few days ago, except I went full catppuccin :cat:

I’m running Gnome under Wayland, so I’m not sure how well this applies to Sway, but I hope this helps you in the right direction. Also, if there is a better way to do this then I hope someone corrects me.

PS: This is all done using home-manager, so you only need to edit your home.nix.

With Breeze :leaves:

First add the required packages, the rest will be specified later within options:

  home.packages = with pkgs; [
    papirus-folders
  ];

GTK

This sets the GTK interface, icon and cursor. I was using just gtk.cursorTheme for mine, but I noticed that some apps (like steam) didn’t respect it. Thankfully, the solution posted by @nex solved that for me :smiley: Now I have them both set just up in case.

  gtk = {
    enable = true;
    theme = {
      name = "Breeze-Dark";
      package = pkgs.libsForQt5.breeze-gtk;
    };
    iconTheme = {
      name = "Papirus-Dark";
      package = pkgs.catppuccin-papirus-folders.override {
        flavor = "mocha";
        accent = "lavender";
      };
    };
    cursorTheme = {
      name = "Catppuccin-Mocha-Light-Cursors";
      package = pkgs.catppuccin-cursors.mochaLight;
    };
    gtk3 = {
      extraConfig.gtk-application-prefer-dark-theme = true;
    };
  };

  home.pointerCursor = {
    gtk.enable = true;
    name = "Catppuccin-Mocha-Light-Cursors";
    package = pkgs.catppuccin-cursors.mochaLight;
    size = 16;
  };

  dconf.settings = {
    "org/gnome/desktop/interface" = {
      gtk-theme = "Breeze-Dark";
      color-scheme = "prefer-dark";
    };
  };

By the way, I’m noticing that you’re setting Breeze-Dark in gtk.theme, but you’re enabling Breeze in dconf.settings. Shouldn’t that also be the Breeze-Dark ?

QT

There is no problem with the Breeze light theme, but I spent a lot of time searching and experimenting and the only way I found to set Breeze-Dark for QT is to make it follow the gtk theme:

  qt = {
    enable = true;
    platformTheme = "gtk";
    style = {
      name = "gtk2";
      package = pkgs.libsForQt5.breeze-qt5;
    };
  };

The icon theme for QT apps should also automatically be set to the one from gtk.iconTheme.

Full Catppuccin :cat:

Edit: Check out catppuccin-nix. You can already use it to set catppuccin for gtk (and other apps) and I’m sure it’s gonna grow more in the future.

I just want to share my current catppuccin config in case you or anyone else wants to try it.

First add the required packages, the rest will be specified later within options:

  home.packages = with pkgs; [
    (catppuccin-kvantum.override {
      accent = "Blue";
      variant = "Macchiato";
    })
    libsForQt5.qtstyleplugin-kvantum
    libsForQt5.qt5ct
    papirus-folders
  ];

GTK

  gtk = {
    enable = true;
    theme = {
      name = "Catppuccin-Macchiato-Standard-Blue-Dark";
      package = pkgs.catppuccin-gtk.override {
        accents = [ "blue" ];
        size = "standard";
        variant = "macchiato";
      };
    };
    iconTheme = {
      name = "Papirus-Dark";
      package = pkgs.catppuccin-papirus-folders.override {
        flavor = "macchiato";
        accent = "blue";
      };
    };
    cursorTheme = {
      name = "Catppuccin-Macchiato-Dark-Cursors";
      package = pkgs.catppuccin-cursors.macchiatoDark;
    };
    gtk3 = {
      extraConfig.gtk-application-prefer-dark-theme = true;
    };
  };

  home.pointerCursor = {
    gtk.enable = true;
    name = "Catppuccin-Macchiato-Dark-Cursors";
    package = pkgs.catppuccin-cursors.macchiatoDark;
    size = 16;
  };

  dconf.settings = {
    "org/gnome/desktop/interface" = {
      gtk-theme = "Catppuccin-Macchiato-Standard-Blue-Dark";
      color-scheme = "prefer-dark";
    };

    # For Gnome shell
    "org/gnome/shell/extensions/user-theme" = {
      name = "Catppuccin-Macchiato-Standard-Blue-Dark";
    };
  };

QT

  qt = {
    enable = true;
    platformTheme = "qtct";
    style.name = "kvantum";
  };

  xdg.configFile."Kvantum/kvantum.kvconfig".source = (pkgs.formats.ini { }).generate "kvantum.kvconfig" {
    General.theme = "Catppuccin-Macchiato-Blue";
  };

Finally, you need to choose the icon theme for QT apps. Open qt5ct, then click Icon Theme > Papirus-Dark > Apply. If you use QT6 apps then you need to the the same in qt6ct (make sure the theme is kvantum there).

Hopefully this has been helpful. Happy nixing :snowflake:

3 Likes