Important: Please read the Qt Code of Conduct -

Styling a QTabWidget

  • Hi
    I am trying to style QTabWidget so that the tabs have rounded corners and the background colour of the tab widgets is light blue.
    The stylesheet I am using is -
    QTabWidget QWidget
    background-color: lightblue;
    QTabWidget::pane { /* The tab widget frame */
    border-top: 2px solid #C2C7CB;

    QTabWidget::tab-bar {
    left: 5px; /* move to the right by 5px */

    /* Style the tab using the tab sub-control. Note that
    it reads QTabBar not QTabWidget */
    QTabBar::tab {
    min-height: 24px;
    border-top: 1px solid palette(mid);
    border-left: 1px solid palette(mid);
    border-bottom: 0px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    margin-top: -1px;
    margin-right: 4px;
    padding-left: 5px;
    background: rgb(210, 221, 239);

    QTabBar::tab:selected, QTabBar::tab:hover {
    border-bottom: 1px solid palette(mid);
    background: yellow;

    QTabBar::tab:!selected {
    margin-top: 5px;
    background: qlineargradient(x1:0, y1:0, x2:0, y2:1, stop:0 rgb(156, 181, 220), stop:1 rgb(130, 160, 210));
    This is almost what I need except that the area behind the tab bar is the same color as the tab widget which is undesirable.
    Is there a way of removing this?

Log in to reply