Many prefer to use Jellyfin over Plex because it’s free and open-source, supports features like hardware transcoding, and runs on almost anything. Though the default Jellyfin theme is functional, it’s a bit dull to look at every day.
Fortunately, there are a good number of themes out there that you can import, and you can even have a shot at making your own.
How Jellyfin Themes Work
You can theme Jellyfin through the use of CSS, which is how websites apply different styles. Since Jellyfin presents your media for consumption using a web interface, themes are effectively just reskins of the default appearance.
The upside to this approach is that themes are lightweight, can be easily switched on the fly, and most should be reflected within the clients that you use to access your server. We tested a bunch of themes out and the new looks were immediately visible in the official Jellyfin app for iPhone (even on the login screen) and the LG webOS TV app.
Themes are community projects, and as such, they rely on community testing to discover and fix problems. Though you’re not going to “break” your Jellyfin installation by installing a theme, you may encounter a few bugs on your travels.
Because Jellyfin’s basic layout is fairly rigid, themes don’t massively change the software’s feel. The usual background images and cover art appear in the same places, but the overall color scheme and look can differ. You might notice other subtle changes like more rounded corners and a slightly different Jellyfin logo at the top of the screen.
How to Install Jellyfin Themes Manually
There are two ways to install and manage Jellyfin themes: manually or using a plugin. Both are simple, particularly given the way that theme authors make their themes readily available with a few simple lines of code. It’s a good idea to learn how to do this manually, even if you want to go ahead and install the plugin (don’t worry, you can use both methods alongside one another).
To manually install a Jellyfin theme, bring up your Jellyfin web interface and click on your user icon in the top-right corner of the screen. Under “Administration,” click on “Dashboard” to bring up the admin menu. You’ll now see a sidebar menu, under the “Server” section, click on “Branding.”
If you don’t see “Branding,” then you might be running an outdated version of Jellyfin. Try looking for the “Display” section or for better results learn how to update Jellyfin to the latest version.
You’ll see a few fields appear, including one that says “Custom CSS Code,” which is what we’ll be using. This is where you paste the import code for the theme CSS file you want to use, and any additional CSS files (like child themes or fixes for ultrawide users).
We’ll go into finding themes in a second, but in this field, you’ll be pasting some code that looks like:
@import url(' It’s not unusual to paste another line of code after this, but you should always import the main “theme.css” file first.
To remove a theme, simply delete any CSS you’ve added to this field. Any changes you make here won’t be reflected in the admin panel, but they will within the main Jellyfin interface. You’ll need to refresh the page or kill the app to see the changes.
How to Install Jellyfin Themes Using a Plugin
Alternatively, you can install and manage Jellyfin themes using the Jellyfin Skin Manager plugin. To do this, open the Jellyfin web interface, click on your name in the top-right corner of the screen, and then under “Administration” click “Dashboard.”
From the sidebar, click on “Plugins,” then click “Manage Repositories” followed by “New Repository.” Enter a name (I chose “jellyfin-skin-manager” and paste the following URL into the “Repository URL” field:
Now click on “Plugins” again in the sidebar and refresh the page. Search for “skin” and filter by “All,” and you should see the “Skin Manager” show up.
Click on it, then click “Install” and read the disclaimer. Once you’re happy you understand the risks of using third-party plugins, click “Install” again to proceed.
Now restart Jellyfin. You can do this easily if you’re using a desktop computer running Windows, macOS, or Linux by clicking on the tray icon and choosing “Restart.” If you’re running Jellyfin in a container, you’ll need to restart the container.
With Jellyfin restarted, head back to the “Plugins” page within the admin dashboard and click on Skin Manager. Click the new “Settings” button and use the drop-down to set a theme. You can also click “Custom” and set your own theme.
Essentially, all this plugin does is manage the “Custom CSS Code” box on the “Branding” page for you, applying fixes and child-themes as necessary depending on what boxes you click. You’ll notice that you only have a limited number of themes to choose from; the project could probably do with an update (it’s been about a year since any changes were made at the time of writing).
Some Themes to Get You Started
The Awesome Jellyfin project has a curated list of themes that you can browse through. There’s some overlap here between the Skin Manager plugin, but a good number of unique themes to choose from. Each has its own GitHub page, and many have subtle variations to choose from or fixes for use on specific devices.
On top of this, it’s worth taking a visit to the Jellyfin Forum’s Themes & Styles support board. Many authors use megathreads for their releases and request feedback and suggestions from the community. It’s a great place to visit if you’re having problems after installing something. You’ll find a lot of interesting projects posted here, like ZestyTheme which combines several of the community’s most successful theme projects.
Go Even Further With Your Own Themes and Branding
Fancy making your own themes? The Jellyfin project has detailed documentation about how to edit CSS with this goal in mind. You can also download and pull apart themes that others have made to see what makes them tick. You should probably wrap your head around working with modern CSS before you begin!
You can also head to the “Branding” page in the admin dashboard and add your own splash image and disclaimers to make your Jellyfin server feel a little more unique.
Jellyfin
- OS
-
Windows, Linux, macOS, Android, iOS, Fire TV, Roku OS, WebOS, Xbox,
- Price
-
Free
Jellyfin is the volunteer-built media solution that puts you in control of your media. Stream to any device from your own server, with no strings attached. Your media, your server, your way.