Skip to content

neon ocean theme for youzeek music :3 by slurpslurpslurpslurpmmmoatmilk

Details

Authorslurpslurpslurpslurpmmmoatmilk

LicenseNo License

Categoryyouzeek.com

Created

Updated

Size5.3 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

the title says it all! this is my first style, made entirely through trial and error, so i can't garantee that it'll be perfect.

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name         neon ocean theme for youzeek music :3
@version      20231126.18.31
@namespace    ?
==/UserStyle== */

@-moz-document domain("youzeek.com") {
/* the one and only style for this website :3 
this is my first time making my own theme aaaa */



/*search bar*/

.searchbar.empty.flex.items-center {
 background: #8fc8c1!important;
}
.searchbar-container {
 background: #308790!important;
}
.searchbar {
 background: #8fc8c1!important;
}
.searchbar.flex.items-center.custom-cursor-on-hover {
 background: #8fc8c1!important;
}
.fal.fa-search {
 font-family: "Font Awesome 5 Pro"!important;
}
.fal.fa-times {
 font-family: "Font Awesome 5 Pro"!important;
}
#search .searchbar input {
 background: #8fc8c1;
 color: #083c4f;
}



/*playlist icons*/

.playlist-item-image {
 border: 1px solid white;
 box-shadow: 10px 10px 20px #d7ff80 inset, 0px 0px 10px #b7ff1b, -10px -10px 20px #083c4f inset;
 border-radius: 100px
}
.playlist-item-title {
 color: #fff!important;
 text-shadow: 0px 0px 10px #083c4f
}
.playlist-item-image:hover {
 box-shadow: 5px 5px 20px #083c4f inset, -10px -10px 20px #083c4f inset, 0px 0px 40px #b7ff1b;
 opacity: 100%!important;
 height: 160px;
 width: 160px;
 padding: 40px;
}
.category-item-title {
 color: #fff!important;
 text-shadow: 0px 0px 10px #083c4f
}
.category-item-image {
 border: 1px solid white;
 box-shadow: 10px 10px 10px #d7ff80 inset, 0px 0px 20px #b7ff1b, -10px -10px 20px #083c4f inset;
 border-radius: 100px
}
.category-item-image:hover {
 box-shadow: 5px 5px 20px #083c4f inset, -10px -10px 20px #083c4f inset, 0px 0px 40px #b7ff1b;
 opacity: 100%!important;
 height: 145px;
 width: 145px;
 padding: 40px;
}
.playlist-list-title {
 color: white;
 text-shadow: 0px 0px 20px #d7ff80;
}


/*banner*/

.flex.items-center.fh {
 background: #083c4f;
 border-bottom: 1px solid white;
 box-shadow: 0px 0px 20px #b7ff1b;
}
.menuBtn.btn.white.pl-10.pr-10.custom-cursor-on-hover {
 color: white;
}
.ml-5.custom-cursor-on-hover {
 color: white;
}
.fal.fa-search.custom-cursor-on-hover {
 color: white
}
.logoItem.pl-10fh.flex.items-center.fh.flex-grow {
 border: 0px solid transparent;
 box-shadow: 0px 0px transparent;
}
.playlist-image {
border-radius: 100%;
border: 1px solid white;
}
.playlist-header {
background: #308790!important;
border-bottom: 1px solid white;
}
.playlist-infos {
 background: #308790;
}
.fas.fa-play {
 font-family: "Font Awesome 5 Pro"!important;
 color: #308790;
}
.custom-cursor-on-hover {
 color: #308790;
}
.playlist-play {
 color: #308790!important;
}


/*user icon*/
 .p-10.btn {
 border-radius: 100px;
}


/*miniplayer*/

.ytp-iv-video-content {
 border: 1px solid white;
 border-radius: 100px!important;
}
.ytp-gradient-bottom {
 border-radius: 100px!important;
}
.html5-video-player.video-stream {
 border-radius: 100px!important;
}
.video-stream.html5-main-video {
 border-radius: 100px!important;
}


/*player*/

.flex.justify-between.pt-10.pb-10 {
 background: #083c4f!important;
}
.player-track-infos.flex.items-center {
 background: #083c4f!important;
}
.player-artist.fs-13.light-grey {
 background: #083c4f!important;
}
.player-title.fs-16 {
 background: #083c4f!important;
}
.player-slider-progress {
 background: #b7ff1b;
}
.player-slider-buffer-progress {
 background: #308790;
}
.fal.fa-plus {
 font-family: "Font Awesome 5 Pro"!important;
}
.fal.fa-step-backward {
 font-family: "Font Awesome 5 Pro"!important;
}
.fal.fa-play {
 font-family: "Font Awesome 5 Pro"!important;
}
.fal.fa-step-forward {
 font-family: "Font Awesome 5 Pro"!important;
}
.far.fa-trash-alt {
 font-family: "Font Awesome 5 Pro"!important;
 color: #d7ff80;
}
.fal.fa-spinner-third.fa-pulse {
 font-family: "Font Awesome 5 Pro"!important;
}
.fal.fa-pause {
 font-family: "Font Awesome 5 Pro"!important;
}


/*volume*/

.player-controls-volume-progress {
 background: #b7ff1b;
 color: #fff;
}
.fal.fa-volume {
 font-family: "Font Awesome 5 Pro"!important;
 color: white;
}
.fal.fa-volume-off {
 font-family: "Font Awesome 5 Pro"!important;
 color: white;
}



/*progress bar*/

.player-slider {
 background: #000;
}


/*playlist*/

.track-item-title {
 color: #fff;
 text-shadow: 0px 0px 10px #d7ff80;
}
.track-item-title:hover {
 color: #d7ff80!important;
 text-shadow: 0px 0px 20px #d7ff80;
}
.track-item.flex.items-center.pt-15.pb-15.custom-cursor-on-hover:hover {
 background: #ffffff24!important;
 box-shadow: 0px 0px 20px #d7ff80;
 .track-item-title {
 color: #d7ff80!important;
 text-shadow: 0px 0px 20px #d7ff80;
}
}
.track-item-artist {
color: #8fc8c1;
}
.track-item-infos.flex-grow {
background: transparent;
}
.track-item-nbr.pl-15.pr-15 {
color: #d7ff80;
}
.track-duration.pl-15.pr-15 {
 color: #fff;
}
.fal.fa-plus {
 color: #fff;
 text-shadow: 0px 0px 5px #d7ff80;
}


/*background*/

.flex-grow {
/*background: linear-gradient(#06273f, #4fc4c9);*/
 background-image: url("https://i.imgur.com/xmcHhzH.jpg");
 background-repeat: no-repeat;
 background-position: top;
 background-attachment: scroll;
 background-size: 100%;
}






 
 
 
 
 
 
 
 
}

Reviews

No reviews yet.