For dark mode, clean and improved.
Youtube - Clean (For Dark Mode) by 6meikyuu9
Details
Author6meikyuu9
LicenseCC BY-NC-ND 4.0
Categoryyoutube.com
Created
Updated
Size9.3 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Hide Comments by adding this code, or make a new userstyle so you can toggle it on/off:
[id="comments"] {
display:none;
}
Source code
@-moz-document url-prefix("youtube.com") {
/* ==UserStyle==
@name Youtube - Clean (For Dark Mode)
@namespace https://youtube.com
@version 1.0.2
@description For dark mode, clean and improved.
@author Meikyuu
==/UserStyle== */
}
@-moz-document domain("youtube.com") {
/* Pockettube */
.ysm-collection-tristate-switcher > input[type="radio"] + i {
background-color: #4a4a4a!important;
}
.ysm-collection-tristate-switcher > input[type="radio"] + i::before {
background: #939393!important;
box-shadow: none;
}
.ysm-collection-switcher-item, .ysm-collection-switcher-item-main {
color:#939393!important;
}
.ysm-collection-switcher-item:not(.ysm-collection-switcher-item-main).on {
background: rgba(179, 255, 0, .37)!important;
color: #e5ff00!important;
}
.ysm-collection-switcher-item {
background: #282828!important;
}
.ysm-new-button {
background-image: none!important;
}
#guide-subscriptions-section .guide-channel.ysm-background, #endpoint.ysm-background, #items .ysm-background {
background-color: #000!important;
}
/* HIDE */
ytd-watch-metadata[modern-metapanel-order] #comment-teaser.ytd-watch-metadata, .ryd-tooltip, .badge-style-type-featured.ytd-badge-supported-renderer, #sponsor-button.ytd-video-owner-renderer, #purchase-button.ytd-video-owner-renderer, #analytics-button.ytd-video-owner-renderer, yt-multi-page-menu-section-renderer.style-scope:nth-child(2) > div:nth-child(2) > ytd-compact-link-renderer:nth-child(5) > a:nth-child(1) > paper-item:nth-child(1), yt-multi-page-menu-section-renderer.style-scope:nth-child(2) > div:nth-child(2) > ytd-compact-link-renderer:nth-child(4) > a:nth-child(1) > paper-item:nth-child(1), yt-multi-page-menu-section-renderer.style-scope:nth-child(1) > div:nth-child(2) > ytd-compact-link-renderer:nth-child(2) > a:nth-child(1) > paper-item:nth-child(1), ytd-guide-section-renderer.style-scope:nth-child(5), ytd-guide-section-renderer.style-scope:nth-child(4), ytd-guide-section-renderer.style-scope:nth-child(4) > div:nth-child(2) > ytd-guide-entry-renderer:nth-child(2), ytd-guide-section-renderer.style-scope:nth-child(4) > div:nth-child(2) > ytd-guide-entry-renderer:nth-child(1), a[url^="youtube.com/premium"], #sentiment, ytd-topbar-logo-renderer.style-scope, .sticky, #container.ytd-iframe-companion-renderer > *.ytd-iframe-companion-renderer:last-child:not(#google_companion_ad_div), #movie_player > div.annotation.annotation-type-custom.iv-promo.iv-promo-website-card-cta-redesign.iv-promo-collapsed, #player-ads,#movie_player > div.video-ads > div > div > div.videoAdUiBottomBar > div.videoAdUiBottomBarText, #footer {
display:none;
}
/* COLORS */
html:not(.style-scope)[dark], :not(.style-scope)[dark], html:not(.style-scope), :not(.style-scope) {
--yt-spec-text-primary:#a8a8a8;
--yt-endpoint-hover-color:#a8a8a8;
--yt-spec-call-to-action:#808080;
--yt-spec-brand-button-background: #972542;
--ytd-tab-system_-_font-size: 10px;
--yt-button-padding: 3px 10px 3px 10px;
--yt-spec-brand-link-text:#e11c4e;
--yt-badge-font-size:1rem;
--yt-spec-static-brand-red:#aa2849;
--yt-spec-icon-active-other:#a8a8a8;
--iron-icon-fill-color:#a8a8a8;
--ytd-video-primary-info-renderer-title-font-size: 16px;
--yt-live-chat-primary-text-color:#a8a8a8;
--yt-spec-static-overlay-background-brand:rgb(159, 14, 50) ;
--ytd-searchbox-legacy-button-icon-color: #fff;
--yt-spec-badge-chip-background: rgba(255, 255, 255, .05);
--yt-spec-button-chip-background-hover: rgba(255, 255, 255, .06);
--yt-spec-mono-tonal-hover: rgba(255, 255, 255, .1)
--yt-guide-background: #0f0f0f;
--yt-ysm-background: #0f0f0f;
--yt-spec-themed-blue: rgba(255, 255, 255, .5);
--yt-spec-suggested-action: #682f45;
}
#description.ytd-watch-metadata {
color: rgba(255, 255, 255, .4);
font-size: 1.4rem;
}
ytd-text-inline-expander {
margin-top: 10px;
}
ytd-thumbnail-overlay-resume-playback-renderer {
border-top: 1px solid #000;
}
#container.ytd-searchbox, #search-icon-legacy.ytd-searchbox {
background-color: #1b1b1b;
border: 1px solid #1b1b1b;
box-shadow: none;
}
ytd-video-renderer:not([is-search]) {
background-color: rgb(25, 25, 25);
}
.badge-style-type-live-now-alternate.ytd-badge-supported-renderer {
background: #680c23;
padding: 0px 5px 1px 4px!important;
}
ytd-thumbnail-overlay-side-panel-renderer {
background-color: rgba(25, 25, 25, .96);
}
.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--filled, .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal{
transition: 0.1s all ease-in-out;
}
ytd-subscribe-button-renderer.ytd-watch-metadata > yt-button-shape:nth-child(1) > button:nth-child(1) {
color: rgba(255, 255, 255, .3);
}
.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--filled {
color: rgba(255, 255, 255, .5);
background-color: rgba(255, 49, 101, .2);
}
.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--filled:hover {
color: rgba(255, 255, 255, .8)!important;
background-color: #682f43;
}
.yt-spec-button-shape-next--size-m, .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal{
padding: 0 16px;
height: 36px;
font-size: 14px;
line-height: 36px;
}
#bottom-row > div:nth-child(1) {
border: none!important;
}
.ytp-chrome-controls .ytp-button[aria-pressed]::after, .ytp-settings-button.ytp-hd-quality-badge::after {
background-color: #aa0c40;
}
.ytp-swatch-background-color {
background-color: #920d39;
}
yt-icon, .yt-icon-container.yt-icon {
fill: var(--iron-icon-fill-color,currentcolor);
stroke: var(--iron-icon-stroke-color,none);
}
tp-yt-paper-button.ytd-subscribe-button-renderer:hover {
background-color: #aa2853;
box-shadow: rgba(255, 0, 64, .3) 0px 0px 10px 0px;
}
.badge.ytd-badge-supported-renderer {
padding: 0px;
}
ytd-compact-video-renderer.style-scope > div > div > div > a > div > ytd-badge-supported-renderer > div {
padding: 0px 3px 0px 2px!important;
}
ytd-button-renderer.style-suggestive[is-paper-button] tp-yt-paper-button.ytd-button-renderer {
border: 1px solid #444!important;
padding: 2px 9px 2px 9px;
}
.add-to-collection-button-new svg {
fill: #848484!important;
}
ytd-author-comment-badge-renderer {
background-color: #421824;
}
ytd-video-primary-info-renderer {
border-bottom: none;
padding: 10px 0 10px 0;
}
#top-row.ytd-video-secondary-info-renderer {
margin-bottom: 12px;
padding-top: 0px;
}
ytd-video-secondary-info-renderer {
margin-bottom: 0px;
}
ytd-video-secondary-info-renderer, .badge-style-type-live-now.ytd-badge-supported-renderer{
border: none;
}
#content-text.ytd-comment-renderer {
color: #a8a8a8;
}
.content.ytd-video-secondary-info-renderer {
color: #cecece;
}
ytd-grid-video-renderer, ytd-video-renderer, ytd-video-secondary-info-renderer, ytd-compact-video-renderer.ytd-watch-next-secondary-results-renderer:not([expansion="collapsed"]).ytd-watch-next-secondary-results-renderer, ytd-compact-radio-renderer.ytd-watch-next-secondary-results-renderer, ytd-compact-movie-renderer.ytd-watch-next-secondary-results-renderer, ytd-compact-playlist-renderer.ytd-watch-next-secondary-results-renderer, ytd-compact-promoted-video-renderer.ytd-watch-next-secondary-results-renderer, ytd-promoted-sparkles-web-renderer.ytd-watch-next-secondary-results-renderer {
background-color: #202020;
padding: 5px;
}
ytd-grid-video-renderer {
margin-right: 10px;
}
#author-thumbnail.ytd-comment-renderer yt-img-shadow.ytd-comment-renderer {
margin-right: 10px;
margin-left: 5px;
}
#comment-content.ytd-comment-renderer {
padding: 10px;
background-color: rgba(255, 255, 255, .03);
}
#body.ytd-comment-renderer {
background-color: rgba(255, 255, 255, .03);
padding: 5px;
}
[class="more-button style-scope ytd-comment-renderer"] {
color: #5b5b5b!important;
}
#container.ytd-masthead {
height: 56px;
padding: 0 16px;
background: #131313;
box-shadow: #0f0f0f 0px 4px 10px;
}
.yt-spec-touch-feedback-shape--touch-response .yt-spec-touch-feedback-shape__fill {
background-color: #9f9f9f;
}
[class="style-scope yt-chip-cloud-renderer iron-selected"] {
font-weight: 600;
background-color: var(--yt-spec-badge-chip-background)!important;
color: var(--yt-spec-text-primary)!important;
border: 2px solid #2c2c2c!important;
}
.sbdd_b {
background: #272727;
border: 1px solid #272727;
border-top-color: #272727;
}
@-moz-document url-prefix("https://www.youtube.com/feed/history") {
ytd-item-section-renderer.style-scope:nth-child(2) > div:nth-child(3) > ytd-video-renderer:nth-child(10) > div:nth-child(1) > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) > div:nth-child(2) > ytd-menu-renderer:nth-child(1) > div:nth-child(1) > ytd-button-renderer:nth-child(1) > yt-button-shape:nth-child(1) > button:nth-child(1) {
height: 46px;
width: 46px;
}
#menu.ytd-video-renderer {
height: 3rem;
}
ytd-menu-renderer.ytd-video-renderer {
margin-top: -1px;
}
}