import {
  VeltVideoPlayer
} from '@veltdev/react';

export default function App() {

  return (
    <div>
      <VeltVideoPlayer 
        src={"http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/Sintel.mp4"} 
        darkMode={false}
        sync={true}
      />
    </div>
  );
}

1

Import VeltVideoPlayer component

Import the VeltVideoPlayer component.

import { VeltVideoPlayer} from '@veltdev/react'
2

Add src to VeltVideoPlayer

Add your video src URL to the src attribute of the VeltVideoPlayer component.

There are a few other properties:

  • darkMode - boolean to enable dark mode
  • sync - boolean to enable sync mode
<VeltVideoPlayer 
  src={"https://firebasestorage.googleapis.com/v0/b/snippyly.appspot.com/o/external%2Fvelt.mp4?alt=media&token=d8af2697-c797-4610-b886-ca510b231097"} 
  darkMode={false}
  sync={true}
/>

import {
  VeltVideoPlayer
} from '@veltdev/react';

export default function App() {

  return (
    <div>
      <VeltVideoPlayer 
        src={"http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/Sintel.mp4"} 
        darkMode={false}
        sync={true}
      />
    </div>
  );
}

Was this page helpful?

Lottie Player SetupCustom Video Player Setup