Thumbnail is a term used by graphic designers and photographers for a small image representation of a larger image, usually intended to make it easier and faster to look at or manage a group of larger images. For example, software that lets you manage a number of images often provides a miniaturized version of each image so that you don’t have to remember the file name of each image. A thumbnail is also used to mean a small and approximate version of an image or a brochure layout as a preliminary design step. Adobe’s Acrobat viewer lets you show a sequence of thumbnails of viewable pages as a way to navigate among the pages in a document. Adobe’s Photoshop lets you view a thumbnail version of certain kinds of images.
There are a lot of tutorials on the web about making thumbnails in ASP.NET. I’ve used some my self over the years. They all show how easy it is, but they all lack some fundamental functionality:
- Create good thumbnails from gif images
- Calculate the height based on the width
- Be able to use more formats than jpg and gif
Thumbnails from gif images always turns out ugly and kind of dirty looking. If the original gif image has transparency, it turns black when it gets reformatted to a smaller gif or jpeg. That’s why I use the PNG format for gif images. The PNG format is well supported by all browsers and clients except for the older ones.
If you have an image gallery of thumbnails, you probably want all thumbnails to have the same width. The height can vary but the width is fixed. So, I added a method that calculates the height based on the width.
A JPG and TIFF is almost always better to keep as a JPG in a thumbnail, so I have added a method that keeps it that way. All other image types are thumbnailed to PNG images.
Here is the entire code used to make it work.
<%@ Import namespace=”System” %>
<%@ Import namespace=”System.IO” %>
<%@ Import namespace=”System.Drawing” %>
<%@ Import namespace=”System.Drawing.Imaging” %>
<script runat=”server” language=”C#”>
private void Page_Load(object sender, System.EventArgs e)
string filename = Request.QueryString[“file”];
int width = int.Parse(Request.QueryString[“width”]);
private void GenerateThumbnail(string filename, int width)
using (System.Drawing.Image orig = System.Drawing.Image.FromFile(filename))
this.GenerateThumbnail(orig, new Size(width, CalculateHeight(orig, width)), GetFormat(filename));
private void GenerateThumbnail(System.Drawing.Image orig, Size size, ImageFormat format)
using (MemoryStream stream = new MemoryStream())
System.Drawing.Image.GetThumbnailImageAbort callback = new System.Drawing.Image.GetThumbnailImageAbort(ThumbnailCallback);
System.Drawing.Image img = orig.GetThumbnailImage(size.Width, size.Height, callback, IntPtr.Zero);
Response.ContentType = “image/” + format.ToString();
private static ImageFormat GetFormat(string filename)
if (filename.EndsWith(“jpg”) || filename.EndsWith(“jpeg”) || filename.EndsWith(“tiff”))
private static int CalculateHeight(System.Drawing.Image img, double desiredWidth)
double power = img.Width / desiredWidth;
return (int)(img.Height / power);
private bool ThumbnailCallback()
Notice the use of the MemoryStream class. This is a very important step in creating the PNG file or any other format other than JPG and GIF. This is because the ASP.NET response stream isn’t searchable, but a MemoryStream is, and that what’s the other formats need. This is the same for ASP.NET 1.x as well as ASP.NET 2.0. Enjoy.