Visor de HTML

Previsualiza HTML en un frame.

Sobre esta herramienta

Muestra un fragmento de HTML dentro de un iframe con sandbox para que veas su estructura sin abrir otro archivo. Los scripts quedan aislados, así que es una vista previa de marcado, no la ejecución de una aplicación completa.

Cómo usar

Pega el fragmento, pulsa Ver y observa el marco de previsualización. Va bien para bloques de correo o bocetos de componentes estáticos que quieres comprobar en segundos.

Ejemplo

El ejemplo usa estilos en línea para que el marco muestre algo visible.

Entrada

<article style="font-family:system-ui;padding:1rem">
  <h1 style="margin:0 0 .5rem">Preview card</h1>
  <p style="margin:0;color:#334155">Sandboxed HTML viewer example.</p>
</article>

Salida

(rendered in the preview frame)

Consejo

Si algo no aparece, suele deberse a que dependía de una hoja de estilos externa que el marco no carga.

Conviene saber

¿Se ejecutan los scripts en la vista previa?

No. El marco está aislado sin permiso para scripts, así que solo muestra marcado y CSS. Prueba el comportamiento en una página real.

¿Se verán las clases de Tailwind en la vista previa?

No por defecto: el marco no tiene hoja de estilos, así que las clases de utilidad no hacen nada hasta que añadas un <link> a CSS compilado o lo pegues en un bloque <style>. El script Play CDN de Tailwind no puede ejecutarse porque los scripts están bloqueados.

Extensión de Chrome