Convertidor de HTML a PDF
Escribe o pega código HTML en el editor y conviértelo en un PDF paginado con un clic. El HTML se renderiza fuera de pantalla respetando los estilos en línea (atributo style), y html2canvas junto con jsPDF generan el PDF final, todo en tu navegador, sin subir tu contenido a ningún servidor.
Cómo funciona
- Escribe o pega tu código HTML en el editor de texto (se incluye un ejemplo precargado como punto de partida).
- Usa estilos en línea (por ejemplo style='color: red;') para controlar la apariencia; las hojas de estilo externas (<link>) o etiquetas <style> no se cargan, ya que el HTML se inserta directamente en un contenedor oculto sin acceso a la red.
- Al pulsar 'Convertir a PDF', ese HTML se renderiza en un contenedor invisible con el ancho fijo de una página A4.
- html2canvas captura ese contenedor como una imagen de alta resolución, que se recorta en franjas del alto de una página A4.
- jsPDF ensambla esas franjas en un PDF paginado, que se descarga automáticamente como documento.pdf.
Casos de uso
- Convertir un fragmento de HTML generado por otra herramienta o sistema en un PDF descargable.
- Generar rápidamente un PDF de una plantilla simple (factura, recibo, certificado) escrita a mano en HTML.
- Probar cómo se vería un bloque de HTML con estilos en línea antes de integrarlo en un sistema de generación de documentos.
- Exportar contenido copiado de una página web (ya con estilos en línea) a un PDF paginado.
Errores comunes
- Usar hojas de estilo externas o una etiqueta <style> esperando que se apliquen.Solo los estilos en línea (atributo style en cada etiqueta) se respetan al convertir; los estilos definidos en <style> o cargados con <link> no se aplican en el resultado.
- No poder ver cómo se ve el HTML antes de generar el PDF, porque no hay una vista previa en pantalla.El área de renderizado está oculta fuera de la pantalla por diseño; la única forma de comprobar el resultado es generar el PDF y revisarlo, ya que esta herramienta no muestra una vista previa visual antes de convertir.
- Incluir imágenes externas (<img src='https://...'>) esperando que siempre se carguen correctamente.html2canvas necesita que las imágenes remotas permitan CORS para poder capturarlas; si una imagen externa no lo permite, puede aparecer en blanco en el PDF. Usa imágenes en base64 (data URI) si necesitas asegurarte de que se incluyan.
Preguntas frecuentes
Alternativas
La función de imprimir del navegador (Ctrl/Cmd+P → Guardar como PDF) sobre una página HTML real también genera un PDF, y suele respetar mejor CSS externo y saltos de página. Esta herramienta es conveniente cuando solo tienes un fragmento de HTML suelto (sin abrirlo como página completa) y quieres convertirlo a PDF rápido, sin instalar nada ni subir el contenido a un servidor.