/* ==UserStyle==
@name YouTube - PitchBlack dark/black theme
@namespace USO Archive
@author sprince0031
@description `<p bgcolor="#000" color="#fff"><u><b>*TURN ON DARK MODE IN YOUTUBE BEFORE APPLYING THIS THEME*</b></u></p>Inspired by the legendary PitchBlack Substratum theme for Android, this is a PitchBlack theme for YouTube. In true PitchBlack fashion, you get to pick the accent color of your choice! A list of all PitchBlack accents and background variants are available below along with their hexcodes. Do note that you can pick any color you want from the color picker but these are the official colors. Enjoy!*P.S Pssst..!! Do rate and share the theme if you liked it. :D`
@version 20230419.2.2
@license CC-BY-SA-4.0
@preprocessor uso
@advanced color bg "Background Color" #000000
@advanced color color "Accent Color" #ff0000
@advanced color tpac "Transparency Effects (Accent)" #ff000075
@advanced color tpbg "Transparency Effects (background)" #000000a6
@advanced dropdown transparency-toggle "Transparency Effects" {
transparency-enabled "Enabled*" <<<EOT :root {
--yt-spec-raised-background: none !important;
--yt-spec-menu-background: none !important;
--paper-listbox-background-color: /*[[tpbg]]*\/ !important;
}
ytd-masthead[darker-dark-theme] #background.ytd-masthead, #background.ytd-masthead {
background: none !important;
}
div#masthead-container {
background-color: /*[[tpbg]]*\/ !important;
backdrop-filter: blur(10px) saturate(100%) !important;
}
ytd-feed-filter-chip-bar-renderer #chips-wrapper.ytd-feed-filter-chip-bar-renderer {
background-color: /*[[tpbg]]*\/ !important;
backdrop-filter: blur(10px) saturate(100%) !important;
}
ytd-voice-search-dialog-renderer[dialog] {
background-color: /*[[tpbg]]*\/ !important;
backdrop-filter: blur(10px) saturate(100%) !important;
}
#microphone-levels.ytd-voice-search-dialog-renderer {
background-color: /*[[tpac]]*\/;
}
.ytd-popup-container {
backdrop-filter: blur(50px) saturate(150%) !important;
}
.sbdd_b {
background: /*[[tpbg]]*\/ !important;
backdrop-filter: blur(10px) saturate(100%) !important;
}
.sbdd_c {
display: none !important;
}
#emojis.ytd-commentbox {
background: /*[[tpbg]]*\/ !important;
backdrop-filter: blur(10px) saturate(100%) !important;
}
#card.ytd-miniplayer, ytd-miniplayer {
background-color: none !important;
backdrop-filter: blur(10px) saturate(100%) !important;
}
#inner.yt-live-chat-dialog-renderer, #overlay-dialog.yt-live-chat-renderer>*.yt-live-chat-renderer {
background-color: /*[[tpbg]]*\/;
backdrop-filter: blur(35px) saturate(100%);
}
.ytd-miniplayer #info-bar {
background: /*[[tpbg]]*\/ !important;
} EOT;
transparency-disabled "Disabled" <<<EOT :root {
--yt-spec-raised-background: /*[[bg]]*\/ !important;
--yt-spec-menu-background: /*[[bg]]*\/ !important;
}
div#masthead-container {
background-color: /*[[bg]]*\/ !important;
}
ytd-feed-filter-chip-bar-renderer #chips-wrapper.ytd-feed-filter-chip-bar-renderer {
background-color: /*[[bg]]*\/ !important;
}
#microphone-levels.ytd-voice-search-dialog-renderer {
background-color: /*[[color]]*\/;
}
.ytd-popup-container {
background: /*[[bg]]*\/ !important;
}
.sbdd_b {
background-color: /*[[bg]]*\/ !important;
}
#inner.yt-live-chat-dialog-renderer, #overlay-dialog.yt-live-chat-renderer>*.yt-live-chat-renderer {
background-color: /*[[bg]]*\/;
}
.ytd-miniplayer #info-bar {
background: /*[[bg]]*\/ !important;
} EOT;
}
==/UserStyle== */
@-moz-document regexp("https?://(www)?.?youtube.com.*") {
:root {
--yt-spec-brand-button-background: /*[[color]]*/
!important;
--yt-main-app-background-tmp: /*[[bg]]*/
!important;
--yt-spec-general-background-a: /*[[bg]]*/
!important;
--yt-spec-general-background-b: /*[[bg]]*/
!important;
--yt-subscribe-button-text-color: /*[[bg]]*/
!important;
--yt-spec-icon-active-button-link: /*[[color]]*/
!important;
--yt-guide-entry-hover-background-color: /*[[color]]*/
!important;
--yt-notification-button-bubble_-_color: /*[[bg]]*/
!important;
--yt-spec-themed-blue: /*[[color]]*/
!important;
--yt-spec-call-to-action: /*[[color]]*/
!important;
/*
--ytd-searchbox-legacy-border-color: /*[[color]] !important;
*/
--ytd-searchbox-legacy-button-hover-color: /*[[color]]*/
!important;
--paper-spinner-color: /*[[color]]*/;
--paper-input-container-focus-color: /*[[color]]*/
!important;
--yt-spec-icon-active-other: /*[[color]]*/
!important;
--yt-spec-text-primary-inverse: /*[[bg]]*/
!important;
--yt-spec-badge-chip-background: /*[[bg]]*/
!important;
/*
--yt-spec-text-primary: /*[[color]] !important;
--yt-spec-10-percent-layer: /*[[color]] !important;
*/
--yt-spec-brand-background-solid: /*[[bg]]*/
!important;
--ytd-author-comment-badge-icon-color: /*[[bg]]*/
!important;
--ytd-author-comment-badge-background-color: /*[[color]]*/
!important;
--ytd-author-comment-badge-name-color: /*[[bg]]*/
!important;
/* Live chat settings */
--yt-live-chat-header-background-color: /*[[bg]]*/
!important;
--yt-live-chat-background-color: /*[[bg]]*/
!important;
--yt-live-chat-vem-background-color: /*[[bg]]*/
!important;
--yt-live-chat-action-panel-background-color: /*[[bg]]*/
!important;
--yt-spec-suggested-action: transparent !important;
--paper-tabs-selection-bar-color: /*[[color]]*/
!important;
--yt-spec-static-overlay-background-brand: /*[[color]]*/ !important;
}
html,
body {
background: /*[[bg]]*/
!important;
}
ytd-app {
background: /*[[bg]]*/;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: /*[[color]]*/
!important;
}
h4.macro-markers.style-scope.ytd-macro-markers-list-item-renderer {
color: var(--yt-spec-text-primary) !important;
}
#header.ytd-engagement-panel-title-header-renderer {
border-bottom: solid 1px/*[[color]]*/;
}
a {
color: /*[[color]]*/
!important;
}
/*[[transparency-toggle]]*/
/* YouTube main logo */
yt-icon#logo-icon svg g g:nth-child(1) path:nth-child(1),
yt-icon#logo-icon svg g:nth-child(1) path:nth-child(1) {
fill: /*[[color]]*/;
}
yt-icon#logo-icon svg g g:nth-child(1) path:nth-child(2),
yt-icon#logo-icon svg g:nth-child(1) path:nth-child(2) {
fill: /*[[bg]]*/;
}
yt-icon#logo-icon svg g g#youtube-paths path {
fill: white;
}
yt-icon#logo-icon svg g g#youtube-red-paths path {
fill: white;
}
#voice-search-button yt-icon-shape svg,
#voice-search-button yt-icon svg {
color: /*[[color]]*/
!important;
}
#voice-search-button {
background: none !important;
}
#voice-search-button:hover yt-icon-shape svg,
#voice-search-button:hover yt-icon svg {
color: /*[[bg]]*/
!important;
}
#voice-search-button:hover {
background: /*[[color]]*/
!important;
}
#microphone-circle.ytd-voice-search-dialog-renderer,
#microphone.ytd-voice-search-dialog-renderer[state=try-again] #microphone-circle.ytd-voice-search-dialog-renderer {
background-color: /*[[color]]*/
!important;
}
#microphone-circle.ytd-voice-search-dialog-renderer yt-icon-shape svg,
#microphone.ytd-voice-search-dialog-renderer[state=try-again] #microphone-circle.ytd-voice-search-dialog-renderer yt-icon-shape svg {
color: /*[[bg]]*/
!important;
}
#microphone-circle.ytd-voice-search-dialog-renderer yt-icon svg,
#microphone.ytd-voice-search-dialog-renderer[state=try-again] #microphone-circle.ytd-voice-search-dialog-renderer yt-icon svg {
color: /*[[bg]]*/
!important;
}
.ytp-ce-expanding-overlay-background {
background-color: /*[[bg]]*/;
}
.ytp-ce-website-title {
color: var(--yt-spec-text-primary);
}
#video-title,
.ytd-video-primary-info-renderer {
color: var(--yt-spec-text-primary) !important;
}
#video-title:hover {
color: /*[[color]]*/
!important;
}
#above-the-fold h1 yt-formatted-string {
color: var(--yt-spec-text-primary) !important;
}
/* Shorts */
.progress-bar-played.ytd-progress-bar-line {
background-color: /*[[color]]*/;
}
h2.title .ytd-reel-player-header-renderer {
color: #eee !important;
}
.ytd-reel-player-header-renderer yt-button-shape.style-scope.ytd-subscribe-button-renderer button {
background-color: /*[[bg]]*/;
color: /*[[color]]*/;
border: solid 1px/*[[color]]*/;
}
/* Feed category suggestions */
yt-chip-cloud-chip-renderer {
font-weight: bold;
}
ytd-feed-filter-chip-bar-renderer svg,
.yt-chip-cloud-renderer .yt-spec-button-shape-next svg {
fill: /*[[color]]*/;
}
ytd-feed-filter-chip-bar-renderer[darker-dark-theme] #left-arrow-button.ytd-feed-filter-chip-bar-renderer,
ytd-feed-filter-chip-bar-renderer[darker-dark-theme] #right-arrow-button.ytd-feed-filter-chip-bar-renderer {
background-color: /*[[bg]]*/;
}
ytd-feed-filter-chip-bar-renderer[darker-dark-theme][is-dark-theme] #right-arrow.ytd-feed-filter-chip-bar-renderer:before {
background: linear-gradient(to left, /*[[bg]]*/
20%, rgba(33, 33, 33, 0) 80%) !important;
}
ytd-feed-filter-chip-bar-renderer[darker-dark-theme][is-dark-theme] #left-arrow.ytd-feed-filter-chip-bar-renderer:after {
bac...
