---
title: "Fluid Video Lightbox — Free Framer component · Best of Framer"
description: "Free Framer component · by Daniyal Habib · Players. Fluid Video Lightbox is a smooth expandable video component for Framer that lets users preview a video inline, then open…"
canonical: "https://framer.elliotli.dev/component/fluid-video-lightbox"
---

[Home](/)/[Components](/components)/[Players](/components/category/players)/Fluid Video Lightbox

# Fluid Video Lightbox

CMS-ready expandable video lightbox

[View on Framer](https://framer.com/marketplace/components/fluid-video-lightbox/?via=elliot-li)

![Fluid Video Lightbox preview image 1](https://framer.elliotli.dev/og/component/fluid-video-lightbox/e6748252791c3a8e/1600x1200.jpg)

## Summary

Fluid Video Lightbox is a smooth expandable video component for Framer that lets users preview a video inline, then open it in a cinematic fullscreen lightbox with one click.

## Description

## Fluid Video Lightbox

Fluid Video Lightbox is a smooth expandable video component for Framer that lets users preview a video inline, then open it in a cinematic fullscreen lightbox with one click.

It creates a polished viewing experience using Framer Motion layout transitions. The video morphs naturally from its original position into an overlay lightbox, preserving context and making interactions feel premium.

Built for both regular pages and CMS collections, it’s ideal for showcasing reels, project demos, case study videos, product showcases, testimonials, and storytelling websites.

Whether you're using uploaded videos or CMS-linked video URLs, it adapts cleanly across layouts and screen sizes.

Features

## Expandable Lightbox Experience

-   Click to open fullscreen video
    
-   Smooth morph transition
    
-   Elegant overlay animation
    
-   Escape key close support
    
-   Click outside to close
    

## CMS Ready

-   Works inside CMS collections
    
-   Supports CMS video fields
    
-   Supports CMS poster fields
    
-   Great for portfolio systems
    
-   Ideal for case studies and blogs
    

## Flexible Video Source

-   Upload local video files
    
-   Use direct video URLs
    
-   Works with MP4 and WebM
    
-   Easy switching between source types
    

## Playback Controls

-   Start from custom timestamp
    
-   Auto play preview
    
-   Loop toggle
    
-   Mute toggle
    
-   Native controls toggle
    

## Lightbox Settings

-   Adjustable max width
    
-   Adjustable max height
    
-   Backdrop color control
    
-   Z-index control
    
-   Scroll locking
    

Property Controls

## Source

-   Source Type
    
-   Video URL
    
-   Upload File
    

## Preview

-   Poster toggle
    
-   Poster image
    
-   Start time
    
-   Auto play
    
-   Loop
    
-   Muted
    

## Styling

-   Background
    
-   Border Radius
    
-   Object Fit
    

## Lightbox

-   Backdrop Color
    
-   Max Width
    
-   Max Height
    
-   Z-Index
    
-   Lock Scroll
    

## Motion

-   Transition controls
    

How to Use

## Setup

-   After copying the component, paste it onto your canvas.
    
-   Put it either in a regular layer or in a CMS layer.
    
-   Add the video file via direct link or file upload.
    
-   Tweak the lightbox settings.
    
-   That’s it.
    

## Final Step

-   Preview the page.
    
-   Click the video.
    
-   Enjoy a premium expandable lightbox experience.
    

For any confusion or feature request, contact: [**daniyalhundred@gmail.com**](mailto:daniyalhundred@gmail.com)I usually respond within **10 minutes**.

Best for

-   Portfolio websites
    
-   CMS case studies
    
-   Creative agencies
    
-   Product demos
    
-   Reel showcases
    
-   Video testimonials
    
-   Blog posts
    
-   Presentation websites
    

Fluid Video Lightbox helps present video content in a much cleaner and more immersive way — without extra setup, custom code, or external integrations.

## Rank history [How rankings work →](/terms#rankings)

-   All · #566

## Details

- **Author**: Daniyal Habib
- **Published**: 2026-05-31
- **Updated**: 2026-05-30
- **Added**: 2026-05-16
- **Categories**: Players

## More like this

-   [Cozy Video Card](/component/cozy-video-card) — 日香理 / hikari · $1 — A cozy card for your YouTube video
-   [A/B Audio Player Pro](/component/a-b-audio-player-pro) — Injamul Haque Somrat · $24 — Master Audio Comparison Player
-   [Reelflow](/component/reelflow) — Quaders · Free — An auto video ticker for reels
-   [Mux Video](/component/mux-video) — NorthGarden · $3 — Drop Mux video into any Framer site with full control over playback, UI, and interaction.
