makes the yt ui feel better (includes blur effects on certain elements)
yt enhancements by alpharetzy
Details
Authoralpharetzy
LicenseNo License
Categoryyoutube.com
Created
Updated
Size38 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name yt enhancements
@version 20250227
@namespace https://userstyles.world/user/alpharetzy
@description makes the yt ui feel better (includes blur effects on certain elements)
@author alpharetzy
@license No License
==/UserStyle== */
@-moz-document domain("youtube.com"),
domain("youtube-nocookie.com") {
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@24,300,0,0&icon_names=translate");
/*html[dark], [dark] {
--yt-frosted-glass-mobile: rgba(15,15,15,0.7);
--yt-frosted-glass-desktop: rgba(15,15,15,0.8);
}*/
.html5-video-player:not(.ytp-transparent),
.html5-video-player.unstarted-mode,
.html5-video-player.ad-showing,
.html5-video-player.ended-mode {
background: linear-gradient(#0093ff, #8fb3bc);
}
html {
--ytd-tab-system-text-transform: none;
--ytd-caption-text-transform: none;
}
.ERROR.yt-alert-renderer {
background: linear-gradient(90deg, #2070c1, #9d0e2b);
}
.WARNING.yt-alert-renderer {
background: linear-gradient(90deg, #2070c1, #8d8926);
}
.SUCCESS.yt-alert-renderer {
background: linear-gradient(90deg, #2070c1, #478d26);
}
.yt-alert-renderer {
border-radius: 12px;
margin: 12px;
}
yt-formatted-string.yt-alert-renderer {
color: #fff !important;
font-weight: bold;
font-size: 22px;
}
#title.ytd-hotkey-dialog-renderer {
font-weight: bold;
text-transform: none;
}
#header-text.ytd-voice-search-dialog-renderer {
color: white;
font-size: 32px;
font-family: 'YouTube Sans';
font-weight: bold;
}
#body.ytd-voice-search-dialog-renderer,
#microphone-label.ytd-voice-search-dialog-renderer {
color: white;
}
tp-yt-paper-dialog {
border-radius: 12px;
}
ytd-voice-search-dialog-renderer[dialog] {
border-radius: 12px;
background: linear-gradient(to right, #f03, #ff4081);
height: 300px;
transition: opacity 0.2s;
}
.ytp-play-progress,
.ytp-cairo-refresh-signature-moments .ytp-play-progress,
.ytp-progress-linear-live-buffer {
background: -webkit-gradient(linear, left top, right top, color-stop(80%, #f03), to(#ff2791));
background: -webkit-linear-gradient(left, #f03 80%, #ff2791 100%);
background: linear-gradient(to right, #f03 80%, #ff2791 100%);
}
html[dark] #chips-wrapper.ytd-feed-filter-chip-bar-renderer,
html[dark] #page-header-container.ytd-tabbed-page-header,
html[dark] #tabs-container.ytd-tabbed-page-header {
background: linear-gradient(180deg, rgb(15, 15, 15), rgba(15, 15, 15, 0.6));
-webkit-backdrop-filter: blur(24px);
backdrop-filter: blur(24px);
transition: opacity 0.2s;
}
html[dark] #background.ytd-masthead {
background: linear-gradient(360deg, rgb(15, 15, 15), rgba(15, 15, 15, 0.6));
-webkit-backdrop-filter: blur(24px);
backdrop-filter: blur(24px);
transition: all 0.2s;
}
[theater] #background.ytd-masthead {
background: linear-gradient(360deg, rgba(15, 15, 15, .6), rgb(15, 15, 15));
-webkit-backdrop-filter: blur(24px);
backdrop-filter: blur(24px);
transition: all 0.2s;
}
html[dark] tp-yt-paper-dialog,
html[dark] ytd-flow-root-renderer[dialog][dialog][dialog] {
background-color: #212121b3;
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
transition: opacity 0.2s;
}
[dark] ytd-modal-with-title-and-button-renderer {
background-color: #212121b3;
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
transition: opacity 0.2s;
border-radius: 22px;
}
html[dark] ytd-shorts[anchored-panel-active][small-screen-persistent-panel] {
--ytd-anchored-panel-background-color: #212121b3;
}
html ytd-shorts[anchored-panel-active][small-screen-persistent-panel] {
--ytd-anchored-panel-background-color: #ffffffb3;
}
[dark] tp-yt-paper-listbox.yt-dropdown-menu {
background: #212121b3;
backdrop-filter: blur(8px) !important;
transition: opacity 0.2s;
}
tp-yt-paper-listbox.yt-dropdown-menu {
background: #ffffffb3;
backdrop-filter: blur(8px) !important;
transition: opacity 0.2s;
}
ytd-shorts[anchored-panel-active][small-screen-persistent-panel] .anchored-panel.ytd-shorts {
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
transition: opacity 0.2s;
}
#header.ytd-item-section-renderer {
background-color: transparent !important;
}
ytd-modal-with-title-and-button-renderer {
background-color: #ffffffb3;
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
transition: opacity 0.2s;
border-radius: 22px;
}
#title.ytd-modal-with-title-and-button-renderer {
color: var(--yt-spec-text-primary);
font-size: 2rem;
font-weight: 600;
}
html tp-yt-paper-dialog,
html ytd-flow-root-renderer[dialog][dialog][dialog] {
background-color: #ffffffb3;
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
transition: opacity 0.2s;
}
html #chips-wrapper.ytd-feed-filter-chip-bar-renderer,
html #page-header-container.ytd-tabbed-page-header,
html #tabs-container.ytd-tabbed-page-header {
background: linear-gradient(180deg, #fff, #ffffffb3);
-webkit-backdrop-filter: blur(24px);
backdrop-filter: blur(24px);
transition: opacity 0.2s;
}
html #background.ytd-masthead {
background: linear-gradient(360deg, #fff, #ffffffb3);
-webkit-backdrop-filter: blur(24px);
backdrop-filter: blur(24px);
transition: all 0.2s;
}
#header.ytd-engagement-panel-title-header-renderer {
background-color: transparent;
}
ytd-engagement-panel-section-list-renderer[dialog] #content.ytd-engagement-panel-section-list-renderer {
background: transparent;
}
.subheadline.ytd-about-channel-renderer,
#sub-title.ytd-hotkey-dialog-section-renderer,
yt-dropdown-menu[modern-buttons] #label.yt-dropdown-menu,
yt-dropdown-menu[modern-buttons] #icon-label.yt-dropdown-menu {
text-transform: none;
}
html[dark] ytd-multi-page-menu-renderer,
html[dark] ytd-simple-menu-header-renderer {
background: #212121b3;
backdrop-filter: blur(16px) !important;
transition: all 0.2s;
}
html ytd-multi-page-menu-renderer,
html ytd-simple-menu-header-renderer {
background: #ffffffb3;
backdrop-filter: blur(16px) !important;
transition: all 0.2s;
}
#guide-content.ytd-app {
background: transparent;
}
.yt-spec-button-shape-next,
svg > path {
transition: all 0.2s !important;
}
.ytp-time-display,
.ytd-watch-info-text,
.animated-rolling-number-wiz,
.yt-spec-button-shape-next--size-m,
.badge-shape-wiz--thumbnail-default {
text-transform: none !important;
}
html[dark] tp-yt-iron-overlay-backdrop,
html[dark] tp-yt-iron-overlay-backdrop.opened {
background-color: #fff;
filter: blur(1.5rem) !important;
}
html[dark] ytd-shorts[anchored-panel-active][small-screen-persistent-panel] #anchored-panel-scrim.ytd-shorts,
html[dark] #scrim.tp-yt-app-drawer {
background-color: rgba(0, 0, 0, .4);
}
html ytd-shorts[anchored-panel-active][small-screen-persistent-panel] #anchored-panel-scrim.ytd-shorts,
html #scrim.tp-yt-app-drawer {
background-color: #f8f8f8b3;
backdrop-filter: blur(16px) !important;
transition: all 0.2s !important;
}
tp-yt-iron-overlay-backdrop,
tp-yt-iron-overlay-backdrop.opened {
background-color: rgb(0, 0, 0);
}
ytd-section-list-renderer:not([hide-bottom-separator]):not([page-subtype = history]):not([page-subtype = memberships-and-purchases]):not([page-subtype = ypc-offers]):not([live-chat-engagement-panel]) #contents.ytd-section-list-renderer > *.ytd-section-list-renderer:not(:last-child):not(ytd-page-introduction-renderer):not([item-dismissed]):not([has-destination-shelf-renderer]):not(ytd-minor-moment-header-renderer):not([has-section-group-view-model]) {
border-bottom: 1px solid transparent;
}
.yt-spec-button-shape-next--call-to-action.yt-spec-button-shape-next--outline[aria-label = "Sign in"],
.yt-spec-button-shape-next--overlay.yt-spec-button-shape-next--outline[aria-label = "Sign in"] {
color: #fff !important;
border-color: transparent;
background: linear-gradient(to right, #f03, #f03);
transition: all 0.2s;
}
.yt-spec-button-shape-next--call-to-action.yt-spec-button-shape-next--outline[aria-label = "Sign in"] > .yt-spec-button-shape-next__icon,
.yt-spec-button-shape-next--overlay.yt-spec-button-shape-next--outline[aria-label = "Sign in"] > .yt-spec-button-shape-next__icon {
display: none !important;
transition: all 0.2s;
}
*[d = "M12 3c-1.66 0-3 1.37-3 3.07v5.86c0 1.7 1.34 3.07 3 3.07s3-1.37 3-3.07V6.07C15 4.37 13.66 3 12 3zm6.5 9h-1c0 3.03-2.47 5.5-5.5 5.5S6.5 15.03 6.5 12h-1c0 3.24 2.39 5.93 5.5 6.41V21h2v-2.59c3.11-.48 5.5-3.17 5.5-6.41z"] {
d: path("M12 14q-1.25 0-2.125-.875T9 11V5q0-1.25.875-2.125T12 2t2.125.875T15 5v6q0 1.25-.875 2.125T12 14m-1 6v-2.075q-2.3-.325-3.937-1.95t-1.988-3.95q-.05-.425.225-.725T6 11t.713.288T7.1 12q.35 1.75 1.738 2.875T12 16q1.8 0 3.175-1.137T16.9 12q.1-.425.388-.712T18 11t.7.3t.225.725q-.35 2.275-1.975 3.925T13 17.925V20q0 .425-.288.713T12 21t-.712-.288T11 20");
}
html[dark] .ytSearchboxComponentInputBoxDark,
[theater] .ytSearchboxComponentInputBoxDark {
border-color: transparent;
background-color: hsla(0, 0%, 100%, .08);
transition: all 0.2s;
}
html[dark] .ytSearchboxComponentSearchButtonDark,
[theater] .ytSearchboxComponentSearchButtonDark {
border: 1px solid transparent;
background-color: hsla(0, 0%, 100%, .08);
transition: all 0.2s;
}
html[dark] .ytSearchboxComponentInputBoxDark.ytSearchboxComponentInputBoxHasFocus,
[theater] .ytSearchboxComponentInputBoxDark.ytSearchboxComponentInputBoxHasFocus {
border-color: transparent;
transition: all 0.2s;
}
html .ytSearchboxComponentSearchButton {
border: none;
background-color: #f8f8f8;
}
html .ytSearchboxComponentInputBox {
border-color: transparent;
background-color: #f8f8f8;
transition: all 0.2s;
box-shadow: none;
}
html .ytSearchboxComponentInputBox.ytSearchboxComponentInputBoxHasFocus {
border-color: transparent;
transition: all 0.2s;
}
#tabs-inner-container.ytd-tabbed-pa...