Elevate your website's media experience with the Modern Frosted Video. Unlike the default browser video player, this component offers a fully customizable, aesthetic interface designed to blend seamlessly with modern web designs.
It features a beautiful "frosted glass" control bar that fades away when not in use. Beyond looks, it is packed with advanced functionality including drag-to-seek, volume sliders, playback speed control (0.5x to 2x), and Picture-in-Picture mode, giving your users complete control over their viewing experience.
Key Features:
💎 Glassmorphism UI: Customizable blur and opacity for a premium, native-app feel.
⏩ Speed Control: Built-in menu to adjust playback speed from 0.5x up to 2x.
🖼️ Picture-in-Picture: Allows users to float the video while scrolling or switching tabs.
🎛️ Smart Controls: Custom progress bar with buffer visualization and smooth volume slider.
How to Use
Insert: Drag the component onto your canvas.
Source: Upload your Video file (MP4/WebM) and a Poster image (thumbnail shown before play).
Styling: Adjust the Glass Blur and Glass Opacity to fine-tune the control bar's background. Set the Accent Color for the progress bar and icons.
Behavior: Toggle Autoplay, Loop, or Muted based on your needs (e.g., mute autoplay for hero backgrounds).
Controls: Keep Native Controls set to "Custom" (Off) to use the glass UI, or switch it to "Show" if you prefer the default browser controls.
Elevate your website's media experience with the Modern Frosted Video. Unlike the default browser video player, this component offers a fully customizable, aesthetic interface designed to blend seamlessly with modern web designs.
It features a beautiful "frosted glass" control bar that fades away when not in use. Beyond looks, it is packed with advanced functionality including drag-to-seek, volume sliders, playback speed control (0.5x to 2x), and Picture-in-Picture mode, giving your users complete control over their viewing experience.
Key Features:
💎 Glassmorphism UI: Customizable blur and opacity for a premium, native-app feel.
⏩ Speed Control: Built-in menu to adjust playback speed from 0.5x up to 2x.
🖼️ Picture-in-Picture: Allows users to float the video while scrolling or switching tabs.
🎛️ Smart Controls: Custom progress bar with buffer visualization and smooth volume slider.
How to Use
Insert: Drag the component onto your canvas.
Source: Upload your Video file (MP4/WebM) and a Poster image (thumbnail shown before play).
Styling: Adjust the Glass Blur and Glass Opacity to fine-tune the control bar's background. Set the Accent Color for the progress bar and icons.
Behavior: Toggle Autoplay, Loop, or Muted based on your needs (e.g., mute autoplay for hero backgrounds).
Controls: Keep Native Controls set to "Custom" (Off) to use the glass UI, or switch it to "Show" if you prefer the default browser controls.
Alpheratz
