🌐

HTML to PDF

Convert HTML content to PDF. Paste HTML code and get a styled PDF.

FAQ

Related Tools

' + html + ' '); iframeDoc.close(); // Wait for render await new Promise(r => setTimeout(r, 500)); PDFTools.showProgress(progressArea, 30); // Get scroll height to determine pages const body = iframeDoc.body; const totalHeight = Math.max(body.scrollHeight, body.offsetHeight, iframe.contentWindow.innerHeight); const contentH = pageH - margin * 2; const totalPages = Math.ceil(totalHeight / contentH) || 1; for (let pageNum = 0; pageNum < totalPages; pageNum++) { const canvas = document.createElement('canvas'); const renderScale = 2; canvas.width = pageW * renderScale; canvas.height = pageH * renderScale; const ctx = canvas.getContext('2d'); ctx.fillStyle = '#ffffff'; ctx.fillRect(0, 0, canvas.width, canvas.height); // Scroll iframe to page position iframe.contentWindow.scrollTo(0, pageNum * contentH); // Use html2canvas-like approach: draw from iframe // Since we can't use html2canvas, we'll use a simpler approach: // render the iframe content as an image using SVG foreignObject const svgData = '
' + html.replace(/|<\/html>| [\s\S]*?<\/head>||<\/body>|]*>/gi, '') + '
'; const img = new Image(); img.onload = async function() { ctx.drawImage(img, 0, 0); const jpgBlob = await new Promise(res => canvas.toBlob(res, 'image/jpeg', 0.92)); const jpgBytes = await jpgBlob.arrayBuffer(); const embedded = await doc.embedJpg(jpgBytes); const page = doc.addPage([pageW, pageH]); page.drawImage(embedded, { x: 0, y: 0, width: pageW, height: pageH }); }; img.src = 'data:image/svg+xml;charset=utf-8,' + encodeURIComponent(svgData); await new Promise(r => setTimeout(r, 200)); PDFTools.showProgress(progressArea, 30 + Math.round((pageNum / totalPages) * 60)); } document.body.removeChild(iframe); PDFTools.showProgress(progressArea, 95); const out = await doc.save(); resultBlob = new Blob([out], { type: 'application/pdf' }); PDFTools.showProgress(progressArea, 100); result.classList.remove('hidden'); PDFTools.toast(PDFTools.t('common.done')); } catch (err) { console.error(err); PDFTools.toast(PDFTools.t('common.error') + ': ' + err.message); } finally { convertBtn.disabled = false; } }); downloadBtn.addEventListener('click', () => { if (resultBlob) PDFTools.downloadBlob(resultBlob, 'html-to-pdf.pdf'); }); });
Go paperless! Try the Petty Cash System to manage expenses and receipts.