Skip to main content
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>
  );
}

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Video Player documentation</title>
  </head>
  <body>
    <!-- dark-mode="false" - to disable dark mode -->
    <!-- sync="true" - to enable sync mode -->
    <velt-video-player 
        src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/Sintel.mp4"
        dark-mode="false"
        sync="true"
    >
    </velt-video-player>
  </body>
</html>