HTML to PDF - ProToolsKit

HTML to PDF Converter

Convert your HTML text or code directly into a clean PDF document

Paste HTML Code or Text

<div class="ptk-htmlpdf-field-group">
                <label class="ptk-htmlpdf-label" for="ptkFileName">Output Filename</label>
                <input type="text" id="ptkFileName" value="document-export" class="ptk-htmlpdf-input">
            </div>
            <div class="ptk-htmlpdf-field-group">
                <label class="ptk-htmlpdf-label" for="ptkPdfTitle">PDF Document Title</label>
                <input type="text" id="ptkPdfTitle" value="Generated PDF" class="ptk-htmlpdf-input">
            </div>
        </div>

<button type="button" id="ptkConvertBtn" class="ptk-htmlpdf-btn" onclick="ptkConvertToPDF()">
            Convert & Download PDF
        </button>

function setPtkStatus(message, type) {
        const statusDiv = document.getElementById('ptkStatus');
        const convertBtn = document.getElementById('ptkConvertBtn');
        
        statusDiv.classList.remove('ptk-hidden', 'ptk-status-success', 'ptk-status-error', 'ptk-status-loading');
        statusDiv.textContent = message;

if (type === 'success') {
            statusDiv.classList.add('ptk-status-success');
            convertBtn.disabled = false;
        } else if (type === 'error') {
            statusDiv.classList.add('ptk-status-error');
            convertBtn.disabled = false;
        } else if (type === 'loading') {
            statusDiv.classList.add('ptk-status-loading');
            convertBtn.disabled = true;
        }
    }

function ptkConvertToPDF() {
        const htmlInput = document.getElementById('ptkHtmlInput');
        const fileNameInput = document.getElementById('ptkFileName');
        const pdfTitleInput = document.getElementById('ptkPdfTitle');

const rawHtml = htmlInput.value.trim();
        let filename = fileNameInput.value.trim() || 'export';
        if (!filename.endsWith('.pdf')) {
            filename += '.pdf';
        }
        const title = pdfTitleInput.value.trim();

if (!rawHtml) {
            setPtkStatus('Please paste HTML content first.', 'error');
            return;
        }

setPtkStatus('Generating PDF...', 'loading');

try {
            const { jsPDF } = window.jspdf;
            const doc = new jsPDF({
                orientation: 'p',
                unit: 'pt',
                format: 'a4'
            });

const tempDiv = document.createElement('div');
            tempDiv.innerHTML = rawHtml;

let y = 40;
            const margin = 40;
            const maxLineWidth = 515;

// Draw Document Title
            doc.setFont('Helvetica', 'bold');
            doc.setFontSize(16);
            doc.text(title, margin, y);
            y += 25;

// Draw Separator Line
            doc.setLineWidth(1);
            doc.setDrawColor(200, 200, 200);
            doc.line(margin, y, margin + maxLineWidth, y);
            y += 20;

const childNodes = tempDiv.childNodes;
            
            childNodes.forEach(node => {
                let text = node.textContent.trim();
                if (!text) return;

const tag = node.nodeName ? node.nodeName.toLowerCase() : '';

if (tag === 'h1' || tag === 'h2') {
                    doc.setFont('Helvetica', 'bold');
                    doc.setFontSize(14);
                    doc.setTextColor(37, 99, 235);
                    y += 10;
                } else if (tag === 'h3' || tag === 'h4') {
                    doc.setFont('Helvetica', 'bold');
                    doc.setFontSize(12);
                    doc.setTextColor(30, 41, 59);
                    y += 8;
                } else if (tag === 'li') {
                    doc.setFont('Helvetica', 'normal');
                    doc.setFontSize(10);
                    doc.setTextColor(51, 65, 85);
                    text = '• ' + text;
                } else {
                    doc.setFont('Helvetica', 'normal');
                    doc.setFontSize(10);
                    doc.setTextColor(51, 65, 85);
                }

const lines = doc.splitTextToSize(text, maxLineWidth);
                
                lines.forEach(line => {
                    if (y > 780) { // Page overflow check
                        doc.addPage();
                        y = 40;
                    }
                    doc.text(line, margin, y);
                    y += 16;
                });

y += 5;
            });

doc.setProperties({
                title: title,
                author: 'ProToolsKit'
            });

// FIXED: Direct Blob Link Trigger (Solves Download Blocking Issue)
            const pdfBlob = doc.output('blob');
            const blobUrl = URL.createObjectURL(pdfBlob);
            
            const link = document.createElement('a');
            link.href = blobUrl;
            link.download = filename;
            document.body.appendChild(link);
            link.click();
            
            // Clean up memory
            setTimeout(() => {
                document.body.removeChild(link);
                URL.revokeObjectURL(blobUrl);
            }, 100);

setPtkStatus('Conversion successful! PDF Downloaded.', 'success');

} catch (error) {
            console.error("Conversion Error:", error);
            setPtkStatus(`Error: ${error.message}`, 'error');
        }
    }
</script>

</div>
</div>

</article>

<nav class="navigation post-navigation" aria-label="Posts">
				<div class="nav-links"><div class="nav-previous"><a title="Word to PDF" href="https://protoolskit.com/word-to-pdf-easily-convert-word-file-in-pdf-format/" rel="prev"><span class="ast-post-nav" aria-hidden="true"><span aria-hidden="true" class="ahfb-svg-iconset ast-inline-flex svg-baseline"><svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'><path d='M134.059 296H436c6.627 0 12-5.373 12-12v-56c0-6.627-5.373-12-12-12H134.059v-46.059c0-21.382-25.851-32.09-40.971-16.971L7.029 239.029c-9.373 9.373-9.373 24.569 0 33.941l86.059 86.059c15.119 15.119 40.971 4.411 40.971-16.971V296z'></path></svg></span> Previous</span> <p> Word to PDF </p></a></div><div class="nav-next"><a title="PowerPoint to PDF" href="https://protoolskit.com/powerpoint-to-pdf/" rel="next"><span class="ast-post-nav" aria-hidden="true">Next <span aria-hidden="true" class="ahfb-svg-iconset ast-inline-flex svg-baseline"><svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'><path d='M313.941 216H12c-6.627 0-12 5.373-12 12v56c0 6.627 5.373 12 12 12h301.941v46.059c0 21.382 25.851 32.09 40.971 16.971l86.059-86.059c9.373-9.373 9.373-24.569 0-33.941l-86.059-86.059c-15.119-15.119-40.971-4.411-40.971 16.971V216z'></path></svg></span></span> <p> PowerPoint to PDF </p></a></div></div>
		</nav>		<div id="comments" class="comments-area comment-form-position-below ">
	
	
	
	
		<div id="respond" class="comment-respond">
		<h3 id="reply-title" class="comment-reply-title">Leave a Comment <small><a rel="nofollow" id="cancel-comment-reply-link" href="/html-to-pdf/#respond" style="display:none;">Cancel Reply</a></small></h3><form action="https://protoolskit.com/wp-comments-post.php" method="post" id="ast-commentform" class="comment-form"><p class="comment-notes"><span id="email-notes">Your email address will not be published.</span> <span class="required-field-message">Required fields are marked <span class="required">*</span></span></p><div class="ast-row comment-textarea"><fieldset class="comment-form-comment"><legend class ="comment-form-legend"></legend><div class="comment-form-textarea ast-grid-common-col"><label for="comment" class="screen-reader-text">Type here..</label><textarea id="comment" name="comment" placeholder="Type here.." cols="45" rows="8" aria-required="true">

Name*

Email*

Website