Uniform look for Qt and GTK applications

From ArchWiki
(Redirected from Consistent look)
Jump to navigation Jump to search

Qt and GTK based programs both use a different widget toolkit to render the graphical user interface. Each come with different themes, styles and icon sets by default, among other things, so the "look and feel" differ significantly. This article will help you make your Qt and GTK applications look similar for a more streamlined and integrated desktop experience.

Overview

To get a similar look between the toolkits, you will most likely have to modify the following:

  • Theme: The custom appearance of an application, widget set, etc. It usually consists of a style, an icon theme and a color theme.
  • Style: The graphical layout and look of the widget set.
  • Icon Theme: A set of global icons.
  • Color Theme: A set of global colors that are used in conjunction with the style.

You can choose various approaches:

  • Modify GTK and Qt styles separately with the tools listed below for each toolkit and aim for choosing similarly looking themes (style, colors, icons, cursors, fonts).
  • Use a special theme engine, which intermediates the modification of the other graphical toolkit to match your main toolkit.

Styles for both Qt and GTK

There are widget style sets available for the purpose of integration, where builds are written and provided for both Qt and GTK, all major versions included. With these, you can have one look for all applications regardless of the toolkit they had been written with.

Tip: You may want to apply user defined styles to root applications, see GTK#Theme not applied to root applications and Qt#Theme not applied to root applications.
Note: Since version 3.16, GTK 3 does not support non-CSS themes, hence previous solutions such as Oxygen-Gtk are no longer viable options.

Breeze

Breeze is the default Qt style of KDE Plasma. It can be installed with the breeze package for Qt5, the breeze-kde4AUR package for Qt4, and the breeze-gtk package for GTK 2 and GTK 3.

Once installed, you can use one of the many GTK configuration tools to change the GTK theme.

If running KDE Plasma, install kde-gtk-config and either run it from the command line, or go to System Settings > Application Style > Configure GNOME/GTK Application Style…. Fonts, icon themes, cursors, and widget styles set in System Settings affect GTK settings automatically; only the GTK theme should be set manually using the previously mentioned module.

Adwaita

Adwaita is the default GNOME theme. The GTK 3 version is included in the gtk3 package, while the GTK 2 version is in gnome-themes-extra. adwaita-qt is a Qt port of the Adwaita theme. Unlike #QGtkStyle, which mimics the GTK 2 theme, it provides a native Qt style made to look like the GTK 3 Adwaita. It can be installed with the adwaita-qt4AUR and adwaita-qtAUR packages for the Qt 4 and 5 versions, respectively.

To set the Qt style as default:

  • For Qt4, it can be enabled with Qt Configuration (qtconfig-qt4), choose adwaita under Appearance > GUI Style. Alternatively, edit the /etc/xdg/Trolltech.conf (system-wide) or ~/.config/Trolltech.conf (user-specific) file:
~/.config/Trolltech.conf
...
[Qt]
style=adwaita
...

Kvantum

Kvantum (kvantum-qt5) is customizable SVG-based theme engine for Qt5 that comes with a variety of built-in styles, including versions of some of popular GTK themes such as Adapta, Arc, Ambiance, Materia.

Theme engines

A theme engine can be thought of as a thin layer API which translates themes (excluding icons) between one or more toolkits. These engines add some extra code in the process and it is arguable that this kind of a solution is not as elegant and optimal as using native styles.

QGtkStyle

Note: QGtkStyle has been removed from qt5-base 5.7.0 [1] and added to qt5-stylepluginsAUR [2]
Warning: Depending on GTK 2 theme, this style may cause rendering issues such as transparent fonts or inconsistent widgets.

This Qt style uses GTK 2 to render all components to blend in with GNOME and similar GTK based environments. Beginning with Qt 4.5, this style is included in Qt. It requires gtk2 to be installed and configured.

This is the default Qt4 style in Cinnamon, GNOME and Xfce, and the default Qt5 style in Cinnamon, GNOME, MATE, LXDE and Xfce. In other environments:

  • For Qt4, it can be enabled with Qt Configuration (qtconfig-qt4), choose GTK under Appearance > GUI Style. Alternatively, edit the /etc/xdg/Trolltech.conf (system-wide) or ~/.config/Trolltech.conf (user-specific) file:
~/.config/Trolltech.conf
...
[Qt]
style=GTK+
...

For full uniformity, make sure that the configured GTK theme supports both GTK 2 and GTK 3. If your preferred theme has inconsistent rendering after configuring Qt to use GTK2, install gtk-theme-switch2AUR and choose a theme.

QGnomePlatform

This Qt 5 platform theme applies the appearance settings of GNOME for Qt applications. It can be installed with the qgnomeplatformAUR package or the qgnomeplatform-gitAUR package for the development version. It does not provide a Qt style itself, instead it requires a style that support both Qt and GTK.

This platform theme is enabled automatically in GNOME since version 3.20. For other systems, it can be enabled by setting the following environment variable: QT_QPA_PLATFORMTHEME=gnome.

Tips and tricks

Using a GTK icon theme in Qt apps

Tango-edit-clear.pngThis article or section needs language, wiki syntax or style improvements. See Help:Style for reference.Tango-edit-clear.png

If you are running Plasma, install kde-gtk-config and select the icon-theme under System Settings > Application Style > GTK.

If you are using GNOME, first check if dconf-editor is installed.

Then, run dconf-editor and look under org > gnome > desktop > interface for icon-theme key and change it to your preferred icon theme.

If you are not using GNOME, for example if you are running a minimal system with i3-wm, first install dconf-editor.

Then, run dconf-editor and look under org > gnome > desktop > interface for icon-theme key and change it to your preferred icon theme.

Since, you are not using GNOME, you might have to set the value of DESKTOP_SESSION in your profile. To do that execute the below code in a terminal and restart your system.

$ echo 'export DESKTOP_SESSION=gnome' >> /etc/profile

OR

Set export DESKTOP_SESSION=gnome somewhere in your ~/.xinitrc or, if you are using a Display manager in Xprofile.

Note: If the icon theme was not applied, you might want to check if the name that you entered of your preferred theme, was in the correct format. For example, if you want to apply the currently active icon theme to your QT applications, you can find the correct format of it's name with the command:
$ awk -F= '/icon-theme/ {print $2}' ~/.gtkrc-2.0

Add Title bar and frame to GTK3 applications under KDE Plasma

To have Gnome/GTK applications display with a KDE/Plasma title bar and frame, install gtk3-nocsd-gitAUR and restart your window manager to load the updated library path.

You can also run Gtk application with the wrapper:

$ gtk3-nocsd gedit

Improve subpixel rendering of GTK apps under KDE Plasma

See Font configuration#LCD filter.

Consistent file dialog

In order to have the same file dialog, one can use XDG Portals.

Install xdg-desktop-portal and xdg-desktop-portal-kde and set GTK_USE_PORTAL=1 as environment variable.

Troubleshooting

Themes not working in GTK apps

If the style or theme engine you set up is not showing in your GTK applications then it is likely your GTK settings files are not being loaded for some reason. You can check where your system expects to find these files by doing the following..

$ export | grep gtk

Usually the expected files should be ~/.gtkrc for GTK1 and ~/.gtkrc2.0 or ~/.gtkrc2.0-kde for GTK 2.x.

GTK apps don't use svg (breeze) icons after system upgrade

Try to run this to fix this issue:

# gdk-pixbuf-query-loaders --update-cache

Flatpak Qt apps don't use Gnome Adwaita dark theme

If you switched your theme to Adwaita-dark and Flatpak Qt applications still use the light version, install the required KStyle:

# flatpak install flathub org.kde.KStyle.Adwaita

Qt apps run on GNOME Wayland have a non-matching window decoration look, even after setting a Qt theme

In order to have a matching window decoration look, you have to install qgnomeplatformAUR, and set the following environment variable: QT_QPA_PLATFORMTHEME='gnome' This fix is guaranteed to work with Adwaita or Adwaita-dark.

kde-gtk-config "System Settings > Application Style > GTK" menu missing

When kde-gtk-config breaks and the "Application Style > GTK" menu is missing from System Settings, it's possible to choose GTK configuration tools like lxappearance to be able to configure GTK 2 and GTK 3 styles. It is desktop independent even if it comes from the LXDE project (it does not require other parts of the LXDE desktop).