Glass Video Player

Glass Video Player

About Glass Video Player

Glass Video Player is a modern, production-ready video component for Framer with custom glassmorphic controls and flexible source support.

Use uploaded MP4/WebM files, direct video URLs, or Vimeo links and embed codes. Vimeo videos can use the custom glass controls or Vimeo’s native player controls.

Key Features

Multiple Video Sources Upload MP4/WebM files, paste a direct URL, or add a Vimeo URL or embed code.

Glassmorphism Controls Use a frosted control bar and an optional glass play circle for a clean, premium look.

Custom Center Play Button Adjust size, icon scale, roundness, offsets, colors, hover effects, shadow, and glass styling.

Appear Effects Choose Fade, Fade + Scale, Slide, or Blur to Sharp. Control direction, duration, and delay.

Autoplay on Scroll Automatically start or pause playback when the video section enters or leaves the viewport.

Picture-in-Picture Let viewers continue watching in a floating window while browsing other pages or apps. Available for HTML5 video sources.

Clean Playback Experience Includes auto-hiding controls, optional playback speed, timecodes, poster images, fullscreen mode, and frame-filling video without letterboxing.

Keyboard and Accessibility Support Use Space or K to play and pause, arrow keys to seek, M to mute, F for fullscreen, and I for Picture-in-Picture.

Perfect For

Landing page heroes, product demos, portfolios, cinematic showcases, video reels, case studies, and editorial content.

How to Use

  1. Drop Glass Video Player onto your canvas.

  2. Upload a video or paste a direct URL, Vimeo URL, or embed code.

  3. Add an optional poster image.

  4. Customize the controls, center play button, and appear effect.

  5. Publish.