← All libraries

Panzoom

JavaScript
↗ Official site

Drawing & diagram tools

Add pan and zoom to any element — images, SVGs, canvases.

What it does

Panzoom is a tiny library that adds mouse/touch pan and zoom to any HTML element. Great for image viewers, map-like interfaces, or any zoomable content.

When to use it

Use this when you need pan/zoom behavior on images, SVGs, or custom canvases.

Real example

You have a large infographic image that users need to inspect closely. Prompt: 'Apply Panzoom to the #infographic img element so users can pinch/scroll to zoom in and drag to pan. Set minScale to 1 and maxScale to 4.'

Good to know

Lightweight and dependency-free. Does one thing very well.

Alternatives

Install

$ npm install @panzoom/panzoom

Use cases

pan and zoomimage viewermap interface

Language

JavaScript

Category

Drawing & diagram tools

More in Drawing & diagram tools

Other tools in the same category

JS Konva.js

Canvas library for building interactive drawing and diagramming apps.

diagram editorimage editorcanvas app
JS Fabric.js

Powerful canvas library for image manipulation and graphic design tools.

image editordesign toolcanvas
JS tldraw

Ready-made infinite canvas SDK for building whiteboard apps.

whiteboardinfinite canvasdiagram
JS ReactFlow / XYFlow

Build node-based editors, flowcharts, and pipeline UIs.

node graphworkflow builderflowchart
JS Cytoscape.js

Graph theory library for visualizing networks and relationships.

network graphknowledge graphorg chart