Skip to content

Instantly share code, notes, and snippets.

@QuantumCD

QuantumCD/Qt 5 Dark Fusion Palette

Created August 15, 2013 21:40
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save QuantumCD/6245215 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save QuantumCD/6245215 to your computer and use it in GitHub Desktop.
Download ZIP
This is a complete (I think) dark color palette for the Qt 5 Fusion theme, as well as a nice style sheet for the tool tips that make them blend better with the rest of the theme. To have immediate effect, be sure to put this in your main function before showing the parent window. Child windows should automatically inherit the palette unless you …
Raw
Qt 5 Dark Fusion Palette
qApp->setStyle(QStyleFactory::create("Fusion"));
QPalette darkPalette;
darkPalette.setColor(QPalette::Window, QColor(53,53,53));
darkPalette.setColor(QPalette::WindowText, Qt::white);
darkPalette.setColor(QPalette::Base, QColor(25,25,25));
darkPalette.setColor(QPalette::AlternateBase, QColor(53,53,53));
darkPalette.setColor(QPalette::ToolTipBase, Qt::white);
darkPalette.setColor(QPalette::ToolTipText, Qt::white);
darkPalette.setColor(QPalette::Text, Qt::white);
darkPalette.setColor(QPalette::Button, QColor(53,53,53));
darkPalette.setColor(QPalette::ButtonText, Qt::white);
darkPalette.setColor(QPalette::BrightText, Qt::red);
darkPalette.setColor(QPalette::Link, QColor(42, 130, 218));
darkPalette.setColor(QPalette::Highlight, QColor(42, 130, 218));
darkPalette.setColor(QPalette::HighlightedText, Qt::black);
qApp->setPalette(darkPalette);
qApp->setStyleSheet("QToolTip { color: #ffffff; background-color: #2a82da; border: 1px solid white; }");
@dridk
Copy link
Copy Markdown

dridk commented Jun 14, 2014

Screenshot please!

Copy link
Copy Markdown

ghost commented Oct 5, 2014

Imgur

@solarkraft
Copy link
Copy Markdown

solarkraft commented Oct 11, 2014

Looks great!

@SebastienBloesch
Copy link
Copy Markdown

SebastienBloesch commented Feb 22, 2015

Thank you

@oaeide
Copy link
Copy Markdown

oaeide commented Feb 28, 2015

Wow! This is great stuff. The only thing that isn't perfect out of the box is that deactivated buttons look the same as clickable ones. Otherwise - love it.

@lschmierer
Copy link
Copy Markdown

lschmierer commented Apr 16, 2015

For PyQt5
https://gist.github.com/lschmierer/443b8e21ad93e2a2d7eb

Copy link
Copy Markdown

ghost commented Apr 23, 2015

beautiful :))

@obiwankennedy
Copy link
Copy Markdown

obiwankennedy commented Dec 4, 2015 

darkPalette.setColor(QPalette::ToolTipBase, Qt::white);
darkPalette.setColor(QPalette::ToolTipText, Qt::white);

Why do you set both as white and then add qApp->setStyleSheet("QToolTip { color: #ffffff; background-color: #2a82da; border: 1px solid white; }"); ?

@macdew
Copy link
Copy Markdown

macdew commented Apr 27, 2017

Very cool! One thing I spotted was that tab control are a bit black-on-black... Would be nice if the tabs themselves could be shaded a bit differently.

@Jorgen-VikingGod
Copy link
Copy Markdown

Jorgen-VikingGod commented Aug 11, 2017

In my repo you can find similar palette and addition some stylesheets to make everything look dark, sexy and great 😃
https://github.com/Jorgen-VikingGod/Qt-Frameless-Window-DarkStyle

@Bux42
Copy link
Copy Markdown

Bux42 commented Jun 6, 2018

This is exactly what I was looking for and it's hella easy to implement, thanks!

@CSaratakij
Copy link
Copy Markdown

CSaratakij commented Sep 5, 2018

Look great~
Thank you ;)

@ofbeaton
Copy link
Copy Markdown

ofbeaton commented Nov 28, 2018

This one doesn't handle disabled text (everything will appear enabled). Jorgen-VikingGod's appears to handle disabled controls properly.

@funlw65
Copy link
Copy Markdown

funlw65 commented Dec 31, 2018

Yeah, but this is a color palette, and the one you refer is a "skin".
So, people that look for a color palette, needs to add colors for disabled controls and text.

@matejk
Copy link
Copy Markdown

matejk commented Jun 18, 2019

How can one add palette for disabled controls to qtquickcontrols2.conf? Or is this done in some other way?

@mherrmann
Copy link
Copy Markdown

mherrmann commented Jul 2, 2019

Nice! I use this for my Qt dark theme example of a text editor.

image

@eduardathome
Copy link
Copy Markdown

eduardathome commented Oct 18, 2019

Hi, ok, quick question... I got the dark theme working and all but I got this annoying white border, like 1-2px wide. Currently I'm looking at Jorgen-VikingGod's example trying to figure out exactly what is the property that disables that border but maybe someone can enlighten me. Thanks !

@leplatrem
Copy link
Copy Markdown

leplatrem commented Mar 18, 2020 •
edited
Loading

I had to fix appearance of disabled widgets:

    QColor darkGray(53, 53, 53);
    QColor gray(128, 128, 128);
    QColor black(25, 25, 25);
    QColor blue(42, 130, 218);

    QPalette darkPalette;
    darkPalette.setColor(QPalette::Window, darkGray);
    darkPalette.setColor(QPalette::WindowText, Qt::white);
    darkPalette.setColor(QPalette::Base, black);
    darkPalette.setColor(QPalette::AlternateBase, darkGray);
    darkPalette.setColor(QPalette::ToolTipBase, blue);
    darkPalette.setColor(QPalette::ToolTipText, Qt::white);
    darkPalette.setColor(QPalette::Text, Qt::white);
    darkPalette.setColor(QPalette::Button, darkGray);
    darkPalette.setColor(QPalette::ButtonText, Qt::white);
    darkPalette.setColor(QPalette::Link, blue);
    darkPalette.setColor(QPalette::Highlight, blue);
    darkPalette.setColor(QPalette::HighlightedText, Qt::black);

    darkPalette.setColor(QPalette::Active, QPalette::Button, gray.darker());
    darkPalette.setColor(QPalette::Disabled, QPalette::ButtonText, gray);
    darkPalette.setColor(QPalette::Disabled, QPalette::WindowText, gray);
    darkPalette.setColor(QPalette::Disabled, QPalette::Text, gray);
    darkPalette.setColor(QPalette::Disabled, QPalette::Light, darkGray);

@palucki
Copy link
Copy Markdown

palucki commented Apr 5, 2020

Thanks @leplatrem, @QuantumCD

I've used the style in my steganography app.
All the best to you guys!

@ZENALC
Copy link
Copy Markdown

ZENALC commented Feb 4, 2021

I had to fix appearance of disabled widgets:

    QColor darkGray(53, 53, 53);
    QColor gray(128, 128, 128);
    QColor black(25, 25, 25);
    QColor blue(42, 130, 218);

    QPalette darkPalette;
    darkPalette.setColor(QPalette::Window, darkGray);
    darkPalette.setColor(QPalette::WindowText, Qt::white);
    darkPalette.setColor(QPalette::Base, black);
    darkPalette.setColor(QPalette::AlternateBase, darkGray);
    darkPalette.setColor(QPalette::ToolTipBase, blue);
    darkPalette.setColor(QPalette::ToolTipText, Qt::white);
    darkPalette.setColor(QPalette::Text, Qt::white);
    darkPalette.setColor(QPalette::Button, darkGray);
    darkPalette.setColor(QPalette::ButtonText, Qt::white);
    darkPalette.setColor(QPalette::Link, blue);
    darkPalette.setColor(QPalette::Highlight, blue);
    darkPalette.setColor(QPalette::HighlightedText, Qt::black);

    darkPalette.setColor(QPalette::Active, QPalette::Button, gray.darker());
    darkPalette.setColor(QPalette::Disabled, QPalette::ButtonText, gray);
    darkPalette.setColor(QPalette::Disabled, QPalette::WindowText, gray);
    darkPalette.setColor(QPalette::Disabled, QPalette::Text, gray);
    darkPalette.setColor(QPalette::Disabled, QPalette::Light, darkGray);

Awesome thank you! For Python, use this:

palette.setColor(QPalette.Disabled, QPalette.Button, QColor(35, 35, 35))

@J-Kappes
Copy link
Copy Markdown

J-Kappes commented May 30, 2022 •
edited
Loading

When I had floating docks using this I got white lines on the left edge.
Setting QPallete::Light to the same color as QPalette::Window fixed it.

darkPalette.setColor(QPalette::Light,QColor(53, 53, 53));

@elyte5star
Copy link
Copy Markdown

elyte5star commented May 4, 2025

`app.setStyle(QStyleFactory.create("Fusion"))

palette = QPalette()
palette.setColor(QPalette.ColorRole.Window, QColor(53, 53, 53))
palette.setColor(QPalette.ColorRole.WindowText, QColor(Qt.GlobalColor.white))
palette.setColor(
    QPalette.ColorGroup.Disabled,
    QPalette.ColorRole.WindowText,
    QColor(127, 127, 127),
)
palette.setColor(QPalette.ColorRole.Base, QColor(25, 25, 25))
palette.setColor(QPalette.ColorRole.AlternateBase, QColor(53, 53, 53))
palette.setColor(QPalette.ColorRole.ToolTipBase, QColor(Qt.GlobalColor.white))
palette.setColor(QPalette.ColorRole.ToolTipText, QColor(Qt.GlobalColor.white))
palette.setColor(QPalette.ColorRole.Text, QColor(Qt.GlobalColor.white))
palette.setColor(
    QPalette.ColorGroup.Disabled,
    QPalette.ColorRole.Text,
    QColor(127, 127, 127),
)
palette.setColor(QPalette.ColorRole.Text, QColor(Qt.GlobalColor.white))
palette.setColor(QPalette.ColorRole.Dark, QColor(35, 35, 35, 35))
palette.setColor(QPalette.ColorRole.Shadow, QColor(20, 20, 20, 20))
palette.setColor(QPalette.ColorRole.Button, QColor(53, 53, 53))
palette.setColor(QPalette.ColorRole.ButtonText, QColor(Qt.GlobalColor.white))
palette.setColor(QPalette.ColorRole.BrightText, QColor(Qt.GlobalColor.red))
palette.setColor(
    QPalette.ColorGroup.Disabled,
    QPalette.ColorRole.ButtonText,
    QColor(127, 127, 127),
)
palette.setColor(QPalette.ColorRole.Link, QColor(42, 130, 218))
palette.setColor(QPalette.ColorRole.Highlight, QColor(42, 130, 218))
palette.setColor(
    QPalette.ColorGroup.Disabled,
    QPalette.ColorRole.Highlight,
    QColor(80, 80, 80),
)
palette.setColor(QPalette.ColorRole.HighlightedText, QColor(Qt.GlobalColor.white))
palette.setColor(
    QPalette.ColorGroup.Disabled,
    QPalette.ColorRole.Highlight,
    QColor(127, 127, 127),
)
palette.setColor(QPalette.ColorRole.PlaceholderText, QColor(Qt.GlobalColor.white))
app.setPalette(palette)`

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment