![Logo](https://github.com/JamsRepos/Jamfin/raw/main/assets/logo.png)
( About - Screenshots )
This project brings a modern, sleek glassmorphism design to Jellyfin, enhancing your media server's aesthetics. The theme is designed to be modular and compact, allowing server owners to easily customize their Jellyfin experience.
You can find our plug-and-play modules in the modules folder. Each module's folder contains an explanation of its purpose and detailed instructions on how to use it.
The following line includes the base theme as well as all our optional modules. This is what our screenshots are based off.
@import url("https://cdn.jsdelivr.net/gh/JamsRepos/Jamfin@latest/theme/complete.css");
If you just want the theme without all our modules integrated, simply copy this line instead. Feel free to add the modules seperately.
@import url("https://cdn.jsdelivr.net/gh/JamsRepos/Jamfin@latest/theme/base.css");
Locate the Custom CSS code
option under your General settings in the admin panel and simply paste one of the lines above within the box.
If you wish to just install this for yourself only, you can do so by going to your users Display settings and copy the following settings.
- Disable server-provided custom CSS code
Then enter the theme into the Custom CSS code
option and save your settings.
Not sure if you like our colour scheme? No worries, we allow easy access to our themes colours. Paste these below your import and customise away!
:root {
/* Colours */
--theme-background-colour: #101010;
--theme-sidebar-background-colour: #222222;
--theme-menu-background-colour: #3a3a3a80;
--theme-menu-shadow-colour: #fff3;
--theme-base-colour: #696969;
--theme--hover-colour: #dbdbdb;
--theme-restart-colour: #da87287e;
--theme-shutdown-colour: #c21c1c9d;
--theme-progress-bar-colour: #cfcfcf;
--theme-progress-bar-background-colour: #2c2c2c;
--theme-progress-bar-transcoding-colour: #eb7e25;
/* General Appearance */
--theme-roundness: .75rem;
--theme-blur: 16px;
}
You will find these within the respective modules folder, to cause less confusion they are excluded out of this example.
![Home Page](https://github.com/JamsRepos/Jamfin/raw/main/assets/screenshots/home.jpg)
![Details Page](https://github.com/JamsRepos/Jamfin/raw/main/assets/screenshots/details.jpg)
![Details Page](https://github.com/JamsRepos/Jamfin/raw/main/assets/screenshots/library.jpg)
![Admin Page](https://github.com/JamsRepos/Jamfin/raw/main/assets/screenshots/admin.jpg)
Special thanks to Scyfin for design inspiration.