Design

Pixels vs. Vectors: Which Do I Have? Which Do I Use?

Knowing when to use graphics with the file extensions .ai, .jpeg, .png, or .pdf can be a headache in itself. The best way to know when to use file types is to understand what information each file type stores.

Pixels (JPEG, PNG, sometimes PDF)

The easiest way to see if your .pdf file is pixel or vector-based is to zoom in on your document as much as possible to see if you begin to see pixel squares or seamless lines.

Pixel-based graphics are made up of tons of tiny squares called pixels. The more pixels, the smaller the squares, the better the resolution of your image. Pixels are measured by PPI (pixels per inch). The most common pixel amounts are 72 ppi, 150 ppi, and 300 ppi. That means in every inch of your image, there are either 72, 150, or 300 tiny squares of information squeezed into that inch.

For Web

Because there are so many high-definition screens these days, we suggest you use graphics or images with a resolution of 150 ppi. If your image is 72 ppi, it will work for your on-screen project as well, it just might not be as crisp of a resolution on some end-users’ newer screens.

For Print

Ideally, for normal printing, you want to use graphics that are 300 ppi. This is an optimum resolution for most at-home or professional printers.

Troubleshooting Grainy/Pixelated Images

Have you ever saved an image off of the internet or Facebook to print and it looks grainy or pixelated? That’s because that image quality is 72 pixels per inch. On-screen, your eye only needs 72-150 pixels per inch to make up a crisp image, as screens use subtractive colors (RGB). When printing, there is a lot more information because printers use additive colors (CMYK) and only have 72 squares of information per inch for the printer to use. If you are printing a photograph that is less than 300 ppi, expect a lower-quality photo print.

Vectors (AI, EPS, sometimes PDF)

The easiest way to see if your .pdf file is pixel or vector-based is to zoom in on your document as much as possible to see if you begin to see pixel squares or seamless lines.

Vectors are created using mathematical equations that calculate where edges and points are in relation to each other in the graphic. In other words, you can scale the shit out of vectors without losing the quality or integrity of the graphic.

Vectors are so ideal for print. Any time you have access to a vector when printing, DO IT. Leave that PNG at home.

Receive regular inspiration & creative fuel from our crew