obs-studio/UI/data/themes/System.qss

/* Intentionnally left blank */
/* Themes are created using Qt CSS, you can visit */
/* http://doc.qt.io/qt-5/stylesheet-reference.html and */
/* http://doc.qt.io/qt-5/stylesheet-examples.html for examples. */

/* OBS will use the theme filename for the settings. */
/* You can ship images using relative paths in qss. */
/* Dark Theme is a good place to start if you need */
/* a template. */


/* We need to set back the icons, or the preview wont stick. */

* [themeID="addIconSmall"] {
    qproperty-icon: url(:/res/images/plus.svg);
}

* [themeID="removeIconSmall"] {
    qproperty-icon: url(:/res/images/minus.svg);
}

* [themeID="propertiesIconSmall"] {
    qproperty-icon: url(:/settings/images/settings/general.svg);
}

* [themeID="configIconSmall"] {
    qproperty-icon: url(:/settings/images/settings/general.svg);
}

* [themeID="upArrowIconSmall"] {
    qproperty-icon: url(:/res/images/up.svg);
}

* [themeID="refreshIconSmall"] {
    qproperty-icon: url(:/res/images/refresh.svg);
}

* [themeID="downArrowIconSmall"] {
    qproperty-icon: url(:/res/images/down.svg);
}

* [themeID="pauseIconSmall"] {
    qproperty-icon: url(:/res/images/media-pause.svg);
}

MuteCheckBox {
    outline: none;
}

MuteCheckBox::indicator:checked {
    image: url(:/res/images/mute.svg);
}

MuteCheckBox::indicator:unchecked {
    image: url(:/settings/images/settings/audio.svg);
}

SourceTreeSubItemCheckBox {
    background: transparent;
    outline: none;
}

SourceTreeSubItemCheckBox::indicator {
    width: 10px;
    height: 10px;
}

SourceTreeSubItemCheckBox::indicator:checked {
    image: url(:/res/images/expand.svg);
}

SourceTreeSubItemCheckBox::indicator:unchecked {
    image: url(:/res/images/down.svg);
}

OBSHotkeyLabel[hotkeyPairHover=true] {
    color: red;
}


/* Volume Control */

VolumeMeter {
    qproperty-backgroundNominalColor: rgb(15, 100, 15);
    qproperty-backgroundWarningColor: rgb(100, 100, 15);
    qproperty-backgroundErrorColor: rgb(100, 15, 15);
    qproperty-foregroundNominalColor: rgb(50, 200, 50);
    qproperty-foregroundWarningColor: rgb(255, 200, 50);
    qproperty-foregroundErrorColor: rgb(200, 50, 50);
    qproperty-magnitudeColor: rgb(0, 0, 0);
    qproperty-majorTickColor: rgb(0, 0, 0);
    qproperty-minorTickColor: rgb(50, 50, 50);
    qproperty-meterThickness: 3;

    /* The meter scale numbers normally use your QWidget font, with size    */
    /* multiplied by meterFontScaling to get a proportionally smaller font. */
    /* To use a unique font for the numbers, specify font-family and/or     */
    /* font-size here, and set meterFontScaling to 1.0.                     */
    qproperty-meterFontScaling: 0.7;
}


/* Label warning/error */

QLabel#warningLabel {
    color: rgb(192, 128, 0);
    font-weight: bold;
}

QLabel#errorLabel {
    color: rgb(192, 0, 0);
    font-weight: bold;
}

* [themeID="warning"] {
    color: rgb(192, 128, 0);
    font-weight: bold;
}

* [themeID="error"] {
    color: rgb(192, 0, 0);
    font-weight: bold;
}

* [themeID="good"] {
    color: rgb(0, 128, 0);
    font-weight: bold;
}

/* About dialog */

* [themeID="aboutName"] {
    font-size: 36px;
    font-weight: bold;
}

* [themeID="aboutVersion"] {
    font-size: 16px;
    margin-bottom: 20px;
}

* [themeID="aboutInfo"] {
    margin-bottom: 20px;
}

* [themeID="aboutHLayout"] {
	background-color: #DCD9D7;
}

/* Preview background color */

OBSQTDisplay {
	qproperty-displayBackgroundColor: rgb(76, 76, 76);
}

/* Preview/Program labels */

* [themeID="previewProgramLabels"] {
    font-size: 18px;
    font-weight: bold;
    color: rgb(122,121,122);
}

/* Settings Icons */

OBSBasicSettings {
    qproperty-generalIcon: url(:settings/images/settings/general.svg);
    qproperty-streamIcon: url(:settings/images/settings/stream.svg);
    qproperty-outputIcon: url(:settings/images/settings/output.svg);
    qproperty-audioIcon: url(:settings/images/settings/audio.svg);
    qproperty-videoIcon: url(:settings/images/settings/video.svg);
    qproperty-hotkeysIcon: url(:settings/images/settings/hotkeys.svg);
    qproperty-advancedIcon: url(:settings/images/settings/advanced.svg);
}

OBSBasicSettings QListView::item {
    padding-top: 5px;
    padding-bottom: 5px;
}

/* Locked CheckBox */

LockedCheckBox {
    outline: none;
    background: transparent;
}

LockedCheckBox::indicator:checked {
    image: url(:res/images/locked.svg);
}

LockedCheckBox::indicator:unchecked {
    image: url(:res/images/unlocked.svg);
}

/* Visibility CheckBox */

VisibilityCheckBox {
    outline: none;
    background: transparent;
}

VisibilityCheckBox::indicator:checked {
    image: url(:res/images/visible.svg);
}

VisibilityCheckBox::indicator:unchecked {
    image: url(:res/images/invisible.svg);
}

* [themeID="trashIcon"] {
    qproperty-icon: url(:res/images/trash.svg);
}

* [themeID="revertIcon"] {
    qproperty-icon: url(:res/images/revert.svg);
}

OBSMissingFiles {
	qproperty-warningIcon: url(:res/images/alert.svg);
}

/* Source Icons */

OBSBasic {
    qproperty-imageIcon: url(:res/images/sources/image.svg);
    qproperty-colorIcon: url(:res/images/sources/brush.svg);
    qproperty-slideshowIcon: url(:res/images/sources/slideshow.svg);
    qproperty-audioInputIcon: url(:res/images/sources/microphone.svg);
    qproperty-audioOutputIcon: url(:settings/images/settings/audio.svg);
    qproperty-desktopCapIcon: url(:settings/images/settings/video.svg);
    qproperty-windowCapIcon: url(:res/images/sources/window.svg);
    qproperty-gameCapIcon: url(:res/images/sources/gamepad.svg);
    qproperty-cameraIcon: url(:res/images/sources/camera.svg);
    qproperty-textIcon: url(:res/images/sources/text.svg);
    qproperty-mediaIcon: url(:res/images/sources/media.svg);
    qproperty-browserIcon: url(:res/images/sources/globe.svg);
    qproperty-groupIcon: url(:res/images/sources/group.svg);
    qproperty-sceneIcon: url(:res/images/sources/scene.svg);
    qproperty-defaultIcon: url(:res/images/sources/default.svg);
}

/* Scene Tree */

SceneTree {
    qproperty-gridItemWidth: 150;
	qproperty-gridItemHeight: 24;
}

/* Save icon */

* [themeID="replayIconSmall"] {
    qproperty-icon: url(:res/images/save.svg);
}

/* Studio Mode T-Bar */

QSlider[themeID="tBarSlider"] {
	height: 24px;
}

QSlider::groove:horizontal[themeID="tBarSlider"] {
	border: 1px solid #4c4c4c;
	height: 5px;
	background: #DCD9D7;
}

QSlider::sub-page:horizontal[themeID="tBarSlider"] {
	background: #DCD9D7;
	border: 1px solid #4c4c4c;
}

QSlider::handle:horizontal[themeID="tBarSlider"] {
	background-color: #4c4c4c;
	width: 12px;
	height: 24px;
	margin: -24px 0px;
}

/* Source Context */
#contextContainer QPushButton[themeID2=contextBarButton] {
    padding: 0px;
}

/* Media icons */

* [themeID="playIcon"] {
    qproperty-icon: url(:res/images/media/media_play.svg);
}

* [themeID="pauseIcon"] {
    qproperty-icon: url(:/res/images/media/media_pause.svg);
}

* [themeID="restartIcon"] {
    qproperty-icon: url(:/res/images/media/media_restart.svg);
}

* [themeID="stopIcon"] {
    qproperty-icon: url(:/res/images/media/media_stop.svg);
}

* [themeID="nextIcon"] {
    qproperty-icon: url(:/res/images/media/media_next.svg);
}

* [themeID="previousIcon"] {
    qproperty-icon: url(./Dark/media/media_previous.svg);
}

/* YouTube Integration */
OBSYoutubeActions {
    qproperty-thumbPlaceholder: url(:res/images/sources/image.svg);
}

#ytEventList QLabel {
	background-color: #e1e1e1;
	border: 1px solid #ddd;
}

#ytEventList QLabel:hover {
    background-color: #eee;
	border: 1px solid #777;
}

#ytEventList QLabel[isSelectedEvent=true] {
    background-color: #ccc;
	border: 1px solid #444;
}

/* Calendar Widget */
QCalendarWidget QToolButton {
    padding: 0px 12px;
}

#qt_calendar_monthbutton::menu-indicator {
    image: url(./Dark/down.svg);
    subcontrol-position: right;
    padding-top: 2px;
    padding-right: 2px;
    height: 8px;
    width: 8px;
}

#qt_calendar_monthbutton::menu-indicator:hover {
    image: url(:/res/images/down.svg);
    color: red;
}

QCalendarWidget #qt_calendar_prevmonth {
    padding: 2px;
    qproperty-icon: url(./Dark/left.svg);
    icon-size: 16px, 16px;
}

QCalendarWidget #qt_calendar_nextmonth {
    padding: 2px;
    qproperty-icon: url(./Dark/expand.svg);
    icon-size: 16px, 16px;
}