Generate thumbnail

Fit an image into a fixed thumbnail box using contain or cover.

freeworks offlinenothing uploaded
ToolThumbnail Generator
Input
Output
—
Put this on your own site

The frame below runs the same code as this page, in the reader's own browser. Nothing is sent to us, and nothing is sent to you.

Pick a dark background and the text and panels follow it, so the frame stays readable on a dark page.

Preview

How it works

A source image is fitted into a target box using contain or cover logic, optionally cropped around a focal point, and resampled into the thumbnail dimensions. The output may add a background or preserve alpha depending on the format.

  • Cover fills the box; contain preserves the whole image with possible padding.

Worked example

Generate Thumbnail
Generate a 150x150 thumbnail from an image
Input
											data:image/png;base64,iVBORw0KGgo=
Output
												150×150 PNG thumbnail preserving the source aspect ratio

When to use this

CMS previews, contact sheets, and search-result cards generate thumbnails.

Edge cases

  • Cover crops pixels outside the target aspect ratio.
  • Contain can leave empty bands when aspect ratios differ.
  • A small source cannot provide genuine detail at a larger target size.

References