Skip to content

Latest commit

 

History

History
101 lines (81 loc) · 3.36 KB

File metadata and controls

101 lines (81 loc) · 3.36 KB

scyfin logo

Modern CSS theme for Jellyfin with support for backdrops and custom accent colors

Go to installation


Scyfin Base Theme

Jellyfin 10.11.X and above

@import url('https://cdn.jsdelivr.net/gh/loof2736/scyfin@latest/CSS/scyfin-theme.css');

Jellyfin 10.10.X and lower

@import url('https://cdn.jsdelivr.net/gh/loof2736/scyfin@v1.4.17/CSS/scyfin-theme.css');

homepage

homepage-backdrops

details

details-backdrops

movies

login


Options (Add these below the base theme)

Disable static left drawer

@import url('https://cdn.jsdelivr.net/gh/loof2736/scyfin@latest/CSS/disable-static-drawer.css');

Disable backdrops on navigation pages

This will disable backdrops on every page except the media details. Backdrops must be enabled in the client settings

@import url('https://cdn.jsdelivr.net/gh/loof2736/scyfin@latest/CSS/disable-backdrops-navigation.css');

Themes:

Seafoam

@import url('https://cdn.jsdelivr.net/gh/loof2736/scyfin@latest/CSS/theme-seafoam.css');

seafoam-theme

Coral

@import url('https://cdn.jsdelivr.net/gh/loof2736/scyfin@latest/CSS/theme-coral.css');

coral-theme

Snow

@import url('https://cdn.jsdelivr.net/gh/loof2736/scyfin@latest/CSS/theme-snow.css');

snow-theme

OLED

@import url('https://cdn.jsdelivr.net/gh/loof2736/scyfin@latest/CSS/theme-oled.css');

homepage-oled

details-oled


Installation:


Server-wide install:

  • Click the hamburger icon (Top left)
  • Navigate to "Dashboard" (If you don't see this, make sure you are signed in to your admin account)
  • Navigate to "Branding"
  • Near the bottom, under "Custom CSS code", paste the @import url for the base Scyfin theme
    • Example:
    • install-server-base
  • Optional - Paste the @import url for any options / themes you may want
    • Example:
    • install-server-options
  • Click "Save"

Single client install:

  • Click the hamburger icon (Top left)
  • Navigate to "Settings"
  • Navigate to "Display"
  • Near the middle, under "Custom CSS code", paste the @import url for the base Scyfin theme
    • Note -
      • If there is any server-wide custom CSS, you may want to enable "Disable server-provided custom CSS code", as the two themes WILL interfere with each other
    • Example:
    • install-client-base
  • Optional - Paste the @import url for any options / themes you may want
    • Example:
    • install-client-options
  • Click "Save"