Digital Image Basics
Every digital image falls into one of two categories: raster or vector. Understanding this distinction helps you choose the right format, optimize file sizes, and avoid quality problems when images need to scale.
Raster Images (Bitmaps)
Raster images store a grid of pixels. Each pixel holds a color value — typically red, green, and blue components, sometimes with transparency. A 1920×1080 image contains over two million individual pixels.
This pixel grid approach excels at representing photographs and complex imagery. Subtle color gradients, shadows, and fine details all translate naturally to pixel values. Your camera captures raster images because real-world scenes have this kind of complexity.
The limitation appears when you scale up. Enlarging a raster image means the software must invent new pixels. The result looks blurry or blocky because there's no additional detail to reveal — just the same pixels stretched larger.
Raster characteristics:
+ Excellent for photographs
+ Captures subtle color variations
+ Universal support
- Quality degrades when enlarged
- File size grows with dimensions
- Fixed resolution
Vector Images
Vector images store mathematical descriptions of shapes. Instead of "pixel at position (100, 50) is blue," a vector says "draw a circle centered at (100, 50) with radius 40, filled with blue."
Because vectors describe shapes mathematically, they scale infinitely. Enlarge a vector logo 1000%, and it remains perfectly sharp — the computer simply recalculates the shapes at the new size. This makes vectors ideal for logos, icons, and illustrations that appear at various sizes.
The tradeoff is that vectors can't represent photographs. A sunset with millions of color variations would require millions of shape definitions, defeating the purpose. Vectors work best for graphics with defined shapes and solid colors.
Vector characteristics:
+ Scales to any size perfectly
+ Small file sizes for simple graphics
+ Editable shapes and colors
- Cannot represent photographs
- More complex rendering
- Limited to defined shapes
Choosing Between Them
The choice usually follows from the content:
Use raster for: photographs, screenshots, complex artwork with gradients and textures, anything captured by a camera.
Use vector for: logos, icons, illustrations, diagrams, text, anything that needs to scale across different contexts.
Many projects use both. A website might have vector icons, a raster hero photo, and a vector logo — each format serving its purpose.