ScanlineSlider

ScanlineSlider is a retro CRT-styled WebGL shader slider for Framer, mixing images and video with five shader transitions and an authentic scanline look.

Every slide sits inside a dark stage with a glowing accent border and flickering scanlines, like content on an old broadcast monitor. Underneath runs a real GLSL shader engine, Glass, Frost, Ripple, Plasma, Timeshift, each with four intensity presets.

WHAT IT DOES Navigation happens through glass-style clickable dots at the bottom, no arrow buttons. An auto-fading minimap slides in from the left on navigation activity, showing thumbnails including auto-generated frames from video slides, then fades after a moment of inactivity.

KEY FEATURES

• Retro CRT stage, adjustable scanline opacity and glowing accent border

• Five WebGL shader transitions: Glass, Frost, Ripple, Plasma, Timeshift

• Four intensity presets per effect, from Subtle to extreme

• Mixed media slides, images and video in any combination

• Glass-style dot pagination, clean and arrow-free

• Auto-fading minimap with live video thumbnails

• Minimap visibility modes: Always, On Scroll, or Never

• Six cycling GSAP text reveal animations for titles and descriptions

• Adjustable corner radius and accent color to match your brand

• Numeric or roman numeral slide counter

• Performance-aware, pauses when off-screen or tab hidden

• Zero manual setup, self-contained code component

WHY IT WORKS Retro CRT effects on the marketplace are mostly static overlays. ScanlineSlider builds the look into a working shader slider, real transitions and navigation, not a filter over a flat image.

PERFECT FOR Gaming portfolios, music sites, vaporwave and 80s-inspired brands, and any Framer site wanting a nostalgic broadcast-monitor feel with shader motion.

WHAT'S INCLUDED A single drop-in component. Add up to 6 slides, mix images and video, tune scanlines, accent color, and effect through property controls.