Qt Style Sheets Reference

Qt Style Sheets support various properties, pseudo-states, and subcontrols that make it possible to customize the look of widgets.

List of Stylable Widgets

The following table lists the Qt widgets that can be customized using style sheets:

Widget	How to Style
QAbstractScrollArea	Supports the box model. All derivatives of QAbstractScrollArea, including QTextEdit, andQAbstractItemView (all item view classes), support scrollable backgrounds using background-attachment. Setting the background-attachment to fixedprovides a background-image that does not scroll with the viewport. Setting the background-attachment to scroll, scrolls the background-image when the scroll bars move. See Customizing QAbstractScrollArea for an example.
QCheckBox	Supports the box model. The check indicator can be styled using the ::indicatorsubcontrol. By default, the indicator is placed in the Top Left corner of the Contents rectangle of the widget. The spacing property specifies the spacing between the check indicator and the text. See Customizing QCheckBox for an example.
QColumnView	The grip can be styled be using the image property. The arrow indicators can by styled using the ::left-arrow subcontrol and the ::right-arrow subcontrol.
QComboBox	The frame around the combobox can be styled using the box model. The drop-down button can be styled using the ::drop-down subcontrol. By default, the drop-down button is placed in the top right corner of the padding rectangle of the widget. The arrow mark inside the drop-down button can be styled using the ::down-arrowsubcontrol. By default, the arrow is placed in the center of the contents rectangle of the drop-down subcontrol. See Customizing QComboBox for an example.
QDateEdit	See QSpinBox.
QDateTimeEdit	See QSpinBox.
QDialog	Supports only the background, background-clip and background-origin properties. Warning: Make sure you define the Q_OBJECT macro for your custom widget.
QDialogButtonBox	The layout of buttons can be altered using the button-layout property.
QDockWidget	Supports styling of the title bar and the title bar buttons when docked. The dock widget border can be styled using the border property. The::title subcontrol can be used to customize the title bar. The close and float buttons are positioned with respect to the ::title subcontrol using the ::close-button and ::float-button respectively. When the title bar is vertical, the :vertical pseudo class is set. In addition, depending on QDockWidget::DockWidgetFeature, the :closable,:floatable and :movable pseudo states are set. Note: Use QMainWindow::separator to style the resize handle. Warning: The style sheet has no effect when the QDockWidget is undocked as Qt uses native top level windows when undocked. See Customizing QDockWidget for an example.
QDoubleSpinBox	See QSpinBox.
QFrame	Supports the box model. Since 4.3, setting a stylesheet on a QLabel automatically sets the QFrame::frameStyle property to QFrame::StyledPanel. See Customizing QFrame for an example.
QGroupBox	Supports the box model. The title can be styled using the ::title subcontrol. By default, the title is placed depending on QGroupBox::textAlignment. In the case of a checkable QGroupBox, the title includes the check indicator. The indicator is styled using the the ::indicator subcontrol. The spacing property can be used to control the spacing between the text and indicator. See Customizing QGroupBox for an example.
QHeaderView	Supports the box model. The sections of the header view are styled using the::section sub control. The section Sub-control supports the :middle, :first,:last, :only-one, :next-selected, :previous-selected, :selected, and:checked pseudo states. Sort indicator in can be styled using the ::up-arrow and the ::down-arrowSub-control. See Customizing QHeaderView for an example.
QLabel	Supports the box model. Does not support the :hover pseudo-state. Since 4.3, setting a stylesheet on a QLabel automatically sets the QFrame::frameStyle property to QFrame::StyledPanel. See Customizing QFrame for an example (a QLabel derives from QFrame).
QLineEdit	Support the box model. The color and background of the selected item is styled using selection-color and selection-background-color respectively. The password character can be styled using the lineedit-password-characterproperty. See Customizing QLineEdit for an example.
QListView	Supports the box model. When alternating row colors is enabled, the alternating colors can be styled using the alternate-background-color property. The color and background of the selected item is styled using selection-color and selection-background-color respectively. The selection behavior is controlled by the show-decoration-selectedproperty. Use the ::item subcontrol for more fine grained control over the items in the QListView. See QAbsractScrollArea to style scrollable backgrounds. See Customzing QListView for an example.
QListWidget	See QListView.
QMainWindow	Supports styling of the separator The separator in a QMainWindow when using QDockWidget is styled using the::separator subcontrol. See Customizing QMainWindow for an example.
QMenu	Supports the box model. Individual items are styled using the ::item subcontrol. In addition to the usually supported pseudo states, item subcontrol supports the:selected, :default, :exclusive and the non-exclusive pseudo states. The indicator of checkable menu items is styled using the ::indicatorsubcontrol. The separator is styled using the ::separator subcontrol. For items with a sub menu, the arrow marks are styled using the right-arrow and left-arrow. The scroller is styled using the ::scroller. The tear-off is styled using the ::tearoff. See Customizing QMenu for an example.
QMenuBar	Supports the box model. The spacing property specifies the spacing between menu items. Individual items are styled using the ::item subcontrol. Warning: When running on Qt/Mac, the menu bar is usually embedded into the system-wide menu bar. In this case, the style sheet will have no effect. See Customizing QMenuBar for an example.
QMessageBox	The messagebox-text-interaction-flags property can be used to alter the interaction with text in the message box.
QProgressBar	Supports the box model. The chunks of the progress bar can be styled using the::chunk subcontrol. The chunk is displayed on the Contents rectangle of the widget. If the progress bar displays text, use the text-align property to position the text. Indeterminate progress bars have the :indeterminate pseudo state set. See Customizing QProgressBar for an example.
QPushButton	Supports the box model. Supports the :default, :flat, :checked pseudo states. For QPushButton with a menu, the menu indicator is styled using the::menu-indicator subcontrol. Appearance of checkable push buttons can be customized using the :open and :closed pseudo-states. Warning: If you only set a background-color on a QPushButton, the background may not appear unless you set the border property to some value. This is because, by default, the QPushButton draws a native border which completely overlaps the background-color. For example, QPushButton { border: none; } See Customizing QPushButton for an example.
QRadioButton	Supports the box model. The check indicator can be styled using the ::indicatorsubcontrol. By default, the indicator is placed in the Top Left corner of the Contents rectangle of the widget. The spacing property specifies the spacing between the check indicator and the text. See Customizing QRadioButton for an example.
QScrollBar	Supports the box model. The Contents rectangle of the widget is considered to be the groove over which the slider moves. The extent of the QScrollBar (i.e the width or the height depending on the orientation) is set using the width or height property respectively. To determine the orientation, use the :horizontal and the :verticalpseudo states. The slider can be styled using the ::handle subcontrol. Setting the min-width or min-height provides size contraints for the slider depending on the orientation. The ::add-line subcontrol can be used to style the button to add a line. By default, the add-line subcontrol is placed in top right corner of the Border rectangle of the widget. Depending on the orientation the ::right-arrow or ::down-arrow. By default, the arrows are placed in the center of the Contents rectangle of the add-line subcontrol. The ::sub-line subcontrol can be used to style the button to subtract a line. By default, the sub-line subcontrol is placed in bottom right corner of the Border rectangle of the widget. Depending on the orientation the::left-arrow or ::up-arrow. By default, the arrows are placed in the center of the Contents rectangle of the sub-line subcontrol. The ::sub-page subcontrol can be used to style the region of the slider that subtracts a page. The ::add-page subcontrol can be used to style the region of the slider that adds a page. See Customizing QScrollBar for an example.
QSizeGrip	Supports the width, height, and image properties. See Customizing QSizeGrip for an example.
QSlider	Supports the box model. For horizontal slides, the min-width and height properties must be provided. For vertical sliders, the min-height and width properties must be provided. The groove of the slider is styled using the ::groove. The groove is positioned by default in the Contents rectangle of the widget. The thumb of the slider is styled using ::handle subcontrol. The subcontrol moves in the Contents rectangle of the groove subcontrol. See Customizing QSlider for an example.
QSpinBox	The frame of the spin box can be styled using the box model. The up button and arrow can be styled using the ::up-button and ::up-arrowsubcontrols. By default, the up-button is placed in the top right corner in the Padding rectangle of the widget. Without an explicit size, it occupies half the height of its reference rectangle. The up-arrow is placed in the center of the Contents rectangle of the up-button. The down button and arrow can be styled using the ::down-button and::down-arrow subcontrols. By default, the down-button is placed in the bottom right corner in the Padding rectangle of the widget. Without an explicit size, it occupies half the height of its reference rectangle. The bottom-arrow is placed in the center of the Contents rectangle of the bottom-button. See Customizing QSpinBox for an example.
QSplitter	Supports the box model. The handle of the splitter is styled using the ::handlesubcontrol. See Customizing QSplitter for an example.
QStatusBar	Supports only the background property. The frame for individual items can be style using the ::item subcontrol. See Customizing QStatusBar for an example.
QTabBar	Individual tabs may be styled using the ::tab subcontrol. Close buttons using the::close-button The tabs support the :only-one, :first, :last, :middle,:previous--selected, :next-selected, :selected pseudo states. The :top, :left, :right, :bottom pseudo states depending on the orientation of the tabs. Overlapping tabs for the selected state are created by using negative margins or using the absolute position scheme. The tear indicator of the QTabBar is styled using the ::tear subcontrol. QTabBar used two QToolButtons for its scrollers that can be styled using the QTabBar QToolButton selector. To specify the width of the scroll button use the ::scroller subcontrol. The alignment of the tabs within the QTabBar is styled using the alignmentproperty. Warning: To change the position of the QTabBar within a QTabWidget, use the tab-barsubcontrol (and set subcontrol-position). See Customizing QTabBar for an example.
QTabWidget	The frame of the tab widget is styled using the ::pane subcontrol. The left and right corners are styled using the ::left-corner and ::right-corner respectively. The position of the tab bar is controlled using the ::tab-bar subcontrol. By default, the subcontrols have positions of a QTabWidget in theQWindowsStyle. To place the QTabBar in the center, set the subcontrol-position of the tab-bar subcontrol. The :top, :left, :right, :bottom pseudo states depending on the orientation of the tabs. See Customizing QTabWidget for an example.
QTableView	Supports the box model. When alternating row colors is enabled, the alternating colors can be styled using the alternate-background-color property. The color and background of the selected item is styled using selection-color and selection-background-color respectively. The corner widget in a QTableView is implemented as a QAbstractButton and can be styled using the "QTableView QTableCornerButton::section" selector. Warning: If you only set a background-color on a QTableCornerButton, the background may not appear unless you set the border property to some value. This is because, by default, the QTableCornerButton draws a native border which completely overlaps the background-color. The color of the grid can be specified using the gridline-color property. See QAbsractScrollArea to style scrollable backgrounds. See Customzing QTableView for an example.
QTableWidget	See QTableView.
QTextEdit	Supports the box model. The color and background of selected text is styled using selection-colorand selection-background-color respectively. See QAbsractScrollArea to style scrollable backgrounds.
QTimeEdit	See QSpinBox.
QToolBar	Supports the box model. The :top, :left, :right, :bottom pseudo states depending on the area in which the tool bar is grouped. The :first, :last, :middle, :only-one pseudo states indicator the position of the tool bar within a line group (SeeQStyleOptionToolBar::positionWithinLine). The separator of a QToolBar is styled using the ::separator subcontrol. The handle (to move the toolbar) is styled using the ::handle subcontrol. See Customizing QToolBar for an example.
QToolButton	Supports the box model. If the QToolButton has a menu, is ::menu-indicator subcontrol can be used to style the indicator. By default, the menu-indicator is positioned at the bottom right of the Padding rectangle of the widget. If the QToolButton is in QToolButton::MenuButtonPopup mode, the ::menu-button subcontrol is used to draw the menu button. ::menu-arrow subcontrol is used to draw the menu arrow inside the menu-button. By default, it is positioned in the center of the Contents rectangle of the menu-button subcontrol. When the QToolButton displays arrows, the ::up-arrow, ::down-arrow,::left-arrow and ::right-arrow subcontrols are used. Warning: If you only set a background-color on a QToolButton, the background will not appear unless you set the border property to some value. This is because, by default, the QToolButton draws a native border which completely overlaps the background-color. For example, QToolButton { background-color: red; border: none; } See Customizing QToolButton for an example.
QToolBox	Supports the box model. The individual tabs can by styled using the ::tab subcontrol. The tabs support the :only-one, :first, :last, :middle, :previous-selected, :next-selected, :selected pseudo states.
QToolTip	Supports the box model. The opacity property controls the opacity of the tooltip. See Customizing QFrame for an example (a QToolTip is a QFrame).
QTreeView	Supports the box model. When alternating row colors is enabled, the alternating colors can be styled using the alternate-background-color property. The color and background of the selected item is styled using selection-color and selection-background-color respectively. The selection behavior is controlled by the show-decoration-selectedproperty. The branches of the tree view can be styled using the ::branch subcontrol. The ::branch Sub-control supports the :open, :closed, :has-sibling and:has-children pseudo states. Use the ::item subcontrol for more fine grained control over the items in the QTreeView. See QAbsractScrollArea to style scrollable backgrounds. See Customizing QTreeView for an example to style the branches.
QTreeWidget	See QTreeView.
QWidget	Supports only the background, background-clip and background-origin properties. If you subclass from QWidget, you need to provide a paintEvent for your custom QWidget as below: void CustomWidget::paintEvent(QPaintEvent *) { QStyleOption opt; opt.init(this); QPainter p(this); style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this); } The above code is a no-operation if there is no stylesheet set. Warning: Make sure you define the Q_OBJECT macro for your custom widget.