Skip to main content

PDF to Image

Convert PDF pages to PNG or JPG images with adjustable quality and scale.

Reviewed by · Last reviewed

📄

Drop a PDF file here or click to upload

Convert each page to PNG or JPG

How to Convert PDF Pages to Images

  1. Upload a PDF through the dropzone. The tool accepts the file but does not render it yet; rendering is deferred until you press Convert.
  2. Pick a format. PNG keeps every pixel lossless and is the right default for text-heavy pages, logos, and diagrams. JPG drops file size at a visible quality cost; reach for it only when pages are dominated by photographs.
  3. Choose a scale. The selector ranges roughly from 1x to 4x. Scale 2x (the default) hits the sweet spot for screen viewing. 3x or 4x are worth the extra size if the output feeds a print workflow at 300 DPI.
  4. Click "Convert to Images". Each page renders sequentially to a hidden <canvas>, then the canvas is exported with toDataURL. Per-page thumbnails appear with individual download buttons, or use the "Download All" button to grab every image at once.

How the Canvas Render Pipeline Works

The tool dynamically imports pdfjs-dist, Mozilla's reference PDF parser that ships as the "PDF.js" engine inside Firefox. For each page, it calls getDocument({ data }) on the uploaded ArrayBuffer, retrieves the page object, creates a viewport at the chosen scale, allocates an HTML5 canvas sized to that viewport, and calls page.render({ canvasContext, viewport }). PDF.js tokenizes the content stream, resolves font programs and image XObjects, then issues canvas 2D operations: fillText for decodable glyphs, drawImage for raster resources, and stroke/fill/bezierCurveTo for vector paths. canvas.toDataURL('image/png') or 'image/jpeg' then encodes the pixels to a data URL that becomes the download.

Concrete Reasons to Convert

  • Extracting a single diagram from a technical manual to drop into a Slack message or a Jira ticket without attaching the whole PDF.
  • Turning a signed contract's signature page into a PNG the legal team can embed in a case summary.
  • Producing thumbnail previews for a document management system that indexes images but not PDFs.
  • Converting a court filing to images before uploading to a portal that only accepts JPG or TIFF per page.
  • Making a PDF accessible to a downstream OCR pipeline that reads raster input, not embedded text.
  • Publishing a product datasheet as an image carousel on a storefront that blocks PDF previews.

Edge Cases and Rendering Gotchas

Very large pages at high scale can exceed the browser's maximum canvas dimension (16,384 pixels on Chrome, smaller on Safari). If that limit is hit, the output is clipped; drop the scale or split the PDF first. Transparent backgrounds render as white in JPG because JPEG has no alpha channel; use PNG when transparency matters. Custom fonts PDF.js cannot decode fall back to a system approximation that can shift glyph widths slightly. CMYK pages convert to RGB for canvas output, so prepress color shifts are expected. Encrypted PDFs are rejected because this UI does not pass a password to getDocument. Annotations rendered through the annotation layer in full viewers may not appear in a pure canvas render.

PDF.js and the Canvas API in the Standard

PDF.js is Mozilla's open source reference implementation of the ISO 32000-1 and ISO 32000-2 page-rendering model, written in pure JavaScript with no native code. Its canvas backend maps PDF marking operators to HTML5 canvas 2D context calls, as defined in the WHATWG HTML Living Standard and the canvas module of the W3C. Font substitution follows the "Standard 14" fonts baseline from ISO 32000-2 clause 9.6.2.2 when a document omits embedded fonts (Helvetica, Times-Roman, Courier, Symbol, ZapfDingbats and their variants). PDF/A-compliant documents (ISO 19005) always embed their fonts, which is why they render more reliably than general-purpose PDFs. The canvas output itself is governed by the PNG (ISO/IEC 15948) and JPEG (ISO/IEC 10918) specifications; PDF.js does not invent anything here, it simply hands pixels to the browser's native encoders.

How This Stacks Up Against CLI Tools

For bulk conversion, mutool draw -o page-%d.png -r 150 in.pdf gives crisp 150-DPI PNGs from a single command and is the fastest option for hundreds of files. pdftoppm -png -r 200 in.pdf page from Poppler is the Linux distro default with near-identical quality, and gs -sDEVICE=png16m -r200 -o page-%d.png in.pdf is the most flexible Ghostscript route. The browser tool wins on instant use and private handling but is slower on big documents and cannot batch. For prepress work requiring true CMYK separation or ICC profile handling, Adobe Acrobat Pro or a commercial raster renderer like PDFtron is the right category.

Frequently Asked Questions

What image quality should I pick for print?

Render at 3x or 4x scale if the images will appear in a printed piece at their native size. PDF pages are defined in points (1/72 of an inch), so 2x scale gives 144 pixels per inch which is noticeably soft on print. 3x yields 216 ppi and 4x yields 288 ppi, the latter close to the traditional 300 DPI print benchmark. For letter-sized pages, 4x scale produces roughly 3400 by 4400 pixel PNGs; larger than that tends to hit canvas limits.

Why does the JPG version look blurry compared to PNG?

JPG uses DCT-based lossy compression that is tuned for continuous-tone photographs, not for text and sharp vector edges. Every conversion introduces ringing artifacts around high-contrast edges. PNG uses lossless DEFLATE and preserves every canvas pixel exactly. For scanned photographs JPG is fine and much smaller; for a slide deck, a data sheet, or anything with text, always prefer PNG.

Can I convert just one page at a time?

The current UI renders every page when you click Convert, but each page downloads individually through its own button, so you can grab only the ones you need. If you want to avoid rendering pages you do not care about, use the PDF Splitter first to extract the pages of interest, then run conversion on the smaller file.

Why is rendering slow for large PDFs?

Each page goes through a full PDF.js parse pass and then rasterizes to a canvas in the main thread. Pages with many glyphs, complex gradients, or embedded JPEG 2000 images are expensive on both passes. The tool processes pages sequentially rather than in parallel so that peak memory stays bounded and Safari does not crash the tab on a twenty-megabyte canvas allocation. For a 500-page PDF at 3x scale, expect tens of seconds.

Does the tool upload my PDF anywhere?

No. The conversion is driven entirely by pdfjs-dist loaded from the tab and runs against an ArrayBuffer of your file that never leaves the renderer process. There is no fetch call tied to file content, no service worker that intercepts uploads, and the PostHog script on the site captures page views and anonymized UI events only, not file bytes. You can disconnect from the network after the page finishes loading and the converter still works.

Which format is best for an OCR pipeline?

PNG at 2x or 3x scale. OCR engines like Tesseract perform best on crisp, high-contrast, noise-free rasters, and PNG preserves every pixel without introducing JPEG artifacts around letter edges. Higher scale means higher recognition accuracy up to a point; past 3x the marginal gain flattens out while memory use rises. If your workflow is OCR-centric, run ocrmypdf directly on the PDF instead; it keeps everything vector and only embeds an OCR text layer.

Why did text render with a different font than in Acrobat?

The document probably did not embed its fonts, and PDF.js fell back to the Standard 14 font set defined in ISO 32000-2. Acrobat has its own much larger font substitution database and can match more exotic faces more convincingly. The shape of the glyphs differs slightly and line widths may shift. For reliable cross-renderer output, ensure the source PDF embeds all its fonts (Word and InDesign both have a checkbox for this at export time).

What is the maximum page size the converter handles?

The hard limit is the browser canvas ceiling: 16,384 by 16,384 pixels in Chromium and roughly half that in Safari. A standard Letter page at 4x scale fits comfortably; a poster-sized PDF page (A0 at 4x) will hit the ceiling and render clipped. If a page comes out visually truncated, drop the scale factor until it fits. For truly giant pages, CLI tools without a canvas ceiling (Ghostscript, MuPDF) are the right escalation.

Does color look exactly the same as in Acrobat?

For RGB and grayscale documents, yes. For CMYK prepress documents, colors are approximated via sRGB because canvas is an RGB surface; subtle brand-color shifts are expected. For color-critical prepress, export from the design source with its own color management rather than screenshotting a PDF.

Can I convert password-protected PDFs?

Not in this UI. PDF.js supports passing a password to getDocument, but we deliberately do not expose that option here to keep the security model simple. Unlock the file first through the PDF Unlocker or run qpdf --decrypt locally, then feed the plaintext copy into the converter. This keeps passwords scoped to one dedicated page rather than scattered across the site.

More PDF Tools