Resize Image for YouTube Thumbnail — Exact 1280×720 in Seconds

YouTube thumbnails live or die at one exact size: 1280 × 720 pixels. Upload a file in any other shape and YouTube stretches it, crops it or letterboxes it with black bars — and a distorted thumbnail quietly kills your click-through rate. This free tool is preset to 1280×720 the moment it opens. Drop in a photo, a frame grab from your video, or artwork from any editor, choose how it should fit, and download a thumbnail that lands pixel-perfect in the upload box.

Everything happens inside your browser. Your image is never uploaded to a server, there is no watermark, no sign-up and no daily limit. JPG export at 90% quality keeps a 1280×720 thumbnail far below YouTube’s 2 MB ceiling, so the file you download is the file you can upload straight away.

The exact YouTube thumbnail specification

YouTube’s own help pages give a short, strict recipe for custom thumbnails. The image should be 1280 × 720 pixels with a 16:9 aspect ratio, a minimum width of 640 pixels, and a file size of 2 MB or less in JPG, PNG, GIF or BMP format. This tool exports JPG, PNG and WebP; for YouTube, JPG is the practical choice because a photographic 1280×720 JPG at 90% quality is usually 150–400 KB — comfortably under the limit with no visible quality loss. One more practical point: custom thumbnails require a verified YouTube account (a one-time phone verification in YouTube Studio), which is separate from this resizing step.

Fill, fit or stretch: which mode for a thumbnail?

Most source images are not 16:9, so how the tool maps your picture onto 1280×720 matters. Fill scales the image until the frame is covered and crops the overflow — a 4:3 photo (say 4000×3000) becomes a 1280×720 thumbnail taken from a 4000×2250 band of the original. Nothing is distorted, which is why Fill is the default for photos and video stills. Fit shows the whole image and fills the empty sides with a background colour you pick — the right choice for logos, slides or artwork you cannot crop. Stretch forces the exact pixels by distorting the picture; faces and circles give it away instantly, so use it only for abstract backgrounds.

Design rules that make 1280×720 actually work

Resizing is only half the job. Viewers mostly meet your thumbnail at a fraction of its real size — in the sidebar, on a phone feed, inside search results — so design for the small version. Keep text to three or four huge words, or none. Use one strong face or one bold object, not a busy scene. Push contrast: bright subject, darker edges, a saturated accent colour your channel reuses so subscribers recognise you while scrolling. And keep critical content out of the bottom-right corner, because that is where YouTube paints the video-duration badge; text hiding under “12:47” might as well not exist.

A quick worked example

Say your camera gives you a 6000×4000 still (3:2). Choose Fill and the tool scales it so both dimensions cover the frame — to 1280×853 — then centre-crops the height to exactly 720, using a 6000×3375 band of the original. Your subject survives untouched if it sits near the middle of the frame; if the action is at the very top or bottom, switch to Fit with a background colour that matches your channel branding, or crop the original roughly to 16:9 first with our image cropper and then finish here. Either way, the downloaded file is ready to drop into YouTube Studio’s thumbnail slot with no further editing.

Not the same as channel art or Shorts

Two neighbours cause endless confusion. Your channel banner is a different beast entirely — 2560×1440 with a small safe area in the middle — and resizing a thumbnail will not make one. And Shorts do not take custom uploads in the same way: you choose a frame from the video inside the YouTube app, so the 16:9 craft on this page applies to long-form videos, premieres and live-stream VODs. Keep the jobs separate — banner for the channel page, 1280×720 from this tool for every video — and neither will ever come back cropped, stretched or rejected for size.

Related tools

Resize Image to 1920×1080 · Instagram Resizer · Versión en español: Redimensionar para Miniatura de YouTube · Online Image Resizer Tool.

Embed this tool on your website — free

Copy the code below to add this working tool to your own page. A small credit link stays with it — that’s all we ask.

<iframe srcdoc="&lt;!DOCTYPE html&gt; &lt;html lang=&quot;en&quot;&gt; &lt;head&gt; &lt;meta charset=&quot;UTF-8&quot;&gt; &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt; &lt;title&gt;Resize Image for YouTube Thumbnail&lt;/title&gt; &lt;style&gt; body{font-family:Arial,sans-serif;background-color:#f4f4f9;padding:16px;margin:0} .container{background:#fff;padding:20px;border-radius:8px;box-shadow:0 0 10px rgba(0,0,0,.1);max-width:680px;margin:0 auto} h2{margin:0 0 6px;color:#0f3d3e;font-size:22px} p.sub{margin:0 0 14px;color:#555;font-size:14px} label{font-weight:600;font-size:14px;display:block;margin:10px 0 4px} input[type=text],input[type=number],select{width:100%;box-sizing:border-box;padding:11px;font-size:16px;border:1px solid #cbd5e1;border-radius:6px;background:#fff} .row{display:flex;gap:10px;flex-wrap:wrap} .row&gt;*{flex:1;min-width:140px} button{background:#0f766e;color:#fff;border:0;padding:11px 22px;font-size:16px;border-radius:6px;cursor:pointer;margin-top:12px} button:hover{background:#115e59} button:disabled{background:#94a3b8;cursor:wait} #status{font-size:13px;color:#666;margin-top:10px;min-height:16px} .err{color:#b91c1c} .card{border:1px solid #e2e8f0;border-radius:8px;padding:12px 14px;margin-top:12px;background:#f8fafc} .big{font-size:26px;font-weight:700;color:#0f3d3e} table{width:100%;border-collapse:collapse;margin-top:10px;font-size:14px} th,td{text-align:left;padding:7px 8px;border-bottom:1px solid #e2e8f0} th{color:#0f3d3e} .bar{height:10px;background:#e2e8f0;border-radius:5px;overflow:hidden} .bar&gt;i{display:block;height:100%;background:#0f766e} img.cover{max-width:120px;border-radius:6px} &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;div class=&quot;container&quot;&gt; &lt;h2&gt;Resize Image for YouTube Thumbnail&lt;/h2&gt; &lt;p class=&quot;sub&quot;&gt;Preset loaded: 1280 × 720 px, the exact YouTube thumbnail size. Upload any photo or artwork and export a thumbnail that fits perfectly.&lt;/p&gt; &lt;label&gt;1. Choose your image&lt;/label&gt; &lt;input type=&quot;file&quot; id=&quot;file&quot; accept=&quot;image/*&quot;&gt; &lt;div id=&quot;meta&quot; class=&quot;card&quot; style=&quot;display:none&quot;&gt;&lt;/div&gt; &lt;label&gt;2. Pick a size (or type your own below)&lt;/label&gt; &lt;div id=&quot;chips&quot;&gt;&lt;/div&gt; &lt;div class=&quot;row&quot;&gt; &lt;div&gt;&lt;label&gt;Width (px)&lt;/label&gt;&lt;input type=&quot;number&quot; id=&quot;w&quot; min=&quot;1&quot; max=&quot;12000&quot;&gt;&lt;/div&gt; &lt;div&gt;&lt;label&gt;Height (px)&lt;/label&gt;&lt;input type=&quot;number&quot; id=&quot;h&quot; min=&quot;1&quot; max=&quot;12000&quot;&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class=&quot;row&quot;&gt; &lt;div&gt;&lt;label&gt;How the image fits&lt;/label&gt;&lt;select id=&quot;mode&quot;&gt; &lt;option value=&quot;fill&quot;&gt;Fill — crop to cover the whole frame&lt;/option&gt; &lt;option value=&quot;fit&quot;&gt;Fit — whole image, bars if needed&lt;/option&gt; &lt;option value=&quot;stretch&quot;&gt;Stretch — force exact size (may distort)&lt;/option&gt; &lt;/select&gt;&lt;/div&gt; &lt;div&gt;&lt;label&gt;Bar / background colour (Fit mode)&lt;/label&gt;&lt;select id=&quot;bg&quot;&gt; &lt;option value=&quot;#ffffff&quot;&gt;White&lt;/option&gt; &lt;option value=&quot;#000000&quot;&gt;Black&lt;/option&gt; &lt;option value=&quot;transparent&quot;&gt;Transparent (PNG / WebP)&lt;/option&gt; &lt;/select&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class=&quot;row&quot;&gt; &lt;div&gt;&lt;label&gt;Download format&lt;/label&gt;&lt;select id=&quot;fmt&quot;&gt; &lt;option value=&quot;image/jpeg&quot;&gt;JPG&lt;/option&gt; &lt;option value=&quot;image/png&quot;&gt;PNG&lt;/option&gt; &lt;option value=&quot;image/webp&quot;&gt;WebP&lt;/option&gt; &lt;/select&gt;&lt;/div&gt; &lt;div&gt;&lt;label&gt;Quality % (JPG / WebP)&lt;/label&gt;&lt;input type=&quot;number&quot; id=&quot;q&quot; min=&quot;30&quot; max=&quot;100&quot; value=&quot;90&quot;&gt;&lt;/div&gt; &lt;/div&gt; &lt;button id=&quot;go&quot; disabled&gt;Resize &amp; preview&lt;/button&gt; &lt;div id=&quot;status&quot;&gt;&lt;/div&gt; &lt;div id=&quot;out&quot; style=&quot;margin-top:12px&quot;&gt;&lt;/div&gt; &lt;/div&gt; &lt;script&gt; function sendH(){ try { parent.postMessage({wpcId: 6426, wpcH: document.body.scrollHeight + 16}, &#x27;*&#x27;); } catch (e) {} } window.addEventListener(&#x27;load&#x27;, sendH); window.addEventListener(&#x27;resize&#x27;, sendH); var T = {&quot;upload&quot;: &quot;1. Choose your image&quot;, &quot;preset&quot;: &quot;2. Pick a size (or type your own below)&quot;, &quot;width&quot;: &quot;Width (px)&quot;, &quot;height&quot;: &quot;Height (px)&quot;, &quot;mode&quot;: &quot;How the image fits&quot;, &quot;fill&quot;: &quot;Fill — crop to cover the whole frame&quot;, &quot;fit&quot;: &quot;Fit — whole image, bars if needed&quot;, &quot;stretch&quot;: &quot;Stretch — force exact size (may distort)&quot;, &quot;bg&quot;: &quot;Bar / background colour (Fit mode)&quot;, &quot;white&quot;: &quot;White&quot;, &quot;black&quot;: &quot;Black&quot;, &quot;transparent&quot;: &quot;Transparent (PNG / WebP)&quot;, &quot;format&quot;: &quot;Download format&quot;, &quot;quality&quot;: &quot;Quality % (JPG / WebP)&quot;, &quot;go&quot;: &quot;Resize &amp; preview&quot;, &quot;meta&quot;: &quot;Original image: {w} × {h} px&quot;, &quot;done&quot;: &quot;Done: {w} × {h} px, about {kb} KB.&quot;, &quot;dl&quot;: &quot;Download&quot;, &quot;err&quot;: &quot;Something went wrong — try a different format.&quot;}; //__CORE_START__ var PRESETS = [{&quot;label&quot;: &quot;YouTube thumbnail 1280×720&quot;, &quot;w&quot;: 1280, &quot;h&quot;: 720}, {&quot;label&quot;: &quot;Half size 640×360&quot;, &quot;w&quot;: 640, &quot;h&quot;: 360}, {&quot;label&quot;: &quot;Full HD frame 1920×1080&quot;, &quot;w&quot;: 1920, &quot;h&quot;: 1080}]; function clampDim(v){ v = Math.round(Number(v) || 0); if (v &lt; 1) v = 1; if (v &gt; 12000) v = 12000; return v; } function fitSize(sw, sh, tw, th){ var s = Math.min(tw / sw, th / sh); return { w: Math.max(1, Math.round(sw * s)), h: Math.max(1, Math.round(sh * s)) }; } function fillCrop(sw, sh, tw, th){ var s = Math.max(tw / sw, th / sh); var cw = tw / s, ch = th / s; return { sx: Math.round((sw - cw) / 2), sy: Math.round((sh - ch) / 2), cw: Math.round(cw), ch: Math.round(ch) }; } function fitRect(sw, sh, tw, th){ var f = fitSize(sw, sh, tw, th); return { x: Math.round((tw - f.w) / 2), y: Math.round((th - f.h) / 2), w: f.w, h: f.h }; } function outName(base, w, h, ext){ return (base || &#x27;image&#x27;) + &#x27;-&#x27; + w + &#x27;x&#x27; + h + &#x27;.&#x27; + ext; } //__CORE_END__ var img = new Image(), loaded = false, fname = &#x27;image&#x27;; function $(i){ return document.getElementById(i); } PRESETS.forEach(function(p, i){ var b = document.createElement(&#x27;button&#x27;); b.type = &#x27;button&#x27;; b.textContent = p.label; b.style.margin = &#x27;0 6px 8px 0&#x27;; b.style.padding = &#x27;8px 14px&#x27;; b.style.fontSize = &#x27;14px&#x27;; b.addEventListener(&#x27;click&#x27;, function(){ $(&#x27;w&#x27;).value = p.w; $(&#x27;h&#x27;).value = p.h; }); $(&#x27;chips&#x27;).appendChild(b); if (i === 0){ $(&#x27;w&#x27;).value = p.w; $(&#x27;h&#x27;).value = p.h; } }); $(&#x27;file&#x27;).addEventListener(&#x27;change&#x27;, function(){ var f = this.files[0]; if (!f) return; fname = (f.name || &#x27;image&#x27;).replace(/\.[^.]+$/, &#x27;&#x27;) || &#x27;image&#x27;; var url = URL.createObjectURL(f); img.onload = function(){ loaded = true; $(&#x27;go&#x27;).disabled = false; $(&#x27;meta&#x27;).style.display = &#x27;block&#x27;; $(&#x27;meta&#x27;).innerHTML = T.meta.replace(&#x27;{w}&#x27;, img.naturalWidth).replace(&#x27;{h}&#x27;, img.naturalHeight); sendH(); }; img.src = url; }); $(&#x27;go&#x27;).addEventListener(&#x27;click&#x27;, function(){ if (!loaded) return; var tw = clampDim($(&#x27;w&#x27;).value), th = clampDim($(&#x27;h&#x27;).value); var sw = img.naturalWidth, sh = img.naturalHeight; var cv = document.createElement(&#x27;canvas&#x27;); cv.width = tw; cv.height = th; var cx = cv.getContext(&#x27;2d&#x27;); var mode = $(&#x27;mode&#x27;).value; if (mode === &#x27;stretch&#x27;){ cx.drawImage(img, 0, 0, tw, th); } else if (mode === &#x27;fill&#x27;){ var c = fillCrop(sw, sh, tw, th); cx.drawImage(img, c.sx, c.sy, c.cw, c.ch, 0, 0, tw, th); } else { var bg = $(&#x27;bg&#x27;).value; if (bg !== &#x27;transparent&#x27;){ cx.fillStyle = bg; cx.fillRect(0, 0, tw, th); } var r = fitRect(sw, sh, tw, th); cx.drawImage(img, r.x, r.y, r.w, r.h); } var fmt = $(&#x27;fmt&#x27;).value; var q = Math.min(100, Math.max(30, Number($(&#x27;q&#x27;).value) || 90)) / 100; cv.toBlob(function(blob){ if (!blob){ $(&#x27;status&#x27;).innerHTML = &#x27;&lt;span class=&quot;err&quot;&gt;&#x27; + T.err + &#x27;&lt;/span&gt;&#x27;; return; } var ext = fmt === &#x27;image/png&#x27; ? &#x27;png&#x27; : (fmt === &#x27;image/webp&#x27; ? &#x27;webp&#x27; : &#x27;jpg&#x27;); var name = outName(fname, tw, th, ext); var u = URL.createObjectURL(blob); $(&#x27;out&#x27;).innerHTML = &#x27;&#x27;; var im = document.createElement(&#x27;img&#x27;); im.src = u; im.style.maxWidth = &#x27;100%&#x27;; im.style.border = &#x27;1px solid #e2e8f0&#x27;; im.style.borderRadius = &#x27;6px&#x27;; $(&#x27;out&#x27;).appendChild(im); var p = document.createElement(&#x27;p&#x27;); p.innerHTML = T.done.replace(&#x27;{w}&#x27;, tw).replace(&#x27;{h}&#x27;, th).replace(&#x27;{kb}&#x27;, Math.max(1, Math.round(blob.size / 1024))); $(&#x27;out&#x27;).appendChild(p); var a = document.createElement(&#x27;a&#x27;); a.href = u; a.download = name; a.textContent = T.dl + &#x27; &#x27; + name; a.style.cssText = &#x27;display:inline-block;background:#0f766e;color:#fff;padding:11px 22px;border-radius:6px;text-decoration:none;font-size:16px&#x27;; $(&#x27;out&#x27;).appendChild(a); sendH(); }, fmt, q); }); &lt;/script&gt; &lt;/body&gt; &lt;/html&gt; " id="wpc-frame-6426" class="wpc-embed-frame" style="width:100%;border:0;display:block;overflow:hidden;" scrolling="no"></iframe> <p><a href="https://ilmhunt.com/resize-image-for-youtube-thumbnail/" target="_blank" rel="noopener">Resize Image for YouTube Thumbnail — Exact 1280×720 in Seconds</a> by <a href="https://ilmhunt.com/" target="_blank" rel="noopener">IlmHunt</a> — free online tools</p>