Video Text Demo

PreviousNext

Example showing text with a video background.

Docs
magicuiexample

Preview

Loading preview…
registry/example/video-text-demo.tsx
import { VideoText } from "@/registry/magicui/video-text"

export default function VideoTextDemo() {
  return (
    <div className="relative h-[200px] w-full overflow-hidden">
      <VideoText src="https://cdn.magicui.design/ocean-small.webm">
        OCEAN
      </VideoText>
    </div>
  )
}

Installation

npx shadcn@latest add @magicui/video-text-demo

Usage

import { VideoTextDemo } from "@/components/video-text-demo"
<VideoTextDemo />