jellyskin-mod-public

Assets for my jellyfin instance

@import url("https://git.levi.land/Levi/jellyskin-mod-public/raw/branch/main/JellySkin-mod.css");
@import url("https://git.levi.land/Levi/jellyskin-mod-public/raw/branch/main/wll-fonts.css");

Note that these modifications are highly personalized and should not be applied as-is to any Jellyfin instance. As a starting point I recommend applying JellySkin to your instance and then adding snippets from JellySkin-mod.css to your Jellyfin instance one by one, for example:

https://jellyfin.example.com > Sidebar Menu > Dashboard > General > Custom CSS code:

@import url("https://cdn.jsdelivr.net/npm/jellyskin@latest/dist/main.css");
@import url("https://cdn.jsdelivr.net/npm/jellyskin@latest/dist/logo.css");
@import url("https://cdn.jsdelivr.net/gh/prayag17/Jellyfin-Icons/Font%20Awesome/light.css");

/* Add snippets below this line */

/*--Color Scheme Overrides--*/

:root {
	--accent1-light: hsl(349, 100%, 80%);
	--accent1-dark: hsl(349, 46%, 58%);
	--accent1-light-opacity1: hsla(349, 100%, 80%, 0.4);
	--accent1-light-opacity0-2: hsla(349, 100%, 80%, 0.2);
	--accent2-light: hsl(348, 100%, 71%);
	--accent2-dark: hsl(348, 50%, 50%);
	--accent2-superdark: hsl(348, 58%, 23%);
	--swiper-theme-color: hsl(351, 100%, 70%);
}

/*--Backdrop--*/

.backdropContainer {
	filter: blur(6px) brightness(50%) saturate(100%) !important;
	mask-image: linear-gradient(180deg, black, transparent) !important;
	-webkit-mask-image: linear-gradient(180deg, black, hsla(0, 0%, 0%, 0.6)) !important;
}

/* etc. */

Credits

• Jellyfin
• JellySkin