Skip to content

Youtube - Clean (For Dark Mode) by 6meikyuu9

Screenshot of Youtube - Clean (For Dark Mode)

Details

Author6meikyuu9

LicenseCC BY-NC-ND 4.0

Categoryyoutube.com

Created

Updated

Size9.5 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

For dark mode, clean and improved.

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.1
@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);
  border-radius: 2px;}

.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;
}

.yt-spec-touch-feedback-shape__stroke, ytd-playlist-thumbnail #thumbnail.ytd-playlist-thumbnail, yt-chip-cloud-chip-renderer[modern-chips][chip-style], ytd-thumbnail[size="medium"] a.ytd-thumbnail, ytd-thumbnail[size="medium"]::before, ytd-thumbnail[size="large"] a.ytd-thumbnail, ytd-thumbnail[size="large"]::before, img.yt-img-shadow , .yt-spec-button-shape-next--size-m, .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal, ytd-watch-metadata[modern-metapanel] #description.ytd-watch-metadata {
  border-radius: 2px;
}

.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);
}
.ytp-settings-button.ytp-hd-quality-badge::after, .ytd-author-comment-badge-renderer,  .badge-style-type-starting-soon.ytd-badge-supported-renderer , tp-yt-paper-button.ytd-subscribe-button-renderer {
  border-radius: 0px;
}
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;         
          border-radius:  2px;
}
[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;
}
}

Reviews

No reviews yet.