Sign in to save

Bookmark this page so you can find it later.

Sign in to save

Bookmark this page so you can find it later.

Digital art is often built in one of two main ways: vector graphics or raster graphics. Vector graphics describe images with mathematical paths, while raster graphics describe images with a grid of colored pixels. This difference matters because it affects sharpness, file size, editing style, and where the artwork works best.

A logo, icon, poster, photo, and game texture may all need different choices.

Key Facts

  • Raster pixel count = width in pixels x height in pixels.
  • Print size in inches = pixel dimension / PPI.
  • Vector graphics use points, lines, curves, and fills defined by math.
  • Raster graphics lose sharpness when enlarged beyond their original pixel dimensions.
  • Approximate uncompressed raster file size = width x height x color depth in bytes.
  • Common vector formats include SVG, AI, EPS, and PDF; common raster formats include PNG, JPG, GIF, TIFF, and WebP.

Vocabulary

Vector graphic
A vector graphic is an image made from mathematical paths that can scale up or down without losing edge sharpness.
Raster graphic
A raster graphic is an image made from a rectangular grid of pixels, each storing color information.
Pixel
A pixel is the smallest addressable picture element in a raster image.
Resolution
Resolution describes how many pixels an image contains or how densely pixels are printed or displayed.
Bézier curve
A Bézier curve is a smooth vector curve controlled by anchor points and handles.

Common Mistakes to Avoid

  • Enlarging a small raster image for a poster, because the pixels become visible and edges turn blurry or blocky.
  • Using JPG for a logo with flat colors and sharp edges, because JPG compression can create artifacts around clean shapes and text.
  • Assuming SVG is always smaller than PNG, because detailed vector art with many paths can sometimes be larger or slower to render than a simple raster image.
  • Ignoring print resolution, because an image that looks sharp on a screen may print poorly if it does not have enough pixels for the intended physical size.

Practice Questions

  1. 1 A raster image is 2400 pixels wide and 1800 pixels tall. How many total pixels does it contain?
  2. 2 A 3000 pixel wide image is printed at 300 PPI. What is the maximum print width in inches without resampling?
  3. 3 A designer needs artwork for a company logo that will appear on a business card, a website header, and a billboard. Should the master file be vector or raster, and why?