January 25, 2016
Difference Between Raster (Pixel) and Vector Images
An image or graphic can be either one of two kinds: raster (pixel) image or a vector image.
A raster image is one where an image is made up of tiny squares of different colors called “pixels”. When put together these squares create the image. A raster file (such as .jpeg, .png, .psd and .tiff) will commit these pixels to memory. The file will store the amount of pixels in the image, its color and position within the image. Since a raster image is made up of a concrete set amount of pixels, it is very hard to resize without losing quality.
A vector image is one where the image is mathematically computed. A file (such as .svg and .ai) will store the mathematical computation it takes to create an image. For example, if there is an image of a line, the file will remember the angle of the line, the thickness of it, its color, and other properties. For this reason, if a vector image is resized, the file will recalculate the math so the image can be resized without losing quality.
However, there are file formats that can contain both. Examples are .pdf and .eps. An .esp file can contain both raster and vector information. An .eps file is so commonly used for saving vector images that it has become a wide misconception that any .eps file is a vector when in truth it can contain pixels as well.
The article is a quick and dirty breakdown of these two terms, but I hope this gives a good gist of the difference between the two.
The following is an example of a raster (pixel) image when enlarged. At a certain size, the image starts to degrade. The square form of the pixels start to appear.
The next example is of a vector image when enlarged. The image does not degrade no matter how large or small it is resized.