Liquid Glass theme for PeerTube 7.3+ (CSS-only)

CSS 100%

Find a file

ekaii 89c91b98a5 Initial snapshot: Liquid Glass theme for PeerTube 7.3+ (CSS-only)		2026-07-15 01:38:36 +02:00
assets	Initial snapshot: Liquid Glass theme for PeerTube 7.3+ (CSS-only)	2026-07-15 01:38:36 +02:00
LICENSE	Initial snapshot: Liquid Glass theme for PeerTube 7.3+ (CSS-only)	2026-07-15 01:38:36 +02:00
package.json	Initial snapshot: Liquid Glass theme for PeerTube 7.3+ (CSS-only)	2026-07-15 01:38:36 +02:00
README.md	Initial snapshot: Liquid Glass theme for PeerTube 7.3+ (CSS-only)	2026-07-15 01:38:36 +02:00

README.md

peertube-theme-liquid-glass

An Apple-2026 "Liquid Glass" material theme for PeerTube 7.3+ — translucent layered surfaces, specular edge highlights, continuous (squircle) corner radii, dark-first. CSS-only, no client scripts.

Design goals

Update-resilient. The core of the theme re-points PeerTube's documented v7.3 CSS variables (the stable public contract from client/src/sass/include/_variables.scss); PeerTube auto-derives the gradient shades. Class-targeted rules that touch Angular components are flagged inline and degrade gracefully — they only ever add material, never hide content.
The real glass material — backdrop-filter blur + saturate + brightness, layered translucent gradients, a multi-layer specular rim, and a faint CSP-safe inline-SVG grain — is applied to the few stable chrome wrappers (header, menu, video-info, modals, player overlay).
Progressive enhancement. @supports gates every advanced feature; there is a solid opaque fallback where backdrop-filter is unavailable and a prefers-reduced-transparency opaque path for accessibility. An optional Chromium-only true-refraction (feDisplacementMap) hook is left dormant.

Install

Upload/enable it like any PeerTube theme (it is a standard theme plugin — package.json + assets/liquid-glass.css). Requires PeerTube >= 7.3.0.

License

AGPL-3.0 — see LICENSE.