Smart Shipping Label Generator

Create and download professional shipping labels in seconds.

Sender Information (FROM)

Full Name

Address Line 1

City

State

ZIP Code

Recipient Information (TO)

Full Name

Address Line 1

City

State

ZIP Code

Review your generated shipping label below. If you need to make changes, return to the 'Label Details' tab.

${sender.city}, ${sender.state} ${sender.zip}

USPS First-Class

Generated: ${new Date().toLocaleDateString()}

SHIP TO:

${recipient.name}

${recipient.address1}

${recipient.city}, ${recipient.state} ${recipient.zip}

${recipient.zip} - 1234 5678 9012 3456 7890

`; return true; } // --- Tab Logic --- function switchTab(targetTab) { tabs.forEach(tab => { tab.classList.toggle('active', tab.dataset.tab === targetTab); }); tabContents.forEach(content => { content.classList.toggle('active', content.id === targetTab); }); updateNavButtons(); } tabs.forEach(tab => { tab.addEventListener('click', () => { const target = tab.dataset.tab; if (target === 'preview') { if (generateLabel()) { switchTab(target); } } else { switchTab(target); } }); }); nextBtn.addEventListener('click', () => { const currentTab = document.querySelector('.tab-btn.active'); if (currentTab.dataset.tab === 'details') { if(generateLabel()) { switchTab('preview'); } } }); prevBtn.addEventListener('click', () => { switchTab('details'); }); function updateNavButtons() { const currentTabId = document.querySelector('.tab-content.active').id; if (currentTabId === 'details') { prevBtn.disabled = true; nextBtn.disabled = false; nextBtn.style.display = 'inline-flex'; pdfButtonContainer.style.display = 'none'; } else if (currentTabId === 'preview') { prevBtn.disabled = false; nextBtn.disabled = true; nextBtn.style.display = 'none'; pdfButtonContainer.style.display = 'block'; } } // --- PDF Download Logic --- downloadPdfBtn.addEventListener('click', async () => { const { jsPDF } = window.jspdf; // 4x6 inches in mm is 101.6 x 152.4 const doc = new jsPDF({ orientation: 'l', // landscape to fit 6x4 unit: 'mm', format: [152.4, 101.6] }); const canvas = await html2canvas(labelPreviewContainer, { scale: 3 }); const imgData = canvas.toDataURL('image/jpeg', 1.0); doc.addImage(imgData, 'JPEG', 0, 0, 152.4, 101.6); doc.save(`Shipping-Label-${new Date().toISOString().slice(0,10)}.pdf`); }); // --- Initial Load --- populateStates(); populateSampleData(); updateNavButtons(); });