Skip to content

Instantly share code, notes, and snippets.

@padurets

padurets/Dark Mode CSS Filter for SeaFile (or Any Website).md

Last active January 20, 2025 04:55
Show Gist options
  • Save padurets/a01ad21fc508cc4672bfb9717060c2d5 to your computer and use it in GitHub Desktop.
Save padurets/a01ad21fc508cc4672bfb9717060c2d5 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Dark Mode CSS Filter for SeaFile (or Any Website).md

Dark Mode CSS Filter for SeaFile (or Any Website)

html:not(:has(iframe)) {
  filter: invert(1) hue-rotate(180deg) brightness(0.92) contrast(0.85);
}

img, video {
  filter: invert(1) hue-rotate(180deg) brightness(1) contrast(1) !important;
}

This CSS snippet is designed to quickly enable a dark mode effect for websites like SeaFile, but it can easily be applied to any site. It uses CSS filters to invert colors, adjust hues for a natural look, and reduce brightness and contrast for a more comfortable viewing experience.

Key Features:

  • Inversion: Converts light mode to dark mode using invert(1) and hue-rotate(180deg).
  • Brightness Adjustment: Reduces brightness slightly to ease eye strain.
  • Contrast Adjustment: Softens the contrast for better visuals.
  • Image and Video Handling: Ensures media elements retain their natural appearance with specific filters.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment