HTML y CSS a PDF en PHP: guía completa con ejemplos

Introducción: ¿Por qué necesitarías convertir HTML a PDF?

Imagina esta situación: creaste una factura hermosa en tu sitio web, la maquetaste en HTML, le añadiste estilos y todo se ve perfecto. Pero el cliente te pide enviarla en PDF. O necesitas generar un informe con gráficos, tablas y un diseño complejo. Dibujar un PDF manualmente es cosa del pasado. Es mucho más fácil escribir HTML+CSS y luego convertirlo programáticamente a PDF.

La pregunta «How Can I add HTML And CSS Into PDF» en Stack Overflow tiene miles de visitas, lo que demuestra que este problema es relevante para muchos desarrolladores. En este artículo, analizaremos las tres formas más populares de hacerlo en PHP, mostraremos ejemplos de código y te ayudaremos a elegir la mejor herramienta para tu proyecto.

Comparativa de librerías: Dompdf, TCPDF y mPDF

Antes de escribir código, veamos qué opciones tenemos. En el ecosistema PHP, hay tres grandes «pilares» para convertir HTML a PDF:

\n
• Dompdf — una librería ligera que entiende muy bien CSS 2.1 y parcialmente CSS 3. Ideal para documentos simples.
\n
• TCPDF — potente y estable, pero requiere más código para diseños complejos. No es muy amigable con CSS.
\n
• mPDF — la mejor opción si necesitas soporte para CSS avanzado (flexbox, degradados, transparencia). Es la librería más «CSS-friendly».
\n

En este artículo nos centraremos en mPDF por ser la más cómoda, pero también mostraremos ejemplos con Dompdf para comparar.

Instalación de librerías con Composer

Para empezar, crea un proyecto e instala las dependencias. Abre la terminal y ejecuta:

composer require mpdf/mpdf

Si quieres probar Dompdf:

composer require dompdf/dompdf

Ahora crea un archivo generar_pdf.php en la raíz del proyecto y empieza a escribir código.

Ejemplo 1: HTML simple a PDF con mPDF

Empecemos con el ejemplo más básico. Supongamos que tenemos una plantilla HTML de factura:

<!DOCTYPE html>\n<html>\n<head>\n    <style>\n        body { font-family: Arial, sans-serif; }\n        .invoice { max-width: 800px; margin: 0 auto; }\n        .header { background: #4CAF50; color: white; padding: 20px; }\n        .total { font-size: 24px; font-weight: bold; }\n    </style>\n</head>\n<body>\n    <div class="invoice">\n        <div class="header">Factura N°123 del 01/03/2025</div>\n        <p>Cliente: Juan Pérez</p>\n        <table border="1" width="100%">\n            <tr><th>Servicio</th><th>Precio</th></tr>\n            <tr><td>Desarrollo web</td><td>50.000 €</td></tr>\n            <tr><td>Posicionamiento SEO</td><td>15.000 €</td></tr>\n        </table>\n        <div class="total">Total: 65.000 €</div>\n    </div>\n</body>\n</html>

Ahora el código PHP para generar el PDF:

<?php\nrequire_once __DIR__ . '/vendor/autoload.php';\n\n$html = file_get_contents('factura.html'); // o simplemente una cadena con HTML\n\n$mpdf = new \\Mpdf\\Mpdf();\n$mpdf->WriteHTML($html);\n$mpdf->Output('factura.pdf', 'I'); // 'I' — abrir en navegador, 'D' — descargar\n?>

¡Ejecuta el script y el PDF estará listo! Observa que mPDF tomó automáticamente el CSS de <style>. Esta es la respuesta a la pregunta «How Can I add HTML And CSS Into PDF»: simplemente pasa el HTML con CSS a WriteHTML().

Ejemplo 2: Trabajar con archivos CSS externos

A menudo los estilos se guardan en archivos separados. mPDF admite la inclusión de CSS externo mediante <link>:

<?php\n$html = '\n<!DOCTYPE html>\n<html>\n<head>\n    <link rel="stylesheet" type="text/css" href="estilos.css">\n</head>\n<body>\n    <h1>Informe del m