PIXEL & PATHFormat guide
01 Digital graphics, decoded

SAME IMAGE.
DIFFERENT DNA.

Vector graphics are built from math. Raster graphics are built from pixels. Pull the slider and see why that matters online.

Interactive lab

Get uncomfortably close.

Both use the same 180 × 180 composition. Zoom to inspect how each one is constructed.

100%
VECTORSVG
ZOOM ME

Paths & points

Redrawn by the browser at every size, so edges stay perfectly smooth.

Infinitely scalable
RASTERPNG

A grid of pixels

Enlarges the same fixed pixels, so edges become blocky as you zoom in.

Resolution dependent

Choose the right tool

What are you making?

There is no universal winner. The content decides the format.

02

Best choice for a brand logo

Vector

Logos need to stay sharp from a tiny favicon to a huge sign.

Keep this cheat sheet

VECTOR SVG · AI · EPS

  • Best forLogos, icons, illustrations, diagrams
  • SuperpowerSmall files and unlimited scaling
  • Watch outNot suited to detailed photographs

RASTER JPG · PNG · WEBP

  • Best forPhotos, textures, detailed artwork
  • SuperpowerRich detail and complex color
  • Watch outExport at the size it will be displayed