Formatear HTML

¿Obtuviste HTML minificado mediante «Ver código fuente» de un sitio, o pegaste un fragmento generado automáticamente y todo está en una sola línea ilegible? Pégalo aquí para obtener una versión con sangría, una etiqueta por línea, antes de estudiarlo o modificarlo.

Atención : se trata de un formateador básico (sangría por nivel de anidación) y no de un analizador HTML completo como los de Prettier. No corrige etiquetas mal cerradas ni errores de sintaxis, y el contenido de bloques <script> o <style> no se reformatea de forma específica.

Ejemplo:

Cómo funciona

Pega tu HTML minificado o compacto en el campo de arriba y haz clic en «Formatear»: la herramienta detecta las etiquetas de apertura, cierre y autocierre, coloca cada etiqueta en su propia línea y aplica una sangría de 2 espacios por nivel de anidación. Las etiquetas de autocierre habituales (br, img, input, meta, link, hr, etc.) se reconocen incluso sin /> explícito.

¿Por qué mi HTML formateado no es visualmente idéntico al 100%?

El reformateo añade saltos de línea y espacios de sangría entre las etiquetas, lo que puede modificar ligeramente la visualización si tu CSS depende de los espacios en blanco entre elementos (algo poco común, pero posible con display: inline). El contenido y la estructura HTML se mantienen idénticos: solo cambia la presentación del código fuente.

¿Puede esta herramienta corregir HTML no válido?

No. El formateador asume que tus etiquetas están, en general, bien formadas (abiertas y luego cerradas en el orden correcto). Si encuentra una etiqueta que nunca se cierra o una sintaxis realmente inusual, el resultado puede quedar mal sangrado. Para validar la conformidad de tu HTML, usa además un validador dedicado.

El formateo se ejecuta 100% localmente en tu navegador mediante WebAssembly : tu código HTML nunca se envía a un servidor.