mkdocs-panzoom-plugin

What it is and what it does

This MkDocs plugin wraps the panzoom JavaScript library to enable interactive zooming and panning on diagrams and images within your documentation. By default it activates on Mermaid and D2 diagrams, but you can configure it to work on any HTML element via CSS selectors, including standard img tags. Users interact with it by holding a modifier key (Alt by default) and using mouse wheel or drag gestures to zoom and pan.

The plugin automatically persists zoom state and pan position per diagram in browser localStorage, remembering user preferences across page reloads. It supports customization of the activation key, hint display location, initial zoom level, and full-screen mode. The implementation moved to a Markdown extension in version 0.4.0, which improved performance but introduced a requirement for explicit pymdownx.superfences configuration when using Mermaid diagrams.

Use it for:

• Enable users to zoom into large architecture diagrams or flowcharts embedded in technical documentation.
• Allow interactive exploration of complex Mermaid diagrams without leaving the documentation page.
• Provide pan-and-zoom capability for high-resolution images or screenshots in API or design documentation.
• Improve readability of dense D2 diagrams by letting readers focus on specific areas.
• Enhance documentation for data visualization or scientific content where detail inspection is valuable.

Worth the install?

AI-flagged interpretation of the facts on this page — verify before relying

Adds interactive pan and zoom functionality to images and diagrams (Mermaid, D2) in MkDocs documentation sites via a plugin.

Yes, if you use MkDocs with Mermaid or D2 diagrams and want to give readers interactive zoom/pan without extra tooling. Install friction is low and the MIT license poses no restrictions. The aging maintenance status (235 days since last release) is a minor concern but the repository remains active and there are no known vulnerabilities. Verify that the pymdownx.superfences configuration requirement fits your setup before committing.

Install

mkdocs-panzoom-plugin on PyPI

pip install mkdocs-panzoom-plugin

uv add mkdocs-panzoom-plugin

poetry add mkdocs-panzoom-plugin

Installing mkdocs-panzoom-plugin

Before you install

Low friction install as a pure Python wheel with a single runtime dependency on mkdocs. Maintenance status is aging—last release was 235 days ago—but the repository remains active and unarchived with recent commits.

License in practice

MIT license permits free use, modification, and distribution with minimal restrictions, making it suitable for both open-source and commercial documentation projects.

Quickstart

pip install mkdocs-panzoom-plugin

Add to mkdocs.yml:
plugins:
  - search
  - panzoom

Define site_url in mkdocs.yml for the plugin to work.

Requires site_url to be defined in mkdocs.yml configuration; as of version 0.4.0, pymdownx.superfences custom_fences configuration for Mermaid is needed for full functionality.

Verify before relying

• Whether the 30-day automatic cleanup of localStorage zoom states is configurable or always enforced.
• Compatibility with MkDocs versions beyond those tested during development.
• Performance impact when applied to pages with many diagrams or large images.

Package facts

Evidence: mkdocs_panzoom_plugin-0.5.2-py3-none-any.whl

Keywords: mkdocs, zoom, pan, plugin, mermaid, images

Tags

More Documentation packages