HTML to PDF

Paste HTML and download it as a formatted PDF document instantly

htmlpdfconvertdownloaddocument

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<style>
  * { box-sizing: border-box; margin: 0; padding: 0; }
  body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: linear-gradient(135deg, #1e1b4b 0%, #312e81 50%, #4c1d95 100%);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
  }
  .card {
    background: white;
    border-radius: 20px;
    padding: 48px;
    max-width: 600px;
    width: 100%;
    box-shadow: 0 30px 80px rgba(0,0,0,0.3);
  }
  .header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 2px solid #f3f4f6;
  }
  .logo {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    display: flex; align-items: center; justify-content: center;
    font-size: 28px; flex-shrink: 0;
  }
  .title { font-size: 26px; font-weight: 800; color: #111827; }
  .subtitle { font-size: 14px; color: #6b7280; margin-top: 2px; }
  .section { margin-bottom: 28px; }
  .section-label {
    font-size: 11px; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.08em; color: #9ca3af; margin-bottom: 12px;
  }
  .row { display: flex; gap: 24px; margin-bottom: 16px; }
  .field { flex: 1; }
  .field-name  { font-size: 13px; font-weight: 600; color: #374151; margin-bottom: 4px; }
  .field-value { font-size: 14px; color: #111827; }
  .tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
  .tag {
    background: #f0f0ff; color: #6366f1;
    border-radius: 50px; padding: 5px 14px;
    font-size: 12px; font-weight: 600;
  }
  .footer {
    margin-top: 32px; padding-top: 20px;
    border-top: 2px solid #f3f4f6;
    display: flex; align-items: center; justify-content: space-between;
  }
  .footer-left { font-size: 12px; color: #9ca3af; }
  .status {
    background: #ecfdf5; color: #059669;
    border-radius: 50px; padding: 5px 14px;
    font-size: 12px; font-weight: 700;
  }
</style>
</head>
<body>
  <div class="card">
    <div class="header">
      <div class="logo">📄</div>
      <div>
        <div class="title">DevHexLab Report</div>
        <div class="subtitle">Generated by HTML to PDF Converter</div>
      </div>
    </div>

<div class="section">
      <div class="section-label">Project Details</div>
      <div class="row">
        <div class="field">
          <div class="field-name">Project Name</div>
          <div class="field-value">DevHexLab Platform</div>
        </div>
        <div class="field">
          <div class="field-name">Version</div>
          <div class="field-value">2.4.1</div>
        </div>
      </div>
      <div class="row">
        <div class="field">
          <div class="field-name">Author</div>
          <div class="field-value">DevHexLab Team</div>
        </div>
        <div class="field">
          <div class="field-name">Date</div>
          <div class="field-value">April 2026</div>
        </div>
      </div>
    </div>

<div class="section">
      <div class="section-label">Summary</div>
      <p style="font-size:14px;color:#4b5563;line-height:1.7;">
        A comprehensive suite of 60+ developer tools — all running client-side, no data leaves
        your browser. Convert, encode, format, and inspect with zero friction.
      </p>
      <div class="tags">
        <span class="tag">HTML → PDF</span>
        <span class="tag">JSON Formatter</span>
        <span class="tag">Base64 Codec</span>
        <span class="tag">Color Picker</span>
        <span class="tag">Regex Tester</span>
      </div>
    </div>

<div class="footer">
      <div class="footer-left">devhexlab.com &nbsp;·&nbsp; All rights reserved</div>
      <div class="status">Active</div>
    </div>
  </div>
</body>
</html>

Page Size

Orientation

Scale / Quality

2x = sharper output

Background Color

Size: A4

Orient: portrait

Render: 1200 × auto px

Related Tools

HTML to Image Converter

Convert any HTML file to JPEG, PNG or WebP image with one click. No server, runs in your browser.

Merge PDF Files

Drag and drop multiple PDFs to merge them into a single file — no upload needed

Online HTML Editor

Write, edit and run HTML, CSS and JavaScript code with a live browser preview