Skip to main content
  1. Blog/

Classes in Qt Stylesheets (QSS)

·1 min
I’ve used to work with Qt on my previous job, but currently I am not. But I’ve used this hack in a production code, and it was a big time saver.

Qt provides a nice feature to style all Qt Widgets with QSS. Just a simple CSS2 subset used to style all components: labels, buttons, sliders, tables, etc. Here is an example from the official documentation:

QPushButton, QLineEdit, QComboBox {
  color: red;
  background-color: white;
}

This snippet will style all QPushButton, QLineEdit, and QComboBox components on all forms reusing the stylesheet. There is always a way to provide style for an element by its ID:

QPushButton#okButton {
  color: gray;
}

There are many situations when you need to provide styles for a group of objects. For example, you may want to style all warning buttons without any class inheritance. And actually, there is undocumented support for classes with dynamic properties in source code. For example, you may define the warning class

.warning {
  background-color: coral;
}

and set it as a class property to any object to obtain coral background:

btn->setProperty("class", "warning");

You may also use multiple classes by separating them with spaces.

Time to bring Bootstrap to Qt? 😃