- ⭐ ElegantFin Theme
- This is a Jellyfin theme inspired from Jellyseerr to improve the overall look and experience with various fixes to the UI/UX. It gives Jellyfin a fresh, modern look, and it aims to work on mobile, desktop, and TV, with just one import.
-
+
+ ElegantFin is a Jellyfin theme inspired from Jellyseerr to improve the overall look and experience with various
+ fixes
+ to the UI/UX. It gives Jellyfin a fresh, modern look, and it aims to work on mobile, desktop, and TV, with just
+ one import.
- ✨ Key Features
+ ✨ Key Features
+
- Modern layouts and color tones
- Same clean design across phone, desktop, and TV
- New and improved animations on most elements
- Rounded corners and even spacing everywhere
- Stylish borders, hover effects and shadows
- Neat layout that puts important stuff up front
- Reduced unnecessary clutter
- Various fixes to the user experience
+ modern layouts and color tones
+ new and improved animations on most elements
+ rounded corners and even spacing everywhere
+ stylish borders, hover effects and shadows
+ neat layout that puts important stuff up front
+ reduced unnecessary clutter
+ various fixes to improve the user experience
+ same clean design across phone, desktop, and TV
+
- 🖼️ Screenshots
- Captured on ElegantFin v25.07.27
+ 🖼️ Theme Showcase
+ Captured on ElegantFin v25.08.02
-
- 💻 Desktop and 📱 Mobile previews
-
-
-
-
-
Desktop - Homepage
+
+
+ 💻 Desktop
+ 📱 Mobile
+ 📺 TV View
+
+
+
+
+
+
+
+
+
+
Login Page
+
+
+
+
Homepage
+
+
+
+
Movies Library
+
+
+
+
Movie Page
+
+
+
+
Movie Details
+
+
+
+
TV Show Page
+
+
+
+
TV Episode Page
+
+
+
+
TV Show Seasons
+
+
+
+
Web Player
+
+
+
+
Cast Page
+
+
+
+
Artist Page
+
+
+
+
Music Player
+
+
+
+
Book Page
+
+
+
+
Sidebar
+
+
+
+
Extra Dialog
+
+
+
+
Settings Page
+
+
+
+
Live TV Page
+
+
+
+
Live TV Guide
+
+
-
-
-
Mobile - Homepage
+
+
-
-
-
- 📺 TV previews
-
-
-
-
TV - Homepage
+
+
+
+
+
+
+
Login Page
+
+
+
+
Homepage
+
+
+
+
Movies Library
+
+
+
+
Movie Page
+
+
+
+
Movie Details
+
+
+
+
TV Show Page
+
+
+
+
TV Episode Page
+
+
+
+
TV Show Seasons
+
+
+
+
Web Player
+
+
+
+
Cast Page
+
+
+
+
Artist Page
+
+
+
+
Music Player
+
+
+
+
Book Page
+
+
+
+
Sidebar
+
+
+
+
Extra Dialog
+
+
+
+
Settings Page
+
+
+
+
Live TV Page
+
+
+
+
Live TV Guide
+
+
+
+
-
-
+
+
+
+
+
+
+
Login Page
+
+
+
+
Homepage
+
+
+
+
Movies Library
+
+
+
+
Movie Page
+
+
+
+
Extra Dialog
+
+
+
+
Settings Page
+
+
+
+
Web Player
+
+
+
+
TV Show Page
+
+
+
+
Movie Details
+
+
+
+
Book Page
+
+
+
+
Artist Page
+
+
+
+
Music Player
+
+
+
+
TV Show Seasons
+
+
+
+
Cast Page
+
+
+
+
TV Episode Page
+
+
+
+
Live TV Page
+
+
+
+
Live TV Guide
+
+
+
+
+
+
+
+
👇 How to Install/Setup
- Paste the following in the Custom CSS code box:
- @import url("https://cdn.jsdelivr.net/gh/lscambo13/ElegantFin@main/Theme/ElegantFin-jellyfin-theme-build-latest-minified.css");
+
+
+
+ Your browser does not support the video tag.
+
+
-
- Detailed steps for server-side implementation
- Open Dashboard from Administration tab in Settings.
- Select General tab from the side bar.
- Scroll down to find Custom CSS code box under Branding section.
- Paste the custom CSS in Custom CSS code box.
- Click save.
-
-
+
- Detailed steps for client-side implementation
- Open Display tab in Settings.
- Scroll down to find Custom CSS code box.
- Paste the custom CSS in Custom CSS code box.
- Click save.
-
-
+ 👇 How to install/setup this theme?
- 🧰 Customisation Options
- Multiple details sections explaining custom background, card overlays, play button positions, hover effects, etc. can be added here. Each as a <details> with its own explanation and code snippets.
+
+
Paste the following in Custom CSS code box:
+
@import url("https://cdn.jsdelivr.net/gh/lscambo13/ElegantFin@main/Theme/ElegantFin-jellyfin-theme-build-latest-minified.css");
+
👌 Compatibility
+
+ Detailed steps for server-side implementation
+ Open Dashboard from Administration tab in Settings.
+ Select General tab from the side bar.
+ Scroll down to find Custom CSS code box under Branding section.
+ Paste the custom css in Custom CSS code box.
+ Click save
+
+
+
+
+ Detailed steps for client-side implementation
+ Open Display tab in Settings.
+ Scroll down to find Custom CSS code box.
+ Paste the custom css in Custom CSS code box.
+ Click save.
+
+
+
+ 🆗 Tested on
+
+ Jellyfin Server v10.10.6
+ Jellyfin Android App v2.6.2
+
+
+ 📌 Contributing
+ Please read the Contributor Guidelines before opening pull requests.
+
+ 🙏 Feedback Appreciated
+ Please use the right template when creating an issue to report bugs or provide
+ suggestions .
+
+
- 🙏 Feedback Appreciated
-
-
+
+ 
- 
+ 
- 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
- 
- 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+ 
+
+