Skip to content

Neon Purple yt by oaxtro

Details

Authoroaxtro

LicenseNo License

CategoryYoutube

Created

Updated

Size16 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

youtube theme

Notes

Youtube theme

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name           Youtube Neon v2
@namespace      USO Archive
@author         Antonio Augusto Barbaro
@description    `A style for those who like neon and gradients in everything using blue and purple. Almost black background and lighter sidebar with text and thumbnails using gradients and transparency effect on search box. The code has been commented in case you want personal changes.`
@version        20210806.10.51
@license        CC0-1.0
@preprocessor   uso
==/UserStyle== */
@-moz-document domain("www.youtube.com") {
#masthead-container {
    box-shadow: 0px 0px 20px 0px #000;
    border-bottom: solid #000 2px;
}
/* title and infos */
 span, #video-title, #content-text {
    color: #000 !important;
}
#like-bar {
    background-color: #4012be !important;
}
/*Blue | share,subscribe,chat text color */
 .view-count, #subscribe-button > ytd-subscribe-button-renderer > paper-button > yt-formatted-string, #subscribe-button > ytd-subscribe-button-renderer > paper-button > yt-formatted-string > span, #description, #byline-container, #byline-inner-container, #byline, #owner-name, #name, #guide-section-title, #text, #published-time-text, a.yt-formatted-string {
    /*	channels text color */
    color: #4012be !important;
    /*  channels text chanels border  */
    text-shadow: 1px 1px 12px rgba(220, 5, 224, 0.1) !important;
}
/*left guide subscribed channels*/
 .title, yt-icon, #less, #more, .more-button, .less-button, #icon-label, #count, .count-text, #simplebox-placeholder, #placeholder, #textarea, #title-annotation, #upnext, #autoplay {
    /*box-shadow: 0px 0px 100px 0px rgba(5, 255, 3, 1);*/
    background: linear-gradient(to bottom, #000, #000, #000, #000, #000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* botões de liga e desliga */
 #toggleBar, #toggleButton {
    background-color:#143bc6 !important;
}
/*YouTube - Custom colors video progress bar*/

/* progress bar and player progress bar color */
 .html5-play-progress, .ytp-play-progress {
    background: #000 !important;
}
.ytp-volume-slider-track, .ytp-volume-slider-handle:before {
    background: #000 !important;
    z-index: -117;
}
/*
.ytp-settings-button.ytp-hd-quality-badge::after, .ytp-settings-button.ytp-4k-quality-badge::after, .ytp-settings-button.ytp-5k-quality-badge::after, .ytp-settings-button.ytp-8k-quality-badge::after, .ytp-settings-button.ytp-3d-badge::after {
    background-color: rgba(255, 0, 123, 0.9) !important;
}
.ytp-swatch-color {
    color: rgba(255, 0, 123, 0.9) !important;
}
.ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox {
    background: rgba(255, 20, 123, 0.9) !important;
}

.ytp-chrome-controls .ytp-button.ytp-youtube-button:hover:not([aria-disabled="true"]):not([disabled]) .ytp-svg-fill-logo-tube-lozenge {
    fill: rgba(255, 20, 23, 0.2) !important;
}
.ytp-cued-thumbnail-overlay:hover .ytp-large-play-button-bg, .ytp-large-play-button.ytp-touch-device .ytp-large-play-button-bg {
    fill: rgba(255, 220, 123, 0.9) !important;
}
.resume-playback-progress-bar {
    background: rgba(255, 0, 123, 0.9) !important;
}
.ytp-chrome-controls .ytp-button[aria-pressed]::after {
    background-color: rgba(255, 220, 123, 0.9) !important;
}
.yt-uix-checkbox-on-off input-extras2-disabled[type="checkbox"]:checked + label {
    background-color: rgba(255, 0, 123, 0.9) !important;
}
.video-extras-sparkbar-likes-extras2-disabled {
    background-color: rgba(255, 0, 123, 0.9) !important;
}
*/

/* back color configs */
 #button {
    outline:0;
}
/* thumb border */
 #thumbnail.ytd-thumbnail, #tooltip.paper-tooltip, .style-scope.ytd-thumbnail, ytd-thumbnail-overlay-time-status-renderer, paper-button, #description-text.ytd-report-details-form-renderer, #card.yt-live-chat-paid-message-renderer {
    border-color: Black;
    border-width: 5px;
    border: 1px solid;
    border-image: conic-gradient(#000, #000, #000, #000, #000, #000, #000) 1;
}
/* Background color */

/*
}
#thumbnail.module-border-wrap {
  max-width: 250px;
  padding: 1rem;
  position: relative;
  background: linear-gradient(to right, red, purple);
  padding: 3px;
}
#tooltip.paper-tooltip {
    border-radius: 20px;
    padding: 4px 8px;
    margin: 12px 8px;
    backdrop-filter: blur(10px);
}

.html5-video-player, .style-scope.ytd-rich-metadata-row-renderer, paper-button.ytd-subscribe-button-renderer, ytd-button-renderer.style-light[is-paper-button], .badge-selected.ytd-sponsorships-loyalty-badges-renderer, ytd-button-renderer[is-paper-button], #container.yt-alert-renderer, ytd-clarification-renderer[background-color-update], ytd-engagement-panel-section-list-renderer[watch-color-update], ytd-playlist-panel-renderer[watch-color-update_] #container.ytd-playlist-panel-renderer, #card.yt-live-chat-viewer-engagement-message-renderer, ytd-live-chat-frame[watch-color-update_], #button.yt-live-chat-message-buy-flow-renderer, #bar.yt-copy-link-renderer {
    border-radius: 20px;
}

.ytp-popup, .html5-video-info-panel {
    backdrop-filter: blur(10px);
    border-radius: 10px;
    background: rgba(48, 48, 60, 0);
}

.ytp-menuitem-toggle-checkbox:after {
    box-shadow: 20 20 20 0;
}

*/

/* Topo transparente*/
 #masthead {
    backdrop-filter: blur(27px);
    background: rgba(50, 0, 50, .1);
    border-radius: 0 0 11px 11px;
}
/* config of search box */
 #container.ytd-searchbox {
    margin-top: 1px;
    border: 2 !important;
    border-color: #4012be;
    border-bottom: 3px solid transparent !important;
    border-style:solid;
    border-width:1.3px;
    border-radius: 5px;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 5px), 0% calc(100% - 5px));
    background: blur;
    text-align:center;
    background-color: transparent;
}
/*
ytd-searchbox[has-focus] #container.ytd-searchbox {
    border: 0 !important;
    border-bottom: 3px solid #1c62b9 !important;
    box-shadow: 10px 10px 30px 0px rgba(0,0,0,0.1);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    animation: searchboxborder .5s;
}
*/

/* show the search icon? */
 #search-icon-legacy.ytd-searchbox {
    display: none;
}
div.gstl_50.sbdd_a {
    top: 56px !important;
}
.sbdd_b {
    box-shadow: inset 0px 125px 50px -125px rgba(0, 0, 0, 0.3) !important;
}
/* Back of search box sugestions*/
 .sbdd_b, .sbsb_a {
    border: 0;
    box-shadow: 0px 10px 30px 0px #000;
    background: #51515129;
    border-radius: 0 0 20px 20px;
    backdrop-filter: blur(5px);
}
/* color of the text in the search box previsions */
 .gsfs {
    color: rgb(0, 0, 0);
    text-align: center !important;
}
/* mouse hover color */
 .sbsb_d {
    background: rgba(0, 0, 0, 0.1);
    color: rgba(255, 0, 255, 0.1);
}
/* last item, denunciar pesquisas */
 .sbfl_a, .sbfl_b {
    font-style: normal;
    text-align: center;
    color: rgba(0, 255, 0, .5);
    background: transparent;
}
/* Star wars options video player */

/*Def: color_progbar:#5099FF - color_vol:#ED0000 - color_hd:#ED0000 - color_true:#5099FF - color_false:#ED0000*/

/* Barre de lecture */

/* Video progress bar */
 .html5-play-progress, .ytp-play-progress {
    background: #000;
    background: -moz-linear-gradient(top, #4012be 0%, #4012be 35%, #ffffff 65%, #4012be 100%);
    background: -webkit-linear-gradient(top, #4012be 0%, #ffffff 35%, #ffffff 65%, #4012be 100%);
    background: linear-gradient(to bottom, #4012be 0%, #ffffff 24%, #ffffff 65%, #4012be 100%);
    box-shadow: 0px 0px 20px #4012be, 0px 0px 20px #4012be, 0px 0px 20px #4012be !important;
}
/* Barre de chargement */

/* Video load bar */
 .html5-load-progress, .ytp-load-progress {
    background: #4012be;
    background: -moz-linear-gradient(top, rgba(120, 120, 120, 0.3) 0%, rgba(120, 120, 120, 0.3) 45%, rgba(255, 255, 255, 0.3) 55%, rgba(120, 120, 120, 0.3) 100%);
    background: -webkit-linear-gradient(top, rgba(120, 120, 120, 0.3) 0%, rgba(255, 255, 255, 0.3) 45%, rgba(255, 255, 255, 0.3) 55%, rgba(120, 120, 120, 0.3) 100%);
    background: linear-gradient(to bottom, rgba(120, 120, 120, 0.3) 0%, rgba(255, 255, 255, 0.3) 40%, rgba(255, 255, 255, 0.3) 55%, rgba(120, 120, 120, 0.3) 100%);
    box-shadow: 0px 0px 12px rgba(120, 120, 120, 0.3), 0px 0px 12px rgba(120, 120, 120, 0.3), 0px 0px 12px rgba(120, 120, 120, 0.3) !important;
}
/* Bouton de scroll */

/* Scrubber button */
 .html5-scrubber-button, .ytp-scrubber-button {
    background: rgba(255, 255, 255, 0) !important;
    border-color: rgba(255, 255, 255, 0) !important;
    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0), 0px 0px 0px rgba(255, 255, 255, 0), 0px 0px 0px rgba(255, 255, 255, 0) !important;
    transition: box-shadow 0.0s, background 0.0s !important;
}
/* Boutton de scroll — hover */

/* Scrubber button — hover */
 .html5-scrubber-button:hover, .ytp-scrubber-button:hover {
    background: #FFFFFF !important;
    background: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, #ffffff 20%, #4012be 100%) !important;
    background: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%, #ffffff 20%, #4012be 100%) !important;
    background: radial-gradient(ellipse at center, #ffffff 0%, #ffffff 20%, #4012be 100%) !important;
    border-color: #ffffff !important;
    box-shadow: 0px 0px 10px #4012be, 0px 0px 12px #4012be, 0px 0px 14px #4012be !important;
}
/* Réglage volume /    / Volume control bar */
 .ytp-volume-slider-handle {
    position:absolute;
    top:50%;
    width:3px;
    height:14px;
    margin-top:-7px;
    margin-left:0px;
    background: #4012be !important;
    background: -moz-linear-gradient(left, #4012be 0%, #4012be 35%, #ffffff 65%, #4012be 100%) !important;
    background: -webkit-linear-gradient(left, #4012be 0%, #ffffff 35%, #ffffff 65%, #4012be 100%) !important;
    background: linear-gradient(to right, #4012be 0%, #ffffff 24%, #ffffff 65%, #4012be 100%) !important;
    box-shadow: 0px 0px 10px #4012be, 0px 0px 10px #4012be, 0px 0px 10px #4012be !important;
}
.ytp-big-mode .ytp-volume-slider-handle {...

Reviews

No reviews yet.