Unreal Stylesheet

A Qt stylesheet designed to make your tools look native in Unreal Engine 5

Quickstart sample code:

import unreal_stylesheet

if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)

    # style your QApp, requires a QApplication instance
    unreal_stylesheet.setup()  # <== Just 1 line of code to make the magic happen

    # create & show your Qt widget
    window = TestWindow()
    window.show()
    sys.exit(app.exec_())                   

Installation

PIP install the latest release from PYPi (recommended):

python -m pip install unreal-stylesheet

or install from the repo:

python -m pip install git+https://github.com/leixingyu/unrealStylesheet

Comparison

The following .ui files for testing can be found inside the /ui folder.

default (editor.ui)	ue.qss

default (tree.ui)	ue.qss

default (progress.ui)	ue.qss

Contribute

Feel free to make a PR or issue if you find a bug, or want to request a feature.
Some guidelines to modify this stylesheet:

Modifying the style sheet

1. Modify the CSS preprocessor .scss file
2. Re-compile the .qss:

qtsass ue.scss -o ue.qss

⚠️ If you modify the .qss style sheet directly, your changes will be lost when the .qss is re-compiled in the future

Documentation about .scss can be found: Sass Official website
You'll also need to install a Qt specific Sass: qt-sass

Modifying icons

The icons are handled with Qt's resource system (see the docs) (which is dropped in qt6)

1. Modify the .qrc file
2. Re-compile the .rcc :

rcc -binary icons.qrc -o icons.rcc

References

• Qt documentation:
  • stylesheets examples
  • stylesheets reference
• Github repo: Qt-Material
• Unreal has a different UI framework (Slate), future read on comparing Qt to Slate
• An example of this stylesheet in action: unrealScriptEditor