JPGS and PNGS and TIFS, oh my!

Share:

Facebook
LinkedIn
A black dog wearing a fluffy lion mane costume, with speech bubbles reading "JPGS?" "PNGS?" "TIFS?" and "OH MY!"

Updated June 14, 2026

Along my journey in the visual design industry, I’ve accumulated a list of best practices on handling graphic files. I find that people who do not walk this road every day tend to get confused. JPGS and PNGS and TIFS and EPS files, what to choose? How do you know you’re headed down the right path? Auntie Em can’t help you here, so here’s what Auntie Ro knows.

The same dog in a lion mane costume, rendered in large visible pixels to illustrate a pixel-based file format.
The same dog in a lion mane costume, rendered as a flat graphic with limited colors to illustrate a vector-based file format.

Pixel-based formats

JPGS and PNGS and TIFS — and also GIFS and WEBPS — are all pixel-based files. They are comprised of a grid of individual tiny squares of color called pixels. Think of it as a grid of tiny colored squares — like a Lite-Brite. Zoom in far enough on any digital photo and you’ll see them. Zoom in too far and they become visible at normal size, as in the example above.

Digital photos are pixel-based, so it follows that pixel-based file formats are the best way to save your photographic images. Digital media such as websites, emails, and social media also rely on pixel-based files because monitors display in pixels. The drawback to a pixel-based format is that you cannot enlarge these files without losing resolution. Enlarging means the pixels will expand and become fuzzy — not good. This is a good reason to know which format to use and when.

  • JPG — the workhorse of the industry; great compression, saves small, ideal for photos and complex images
  • PNG — similar to JPG, but supports a transparent background, which makes it the go-to for logos used digitally
  • WebP — a newer format developed by Google that offers better compression than both JPG and PNG, with optional transparency; increasingly the preferred format for web use
  • TIF (or TIFF) — was the industry standard before JPG came along; still requested by some print vendors and publications, but JPG has largely replaced it for most purposes
  • GIF — once useful for logos with transparency and small animations; PNG has largely taken over the transparency role, but GIF still has a home in the world of looping animations (and, of course, the internet’s enduring love of reaction memes)

Vector-based formats

EPS and SVG files are vector-based graphics. This refers to the lines and fills that comprise the file, usually created in a drawing program like Adobe Illustrator. Like stained glass – it’s an image consisting only of clean edges and flat areas of color, which are calculated mathematically and therefore carry no resolution limit. Compare the vector rendering to the pixelated version above and you’ll see the difference immediately. One of the big benefits is that the file sizes are small (exception: very complicated illustrations) and you can enlarge them to any size — even a billboard — without losing resolution. Vector format is perfect for logos, digital illustrations, and infographics. Drawback: doesn’t work well for photos.

  • EPS — long the standard for logos in print; still widely used, but increasingly considered a legacy format as PDF and SVG have taken over much of its territory
  • SVG — now fully mainstream for web use; scalable, lightweight, and supported by all modern browsers; the preferred format for logos and icons online

Multiple file formats for logos

Your branding or logo designer should supply your final approved logo design in multiple formats — both vector-based EPS and SVG files, and pixel-based JPG and PNG files. The designer should also supply each of these in multiple color profiles: RGB (for digital use), CMYK (for print), plus black/white or grayscale and reversed (white on dark). These formats and profiles should cover all your uses now and in the future, no matter where your business leads you.

More Posts

Image collage illustrating liking a post on social media.

How social media has affected branding design

Speech bubble aggrandizing design industry jargon.

Industry jargon vs plain speech

Colorful illustration of five diverse people holding various devices — a phone, tablet, laptop, and headphones — representing different ways people access the web.

What‘s to know about site accessibility?