/* OBSTheme, main QApplication palette and QML values */ OBSTheme { window: #181819; windowText: rgb(225,224,225); base: rgb(18,18,21); alternateBase: rgb(0,0,0); text: rgb(225,224,225); button: #162458; buttonText: rgb(225,224,225); brightText: #484848; light: #162458; mid: #181819; dark: rgb(18,18,21); shadow: rgb(0,0,0); highlight: #252458; highlightText: #FFFFFF; link: #605ee6; linkVisited: #605ee6; } OBSTheme::disabled { text: #484848; buttonText: #484848; brightText: #484848; } OBSTheme::inactive { highlight: rgb(48,47,48); highlightText: rgb(255, 255, 255); } /* General style, we override only what is needed. */ QWidget { background-color: #181819; alternate-background-color: rgb(18,18,21); color: rgb(225,224,225); selection-background-color: #252458; selection-color: white; outline: none; font-family: "Open Sans", "Tahoma", "Arial", sans-serif; font-size: 12px; } #menubar { padding: 2px 8px 0px; } QLabel:link { color: #2a3a75; } QMenu { border: 1px solid #333336; padding: 4px; } * [frameShape="1"], * [frameShape="2"], * [frameShape="3"], * [frameShape="4"], * [frameShape="5"], * [frameShape="6"] { /*border: 1px solid rgb(231,30,31); */ border: none; } * [frameShape="2"], * [frameShape="4"] { border: 1px solid #333336; } QSizeGrip { background-color: transparent; image: url(./Acri/sizegrip.png); } /* Misc */ QWidget::disabled { color: #484848; } * [themeID="error"] { color: #d91740; } * [themeID="warning"] { color: #d9af17; } /* Dropdown menus, Scenes box, Sources box */ QAbstractItemView { background-color: #181819; border: 1px solid #333336; } /* Group Box */ QGroupBox { border: 2px solid #2f2f2f; margin-bottom: 8px; padding-top: 32px; font-weight: bold; font-size: 14px; } QGroupBox::title { left: 4px; right: 0; top: 8px; font-weight: bold; padding-left: 8px; padding-right: 8px; padding-bottom: 8px; font-size: 16px; } /* --- */ /* Tooltips */ QToolTip { background-color: #212121; color: rgb(205,205,205); border: 1px solid #343335; border-radius: 4px; } /* Top Menu Bar Items */ QMenuBar::item { background-color: rgb(24,24,25); padding: 6px; } QMenuBar::item:selected { background: #2a3a75; } /* Listbox item */ QListWidget::item, SourceTree::item { padding: 4px 2px; margin-bottom: 2px; margin-top: 0px; border: 1px solid transparent; } QListWidget QLineEdit { padding-top: 0px; padding-bottom: 0px; padding-right: 0; padding-left: 2px; border: none; border-radius: none; } /* Dock stuff */ QDockWidget { background: #181819; border: none; font-size: 14px; font-weight: bold; border-bottom: 2px solid #2f2f2f; } QDockWidget::title { border-bottom: 2px solid #2f2f2f; margin-left: 5px; margin-right: 5px; padding-top: 0px; padding-bottom: 6px; text-align: left; background-image: url(./Acri/top_hook.png); background-origin: padding; background-clip: padding; background-position: bottom left; background-repeat: none; } QDockWidget::close-button, QDockWidget::float-button { icon-size: 20px; subcontrol-position: top right; subcontrol-origin: padding; right: 0px; } QDockWidget::float-button { right: 20px; } QListWidget#scenes, SourceListWidget { border: none; border-bottom: 2px solid #2f2f2f; } SourceTree { border: none; border-bottom: 1px solid #2f2f2f; } SourceTree QLineEdit { background-color: #0c101e; padding: 2px; margin: -2px 6px -2px 3px; font-size: 12px; } #scenesFrame, #sourcesFrame { margin-left: -7px; margin-right: -7px; margin-top: -8px; margin-bottom: -12px; } #scenesToolbar, #sourcesToolbar{ background-image: url(./Acri/bot_hook2.png); background-origin: margin; background-clip: margin; background-position: top left; background-repeat: none; } #sourcesToolbar { background-image: url(./Acri/bot_hook.png); } /* Listbox item selected, unfocused */ QListWidget::item:hover, SourceTree::item:hover { background-color: #212121; border: 1px solid #333336; } /* Listbox item selected */ QListWidget::item:selected, SourceTree::item:selected { background-color: #131a30; border: 1px solid #252a45; } /* ScrollBars */ QScrollBar::corner { background-color: transparent; border: none; } QScrollBar:vertical { background-color: transparent; width: 20px; margin-top: -3px; margin-bottom: -3px; padding: 4px; } QScrollBar::handle:vertical { background-color: #2f2f2f; min-height: 20px; margin: 0px 3px; border-radius: 0px; border: none; } QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical { border: none; background: none; height: 0; } QScrollBar::up-arrow:vertical, QScrollBar::down-arrow:vertical, QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical { border: none; background: none; color: none; } QScrollBar:horizontal { background-color: transparent; height: 20px; margin-left: -3px; margin-right: -3px; padding: 4px; } QScrollBar::handle:horizontal { background-color: #2f2f2f; min-width: 20px; margin: 3px 0px; border-radius: 0px; border: none; } QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal { border: none; background: none; width: 0; } QScrollBar::left-arrow:horizontal, QScrollBar::right-arrow:horizontal, QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal { border: none; background: none; color: none; } /* Scenes and Sources toolbar */ QToolBar { background-color: rgb(24,24,25); margin-top: 4px; } QToolButton:hover { background-color: #2a3a75; border: 1px solid #233166; border-radius: none; } QToolButton:pressed { background-color: #161f41; border-radius: none; } * [themeID="addIconSmall"] { qproperty-icon: url(./Dark/plus.svg); } * [themeID="removeIconSmall"] { qproperty-icon: url(./Dark/minus.svg); } * [themeID="propertiesIconSmall"] { qproperty-icon: url(./Dark/settings/general.svg); } * [themeID="configIconSmall"] { qproperty-icon: url(./Dark/settings/general.svg); } * [themeID="upArrowIconSmall"] { qproperty-icon: url(./Dark/up.svg); } * [themeID="downArrowIconSmall"] { qproperty-icon: url(./Dark/down.svg); } * [themeID="pauseIconSmall"] { qproperty-icon: url(./Dark/media-pause.svg); } /* Tab Widget */ QTabWidget::pane { /* The tab widget frame */ border-top: 1px solid #2f2f2f; } QTabWidget::tab-bar { alignment: left; } QTabBar::tab { background-color: #212121; border: 1px solid #333336; min-width: 8ex; padding-top: 4px; padding-bottom: 4px; padding-left: 10px; padding-right: 10px; margin-right: 2px; margin-top: 1px; margin-bottom: 1px; } QTabBar::tab:selected { background-color: #131a30; border-color: #252a45; } QTabBar::tab:hover { background-color: #233166; border-color: #364683; } QTabBar::tab:pressed { background-color: #161f41; } /* ComboBox */ QComboBox { background-color: rgb(40,40,42); border-style: solid; border: 1px; border-color: rgb(24,24,30); padding: 4px; padding-left: 10px; } QComboBox::drop-down { border:none; border-left: 1px solid rgba(31,30,31,155); width: 20px; } QComboBox::down-arrow { qproperty-alignment: AlignTop; image: url(./Dark/updown.svg); width: 100%; } QComboBox:on { background-color: #2a3a75; } QComboBox:editable { border-top-left-radius: 0px; border-bottom-left-radius: 0px; } QComboBox::drop-down:editable { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } QComboBox::down-arrow:editable { qproperty-alignment: AlignTop; image: url(./Dark/down.svg); width: 8%; } /* Textedits etc */ QLineEdit, QTextEdit, QPlainTextEdit { background-color: rgb(8,8,11); border: none; padding: 4px; padding-left: 2px; } /* Spinbox and doubleSpinbox */ QSpinBox, QDoubleSpinBox { background-color: rgb(8,8,11); border: none; padding: 4px; padding-left: 2px; padding-right: 15px; margin-right: 10px; } QSpinBox::up-button, QDoubleSpinBox::up-button { subcontrol-origin: margin; subcontrol-position: top right; /* position at the top right corner */ background-color: rgb(24,24,30); border: 1px solid rgb(8,8,11); border-radius: 3px; border-width: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; border-bottom-width: 0; } QSpinBox::down-button, QDoubleSpinBox::down-button { subcontrol-origin: margin; subcontrol-position: bottom right; /* position at the top right corner */ background-color: rgb(24,24,30); border: 1px solid rgb(8,8,11); border-radius: 3px; border-width: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-top-width: 0; } QSpinBox::up-button:hover, QSpinBox::down-button:hover, QDoubleSpinBox::up-button:hover, QDoubleSpinBox::down-button:hover { background-color: rgb(15,33,51); } QSpinBox::up-button:pressed, QSpinBox::down-button:pressed, QDoubleSpinBox::up-button:pressed, QDoubleSpinBox::down-button:pressed { background-color: rgb(24,24,25); } QSpinBox::up-button:disabled, QSpinBox::up-button:off, QSpinBox::down-button:disabled, QSpinBox::down-button:off { background-color: rgb(24,24,25); } QDoubleSpinBox::up-button:disabled, QDoubleSpinBox::up-button:off, QDoubleSpinBox::down-button:disabled, QDoubleSpinBox::down-button:off { background-color: rgb(24,24,25); } QSpinBox::up-arrow, QDoubleSpinBox::up-arrow { image: url(./Dark/up.svg); width: 100%; } QSpinBox::down-arrow, QDoubleSpinBox::down-arrow { image: url(./Dark/down.svg); width: 100%; } /* Buttons */ QPushButton { color: rgb(225,224,225); background-color: #162458; border: 1px solid #233166; padding: 6px 20px; margin: 1px; } QPushButton::flat { background-color: rgb(24,24,25); border: none; } QPushButton:checked { background-color: #581624; border-color: #84162d; } QPushButton:hover { background-color: #2a3a75; border: 1px solid #364683; } QPushButton:pressed { background-color: #161f41; } QPushButton:disabled { border: 1px solid #232426; background-color: #1a1a1b; } QPushButton::flat:hover, QPushButton::flat:disabled { border: none; } /* Progress Bar */ QProgressBar { background: #101010; border: 2px solid #363636; border-radius: 0px; text-align: center; } QProgressBar::chunk { background-color: #2a3a75; } /* Sliders */ QSlider::groove:horizontal { background-color: QLinearGradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 rgb(31,30,31), stop: 0.75 rgb(50, 49, 50)); height: 4px; border: none; border-radius: 2px; } QSlider::handle:horizontal { background-color: QLinearGradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 rgb(240,239,240), stop: 0.25 rgb(200,199,200), stop: 1 rgb(162,161,162)); border: 1px solid rgb(24,24,25); border-radius: 3px; height: 10px; width: 18px; margin: -3px 0; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */ } QSlider::handle:horizontal:pressed { background-color: QLinearGradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 rgb(240,239,240), stop: 0.25 rgb(200,199,200), stop: 1 rgb(162,161,162)); } QSlider::sub-page:horizontal { background-color: #2a3a75; } QSlider::sub-page:horizontal:disabled { background-color: QLinearGradient(x1: 0, y1: 1, x2: 0, y2: 0, stop: 0 rgb(26,25,26), stop: 0.75 rgb(10, 10, 10)); border-radius: 2px; } QSlider::groove:vertical { background-color: QLinearGradient(x1: 0, y1: 0, x2: 1, y2: 0, stop: 0 rgb(31,30,31), stop: 0.75 rgb(50, 49, 50)); width: 4px; border: none; border-radius: 2px; } QSlider::handle:vertical { background-color: QLinearGradient(x1: 0, y1: 0, x2: 1, y2: 0, stop: 0 rgb(240,239,240), stop: 0.25 rgb(200,199,200), stop: 1 rgb(162,161,162)); border: 1px solid rgb(24,24,25); border-radius: 3px; width: 10px; height: 18px; margin: 0 -3px; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */ } QSlider::handle:vertical:pressed { background-color: QLinearGradient(x1: 0, y1: 0, x2: 1, y2: 0, stop: 0 rgb(240,239,240), stop: 0.25 rgb(200,199,200), stop: 1 rgb(162,161,162)); } QSlider::add-page:vertical { background-color: #2a3a75; } QSlider::add-page:vertical:disabled { background-color: QLinearGradient(x1: 0, y1: 0, x2: 1, y2: 0, stop: 0 rgb(26,25,26), stop: 0.75 rgb(10, 10, 10)); border-radius: 2px; } QSlider::handle:hover { background-color: rgb(200,199,200); } QSlider::handle:disabled { background-color: rgb(15,15,16); } /* Volume Control */ VolumeMeter { qproperty-backgroundNominalColor: #42740c; qproperty-backgroundWarningColor: #988F0F; qproperty-backgroundErrorColor: #802004; qproperty-foregroundNominalColor: #84D82B; qproperty-foregroundWarningColor: #E4D717; qproperty-foregroundErrorColor: #D74116; qproperty-magnitudeColor: rgb(49, 54, 59); /* Blue-gray */ qproperty-majorTickColor: rgb(239, 240, 241); /* White */ qproperty-minorTickColor: rgb(118, 121, 124); /* Light Gray */ qproperty-peakDecayRate: 23.4; /* Override of the standard PPM Type I rate. */ } /* Status Bar */ QStatusBar::item { border: none; } /* Checkboxes */ QCheckBox { padding: 4px; } QCheckBox::indicator, QGroupBox::indicator { width: 20px; height: 20px; } QGroupBox::indicator { margin-left: 2px; } QCheckBox::indicator:unchecked { image: url(./Acri/checkbox_unchecked.png); } QCheckBox::indicator:unchecked:hover, QGroupBox::indicator:unchecked:hover { border: none; image: url(./Acri/checkbox_unchecked_focus.png); } QCheckBox::indicator:checked { image: url(./Acri/checkbox_checked.png); } QCheckBox::indicator:checked:hover, QGroupBox::indicator:checked:hover { border: none; image: url(./Acri/checkbox_checked_focus.png); } QCheckBox::indicator:checked:disabled, QGroupBox::indicator:checked:disabled { image: url(./Acri/checkbox_checked_disabled.png); } QCheckBox::indicator:unchecked:disabled, QGroupBox::indicator:unchecked:disabled { image: url(./Acri/checkbox_unchecked_disabled.png); } /* Radio Buttons */ QRadioButton::indicator { width: 19px; height: 19px; } QRadioButton::indicator:unchecked { image: url(./Acri/radio_unchecked.png); } QRadioButton::indicator:unchecked:hover, QRadioButton::indicator:unchecked:focus, QRadioButton::indicator:unchecked:pressed { border: none; outline: none; image: url(./Acri/radio_unchecked_focus.png); } QRadioButton::indicator:checked { border: none; outline: none; image: url(./Acri/radio_checked.png); } QRadioButton::indicator:checked:hover, QRadioButton::indicator:checked:focus, QRadioButton::indicator:checked:pressed { border: none; outline: none; image: url(./Acri/radio_checked_focus.png); } QRadioButton::indicator:checked:disabled { outline: none; image: url(./Acri/radio_checked_disabled.png); } QRadioButton::indicator:unchecked:disabled { image: url(./Acri/radio_unchecked_disabled.png); } /* Mute CheckBox */ MuteCheckBox { outline: none; } MuteCheckBox::indicator:checked { image: url(./Dark/mute.svg); } MuteCheckBox::indicator:unchecked { image: url(./Dark/settings/audio.svg); } MuteCheckBox::indicator:unchecked:hover { image: url(./Dark/settings/audio.svg); } MuteCheckBox::indicator:unchecked:focus { image: url(./Dark/settings/audio.svg); } MuteCheckBox::indicator:checked:hover { image: url(./Dark/mute.svg); } MuteCheckBox::indicator:checked:focus { image: url(./Dark/mute.svg); } MuteCheckBox::indicator:checked:disabled { image: url(./Dark/mute.svg); } MuteCheckBox::indicator:unchecked:disabled { image: url(./Dark/settings/audio.svg); } OBSHotkeyLabel[hotkeyPairHover=true] { color: rgba(27, 96, 166); } /* Group Collapse Checkbox */ SourceTreeSubItemCheckBox { background: transparent; outline: none; padding: 0px; } SourceTreeSubItemCheckBox::indicator { width: 12px; height: 12px; } SourceTreeSubItemCheckBox::indicator:checked, SourceTreeSubItemCheckBox::indicator:checked:hover { image: url(./Dark/expand.svg); } SourceTreeSubItemCheckBox::indicator:unchecked, SourceTreeSubItemCheckBox::indicator:unchecked:hover { image: url(./Dark/down.svg); } /* Label warning/error */ QLabel#warningLabel { color: rgb(192, 128, 0); font-weight: bold; } QLabel#errorLabel { color: rgb(192, 0, 0); font-weight: bold; } /* Settings Menu */ #buttonBox { border-top: 2px solid grey; } /* Special Fixes */ OBSBasicProperties, #OBSBasicSettings, #OBSBasicFilters { background: #101010; } FocusList::item { padding: 0px 2px; } #fpsTypes { padding: 0px; } #finishPage QLabel { padding: -2px 0px; background: transparent; min-height: 26px; } /* About dialog */ #OBSAbout #icon { padding: 0; } #OBSAbout QTextBrowser { background: transparent; padding: 2px 0; } * [themeID="aboutName"] { font-size: 36px; font-weight: bold; padding: 0; } * [themeID="aboutVersion"] { font-size: 16px; margin-bottom: 20px; padding: 0; } * [themeID="aboutInfo"] { margin-bottom: 20px; } * [themeID="aboutHLayout"] { background-color: rgb(8, 8, 11); } /* Preview background color */ OBSQTDisplay { qproperty-displayBackgroundColor: #28282A; } /* Preview/Program labels */ * [themeID="previewProgramLabels"] { font-size: 18px; font-weight: bold; color: rgb(122,121,122); } /* Settings Icons */ OBSBasicSettings { qproperty-generalIcon: url(./Dark/settings/general.svg); qproperty-streamIcon: url(./Dark/settings/stream.svg); qproperty-outputIcon: url(./Dark/settings/output.svg); qproperty-audioIcon: url(./Dark/settings/audio.svg); qproperty-videoIcon: url(./Dark/settings/video.svg); qproperty-hotkeysIcon: url(./Dark/settings/hotkeys.svg); qproperty-advancedIcon: url(./Dark/settings/advanced.svg); } OBSBasicSettings QListWidget::item { padding-top: 5px; padding-bottom: 5px; } /* Table */ QTableView { gridline-color: #333336; } QHeaderView { border: none; } QHeaderView::section { background-color: #101010; border: 1px solid #333336; border-left: none; } *[themeID="trashIcon"] { margin: 0; } /* Locked CheckBox */ LockedCheckBox { outline: none; background: transparent; padding: 0px; } LockedCheckBox::indicator { width: 16px; height: 16px; } LockedCheckBox::indicator:checked { image: url(./Dark/locked.svg); } LockedCheckBox::indicator:unchecked { image: url(:res/images/unlocked.svg); } LockedCheckBox::indicator:checked:hover { image: url(./Dark/locked.svg); } LockedCheckBox::indicator:unchecked:hover { image: url(:res/images/unlocked.svg); } /* Visibility CheckBox */ VisibilityCheckBox { outline: none; background: transparent; padding: 0px; } VisibilityCheckBox::indicator { width: 16px; height: 16px; } VisibilityCheckBox::indicator:checked { image: url(./Dark/visible.svg); } VisibilityCheckBox::indicator:unchecked { image: url(:res/images/invisible.svg); } VisibilityCheckBox::indicator:checked:hover { image: url(./Dark/visible.svg); } VisibilityCheckBox::indicator:unchecked:hover { image: url(:res/images/invisible.svg); } * [themeID="trashIcon"] { qproperty-icon: url(./Dark/trash.svg); } * [themeID="revertIcon"] { qproperty-icon: url(./Dark/revert.svg); } QPushButton#extraPanelDelete { background: transparent; border: none; } QPushButton#extraPanelDelete:hover { background-color: #2a3a75; } QPushButton#extraPanelDelete:pressed { background-color: #161f41; } /* Source Icons */ OBSBasic { qproperty-imageIcon: url(./Dark/sources/image.svg); qproperty-colorIcon: url(./Dark/sources/brush.svg); qproperty-slideshowIcon: url(./Dark/sources/slideshow.svg); qproperty-audioInputIcon: url(./Dark/sources/microphone.svg); qproperty-audioOutputIcon: url(./Dark/settings/audio.svg); qproperty-desktopCapIcon: url(./Dark/settings/video.svg); qproperty-windowCapIcon: url(./Dark/sources/window.svg); qproperty-gameCapIcon: url(./Dark/sources/gamepad.svg); qproperty-cameraIcon: url(./Dark/sources/camera.svg); qproperty-textIcon: url(./Dark/sources/text.svg); qproperty-mediaIcon: url(./Dark/sources/media.svg); qproperty-browserIcon: url(./Dark/sources/globe.svg); qproperty-groupIcon: url(./Dark/sources/group.svg); qproperty-sceneIcon: url(./Dark/sources/scene.svg); qproperty-defaultIcon: url(./Dark/sources/default.svg); } /* Scene Tree */ SceneTree#scenes { qproperty-gridItemWidth: 180; qproperty-gridItemHeight: 35; } *[gridMode="true"] SceneTree#scenes { border-bottom: none; } *[gridMode="false"] SceneTree#scenes { border-bottom: 2px solid #2f2f2f; } *[gridMode="true"] SceneTree::item { padding: 4px; padding-left: 10px; padding-right: 10px; margin: 0px; } /* Save replay icon */ * [themeID="replayIconSmall"] { qproperty-icon: url(./Dark/save.svg); } /* Studio Mode T-Bar */ QSlider[themeID="tBarSlider"] { height: 28px; } QSlider::groove:horizontal[themeID="tBarSlider"] { height: 5px; background-color: QLinearGradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 rgb(31,30,31), stop: 0.75 rgb(50, 49, 50)); border: none; border-radius: 2px; } QSlider::sub-page:horizontal[themeID="tBarSlider"] { height: 5px; background-color: QLinearGradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 rgb(31,30,31), stop: 0.75 rgb(50, 49, 50)); border: none; border-radius: 2px; } QSlider::handle:horizontal[themeID="tBarSlider"] { background-color: #d2d2d2; width: 14px; height: 28px; margin: -28px 0px; }