Logos and Icons: Why Vector Graphics Scale and Photos Do Not
The difference between raster and vector images, and how to choose the right one for logos, icons and photos.
Photos and logos are different kinds of images, and treating them the same causes blurry results.
Raster images
Raster images, such as photos, are grids of pixels. Common formats: JPEG, PNG, WebP.
- Good for photos and detailed images.
- Fixed resolution. Enlarge them too far, and they blur or pixelate.
- File size grows with dimensions.
Vector images
Vector images describe shapes with mathematical instructions: "draw a circle here, a line there, fill it with this colour."
- Good for logos, icons, diagrams and illustrations with clean shapes.
- Scale to any size without losing sharpness.
- Small files for simple graphics.
- Common format: SVG.
Comparison
| Feature | Raster | Vector |
|---|---|---|
| Made of | pixels | shapes and paths |
| Enlarging | loses sharpness | stays sharp |
| Best for | photos | logos, icons |
| Typical formats | JPEG, PNG, WebP | SVG |
| Detail level | very high, natural | simple shapes |
Why it matters
If you have a logo only as a small PNG and stretch it for a banner, it will look fuzzy. If you have the logo as a vector, it can be as big as a billboard.
Which to use
- Website logo and icons: SVG where possible.
- Photos: JPEG or WebP.
- Screenshots and simple graphics: PNG.
- Print materials: vector for logos, high-resolution raster for photos.
Converting
- Vector to raster is easy: export at the size you need.
- Raster to vector is hard for photos, and only works well for simple shapes.
When you only have a raster logo
- Ask for the original vector file from whoever designed it.
- Export a large PNG for future needs.
- Avoid enlarging small images.
Compressing
Raster images can be resized and compressed to reduce size. Vectors don't need resizing, though they can be simplified.
For photo tools
A resizing and compression tool is designed for raster images such as photos and screenshots. Keep the original files, and you can always make smaller copies.
Image Compress & Resize Tool
Compress, resize and crop photos fast, ready to share to WhatsApp or Facebook
More about Image Compress & Resize Tool
Colour Spaces in Plain English: Why sRGB Is the Safe Choice
What a colour space is, why colours can look different on different screens and why sRGB is the safest option for sharing.
Read article →Converting Centimetres and Inches to Pixels for Forms and Prints
How to work out pixel dimensions from physical sizes, with worked examples for photo prints and forms that specify centimetres.
Read article →Image File Names and Organisation for People Who Take Hundreds of Photos
Simple naming and sorting habits so you can find a photo in seconds, whether you have a hundred or a hundred thousand.
Read article →Scanning Documents with Your Phone: Resolution, Lighting and File Size
How to get clear, readable document scans from a phone camera without producing enormous files.
Read article →