Sprite Video ASCII converts video into a live ASCII render using WebGL in Framer. It is designed for hero sections, ambient backgrounds, retro interfaces, and interactive visual experiments where motion needs a distinctive terminal-style look.
Real-Time ASCII Rendering Convert moving video into animated ASCII output directly inside Framer with responsive sizing and live property control updates.
Flexible Source Input Use either Framer-uploaded files or direct .mp4, .webm, .ogg, or .mov URLs that allow cross-origin access.
Advanced Visual Controls Tune density, character ramps, brightness, contrast, saturation, background color, fit mode, and color treatment for very different moods.
True Color Mode Preserve source color in the ASCII output with an adjustable color boost slider for more vivid results.
Retro Scanline Overlay Layer in CRT-inspired scanlines with adjustable opacity and spacing for a stronger analog display feel.
Playback and Quality Controls Control speed, loop, autoplay, and rendering quality to balance look and performance across devices.
Hero Sections - Build instantly memorable landing pages with animated ASCII motion graphics.
Portfolio Websites - Give personal or studio sites a technical, experimental visual identity.
Music and Fashion Promos - Reframe short clips into stylized editorial backgrounds.
Retro UI Concepts - Create terminal, CRT, and cyber-inspired interfaces with live motion.
Source: Toggle between Upload and URL modes
Video File: Upload MP4, WebM, OGG, or MOV files
Video URL: Use a direct video file URL with CORS enabled
Visual: Group containing Density, Characters, Color, Background, Fit, Brightness, Contrast, Saturation, Invert, True Color, Color Boost, Scanlines, Line Opacity, and Line Spacing
Playback: Group containing Speed, Loop, and Autoplay
Quality: Auto, Performance, Balanced, and Quality modes
YouTube and Vimeo page or embed URLs are not supported for ASCII frame sampling
URL mode requires a direct video file URL, not a page link
External video hosts must allow cross-origin access or the browser will block frame reading
Configure the source and styling to match the project.
Source Settings
Upload a local video into Framer for the most reliable result
Or paste a direct video file URL from a CORS-enabled CDN
Visual Settings
Increase density for more detail
Change the character ramp for different texture styles
Use Fit controls to contain, cover, or stretch the source
Fine-tune Brightness, Contrast, and Saturation before ASCII conversion
Enable True Color for full-color ASCII or keep a single-color look for classic terminal styling
Add scanlines and control their opacity and spacing
Single Use License - Use in one client project with full commercial rights. No redistribution. 1 license = 1 client.
Due to the nature of our digital products, we are unable to offer refunds, but we're here to assist you with any questions or concerns!
1.1.0
FramerHub.io 
