is it possible to change default html5 video skin/color

Question

Is it possible to change default html5 video player's colors or complete skin?

<video id="sampleMovie" src="HTML5Sample.mov" controls></video>

Answer 1

Yes it is, if your browser supports shadow DOM. On that case you will have selectors available to theme it on css like:

*::-webkit-media-controls-panel {
   background-color: red !important;
}

And many other pseudo attributes. To play with it, you can examine the shadow DOM on crome by enabling "Show user agent shadow DOM" on :

Developer tools -> Settings -> Preferences -> Show user agent shadow DOM

Answer 2

There's no way of re-skinning the browsers native HTML5 video controls. However, you can omit them completely (by removing the controls attribute), and implement your own controls using HTML, CSS and the HTML video API (good reference here).

There's a guide here which will get you started.