Using Youtube Thumbnails on your Websites

I seem to find myself working with Youtubes thumbnail images quite a lot (for instance on Miniclips videos section) – and I am always having to go searching for the parameters to use to generate those thumbnail images.

The highest quality of these images is the maxresdefault.jpg image, but not all videos have these available. With that in mind I thought I would try and find out what the other parameters are and what they do.

So I made a little app to view them as you can see below:

For reference the urls are as follows:

4 Frames from Key Points in the animation

http://img.youtube.com/vi/[video-id]/0.jpg
http://img.youtube.com/vi/[video-id]/1.jpg
http://img.youtube.com/vi/[video-id]/2.jpg
http://img.youtube.com/vi/[video-id]/3.jpg

Default thumbnail (the one seen on Youtube itself)

http://img.youtube.com/vi/[video-id]/default.jpg

High Quality default image (hqdefault.jpg)

http://img.youtube.com/vi/[video-id]/hqdefault.jpg

Medium Quality default image (mqdefault.jpg)

http://img.youtube.com/vi/[video-id]/mqdefault.jpg

Standard definition thumbnail (sddefault.jpg)

http://img.youtube.com/vi/[video-id]/sddefault.jpg

The largest size thumbnail available (maxresdefault.jpg)

http://img.youtube.com/vi/[video-id]/maxresdefault.jpg

Was it good/ useful/ a load of old rubbish? Let me know on Mastodon, or BlueSky (or Twitter X if you must).

Link to this page

Thanks for reading. I'd really appreciate it if you'd link to this page if you mention it in your newsletter or on your blog.

Related Posts

19 Apr 2011

Simple WordPress Post Thumbnails with Regular Expressions

These days everyone with a blog understands the importance of thumbnail images. Three years ago it was common place to have exclusively text, but now a nice image is a requirement. As such the process of implementing the image needs...
12 Aug 2010

Using TimThumb Part 2: External Websites

Of all the TimThumb feature requests the most popular are being able to crop an image from a specified location, and being able to load images from external websites. Resizing images from external images was added at the start of...
17 May 2011

TimThumb Quality Settings

Recently I have had a couple of emails about changing the amount of compression on TimThumb cropped images. The change itself is really easy, however I thought I would write it up as a reference for those who aren’t aware...
01 Jul 2014

I No Longer Use TimThumb – Here’s What I do Instead

Last week there was a second exploit found in TimThumb. Thankfully it was no-where near as bad as the first one – but it raised an interesting question of whether TimThumb is even needed anymore.TimThumb was made to be useful...
20 Jul 2016

Empathy in Web Design

I wasn’t able to make WordCamp Europe this year, but they’ve been really quick at getting all of the talks online, and so I have been watching some of them – and this one stood out.Morten Rand-Hendriksen is an experienced...
01 Jun 2011

A Day in the Life of a Web Designer

I recently had someone email me and ask what a day in my life, or that of a web designer, was like. A slightly unusual request but I thought I would take up the challenge and document an average day.I...