Convertidor de HTML a imagen

Pega un fragmento de HTML. Antes de renderizar se eliminan scripts, formularios, marcos y controladores de eventos.

Tu HTML y la imagen generada permanecen en este navegador. Las imágenes, fuentes u hojas de estilo remotas se solicitan a sus direcciones de origen; usa datos incrustados si necesitas un renderizado totalmente sin conexión.

Convierte un fragmento de HTML y CSS en un PNG o JPG de tamaño fijo sin subir el código ni la imagen generada a Hyperion. Elige un lienzo de 64 a 1.920 px por lado y una escala de 1x a 3x; después, previsualiza y descarga el resultado en el navegador.

Cómo renderizar HTML como imagen

  1. 1

    Pega el código

    Introduce un fragmento o documento HTML. Se admiten CSS en línea y reglas `<style>`; se eliminan scripts, formularios, marcos y controladores de eventos.

  2. 2

    Configura el lienzo

    Elige PNG o JPG, indica el ancho y el alto y selecciona una escala de 1x a 3x.

  3. 3

    Renderiza la vista previa

    El navegador compone el código depurado dentro de un marco aislado de tamaño fijo.

  4. 4

    Descarga localmente

    Guarda el PNG o JPG directamente. El archivo generado no se sube a Hyperion.

Qué admite el renderizador del navegador

El convertidor usa el motor de diseño del navegador, por lo que el HTML habitual, el CSS en línea, las reglas <style>, Flexbox, Grid, los degradados, las sombras, los SVG insertados y las fuentes instaladas pueden aparecer en el resultado. Crea una imagen rasterizada estática, no una copia interactiva de la página.

Reglas del lienzo y la salida

Ajuste Intervalo admitido Comportamiento
Ancho De 64 a 1.920 px Ancho CSS exacto del marco de captura
Alto De 64 a 1.920 px Alto CSS exacto; el contenido que sobresale se recorta
Escala De 1x a 3x Aumenta la resolución sin cambiar el tamaño del diseño
PNG Imagen de tamaño fijo Conserva las zonas transparentes
JPG Imagen de tamaño fijo Usa una calidad del 92 % y fondo blanco

La salida se limita a 16 megapíxeles para evitar un consumo excesivo de memoria. Si las dimensiones y la escala solicitadas superan ese límite, la herramienta reduce la escala al mayor incremento seguro de 0,5x. El código HTML puede tener hasta 100.000 caracteres.

Privacidad y recursos remotos

El HTML y la imagen de datos generada permanecen en el navegador actual. En el modo por pasos, la configuración se conserva en el almacenamiento de sesión de esta pestaña y se borra al empezar de nuevo. La herramienta no envía el código ni la imagen a Hyperion.

Las URL externas son una excepción. Las imágenes, fuentes y hojas de estilo remotas se solicitan a sus servidores, que pueden ver la petición. También pueden fallar por CORS o por controles de acceso. Incrusta imágenes y fuentes como URL de datos y mantén el CSS en línea si necesitas trabajar totalmente sin conexión.

Límites de seguridad y fidelidad

Antes de la captura se eliminan scripts, formularios, marcos anidados, objetos incrustados y atributos de eventos. La vista previa queda sin interacción, pero esto no sustituye a un saneador de HTML para publicar contenido en otro sitio. Los widgets que dependen de JavaScript no se ejecutan, el estado de vídeo y canvas no está garantizado, las animaciones se convierten en un fotograma y algunas propiedades CSS pueden variar entre motores.

Preguntas frecuentes

Sí. El renderizador toma las reglas <style> y los enlaces de hojas de estilo compatibles de la cabecera y captura el contenido del cuerpo. Elimina scripts, metadatos, formularios, marcos y controladores activos, por lo que no funciona como una página navegable.

El servidor de origen puede bloquear el uso entre dominios, exigir autenticación o responder demasiado tarde. Usa una URL accesible que permita CORS o incrusta el recurso como URL de datos.

PNG conserva los píxeles transparentes. JPG utiliza fondo blanco y una calidad fija del 92 %, que suele ocupar menos con fotografías. La herramienta no exporta WebP ni ofrece un control de calidad independiente.

El convertidor limita la salida a 16 megapíxeles. Con un lienzo grande selecciona automáticamente el mayor paso seguro de 0,5x para evitar agotar la memoria del navegador.

Herramientas relacionadas