Skip to content
HTML5 ReactJS Video Player Component
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

ReactJS Video

An HTML5 Video Player ReactJS Component

ReactJS Video

Originally created for but is able to be used in any web project commercial or open source.

Feel free to open pull requests with added features, or you can open a ticket if you'd like to see a feature added.

How to use

Include react and the react video library in your document, then render the component to any element you wish.

<div id="video_stage"></div>
<script type="text/javascript" src="dist/jsx/react-video.js"></script>

Pass in an options object.

var videoStage = document.getElementById('video_stage')
var videoOptions = {
  url: '',
  poster: ''
React.render(<VideoPlayer options={videoOptions} />, videoStage);


Name Type Description
url String Any video file supported by HTML5 Video Tag
poster String jpg, png


If you'd like to modify the css or jsx, you'll need to recompile the project using sass and jsx. Run these commands from the root directory:

sass --watch src/sass:dist/css

and or

jsx --watch src/ dist/


  • Volume Slider
  • Full Screen (partial support)
  • Responsive
  • Choose resolution
  • Playlists
  • Seeking, FF, RW
  • Change playback speed


  • Fri Mar 13
    • Volume slider should work in most modern browsers
  • Thu Mar 12
  • Full screen support for webkit, rest coming soon
  • video remains centered and keeps aspect ratio
You can’t perform that action at this time.