Video Converter

Converts any Video to WebM, OGV or MP4

recently used by

Browse video files
Drop Video here

What quality would you like?

For website background videos aim for ~4 MB files.

Generate Preview
don't preview, just convert with above settings

No Software to install

Complete online service. Just upload your file.

WebM - MP4 - OGV.

Your choice. To make your vids play in most Browsers

MP4 Quick start

We'll move metadata to file head. Lets video play before whole file downloaded.

10 ways to Upload

From your computer, phone, Google Drive, Box, Gmail and other distractive technologies.

Big files possible

Up to 4 GB. Free for files smaller than 30 MB.

No Sign up needed

If you don't have time fo dat. And will not ask for your E-Mail.

Good for Web Video Backgrounds

And we can resize your video to 800px wide if you want.

Upload then Download

Upload your video to start the conversion. Once completed, you can download the converted file(s)

Virus free

No viruses will be inserted into your files.

Ad Free

F%&k ads.

Leave a comment

How to use HTML5 Background Videos in your website:

In order to use background videos, you'd ideally supply them in 3 versions. Those are MP4, OGV and WEBM. OGV is not really necessary though, unless you want to support the old Browsers Firefox 3.5 & 3.6, Opera 10.5 and Chrome 3, 4, & 5.

Don't let your Video be too big. Aim for a maximum filesize of 4 MB.

You would be using a HTML5 video tag like so

<video autoplay loop muted poster="media/image/road.jpg" id="background">
   <source src="media/video/road.mp4" type="video/mp4">
   <source src="media/video/road.webm" type="video/webm">
   <source src="media/video/road.ogv" type="video/ogg">
</video>

The above code also sets a poster. That is shown while the video loads or in browsers that can't play the video. To create a video poster, you could play the video on your computer, pause it and use shift + command + 4 (MAC). On Windows you could use the standard Snipping Tool.

And then you'd format this with CSS:

#background {
   display:none;
   position: fixed;
   top: 50%;
   left: 50%;
   min-width: 100%;
   min-height: 100%;
   width: auto;
   height: auto;
   z-index: -100;
   -webkit-transform: translateX(-50%) translateY(-50%);
   transform: translateX(-50%) translateY(-50%);
}

But we show that background video only on larger devices. Because on mobile phones background video may take up too many system resources. So we add this media query (replace the min-width: 62em with a value from your own css framework if you like)

@media (min-width: 62em) {
   #background {
      display:block;
   }
}