Video Player Components

Dev Design Library indexes 27 video player components from 18 open-source UI libraries, with the most coming from Cult UI, Pixel Perfect, Magic UI, cnblocks and Animations (Svelte). Each one links to its page with the source code, a live preview where available, the library license and the install command. Video player components belong to the Media group.

• Hero Video DialogMagic UI · ReactA hero video dialog component.
• Bg MediaCult UI · ReactBackground media component with video/image support and overlay effects
• VideoLobe UI · ReactVideo component for displaying video content with customizable controls, preview mode, and various styles. It supports…
• Aspect Ratio 04 - Video ThumbnailShadcn Space · ReactA 16:9 video thumbnail with a play button overlay and duration badge.
• Cd Envelope PlayerPixel Perfect · ReactA CD slides out of a paper sleeve and spins up into a now-playing card — grooved disc, moving sheen and a play/pause…
• Corner Videouselayouts · ReactA compact corner video player with smooth open/close morphing, autoplay, mute, enlarge, hover controls, and video…
• Filmstrip ScrubberKinetics · HTML/CSSA playhead snaps to the frame nearest the pointer
• Hero Eightcnblocks · SvelteHero with video background and overlay
• Hero Video DialogAnimations (Svelte) · SvelteA video dialog component with animated entrance effects, thumbnail support, and customizable animation styles.
• Floating ViewerSona UI · ReactAn in-page media surface that automatically or manually detaches, stays within viewport bounds, snaps to a corner, and…
• Mobile Video PlayerWatermelon UI · React
• Video playerHextaUI · ReactA video player with a scrubbable seek bar, auto-hiding controls, keyboard shortcuts, speed, picture in picture and…
• Live Tracker BlockLocalMode · ReactReal-time MediaPipe streaming trackers on live webcam video — one 4-mode block: Hands (21-point skeleton +…
• Webgl VideoAtelier UI · React
• Video PlayerSora UI · ReactDependency-free custom video player: modal overlay, chaptered timeline, hover-scrub preview, speed menu…
• Synt X Hardware Media PlayerCue Foundations · React
• TikTok Post MockupReactFrame · ReactA full-bleed 9:16 TikTok feed mockup with a Following/For You tab bar, a side action rail (like/comment/save/share)…
• Webcam Pixel GridAceternity UI · React
• Video TextMagic UI · ReactA component that displays text with a video playing in the background.
• Hover Video PlayerCult UI · ReactVideo player component that plays on hover with smooth animations
• Hover Expand PlayerPixel Perfect · ReactA compact player pill that springs open on hover — the corners morph, the album art grows into place, and the full…
• Testimonial Sixcnblocks · SvelteTestimonial with video embed
• Video TextAnimations (Svelte) · SvelteA component that displays video content masked by text, creating a text-shaped video effect with customizable…
• Video CanvasLocalMode · ReactA mirrored 16:9 webcam surface — a video element with a pixel-aligned transparent canvas overlay for landmark /…
• Video Glow LightboxReactFrame · ReactA single video card with a pulsing glow-blob frame that morphs into a fullscreen lightbox on click, supports direct…
• Youtube Video PlayerCult UI · ReactYouTube video player component with custom controls and smooth animations
• Text VideoPixel Perfect · ReactVideo masked text effect.

Libraries with video player components

• Cult UI
• Pixel Perfect
• Magic UI
• cnblocks
• Animations (Svelte)

Related categories

• React Video Player Components
• Tailwind CSS Video Player Components
• Animated Video Player Components
• Media Components
• Icon Components
• Image Components
• Gallery Components
• Logo Components
• Illustration Components
• Mockup Components
• Animated Icon Components
• Audio Visualizer Components
• Scene 3D Components
• QR Code Components
• Icon Set Components
• Audio Player Components
• Image Zoom Components
• Image Compare Components
• Model Viewer Components