Formateador y minificador de HTML
HTML Beautifier & Minifier
Formatea o minifica HTML preservando los elementos en línea, con opción de colapsar los espacios en blanco.
Reindenta HTML para que una página que te han pasado sea legible, o lo minifica cuando los bytes importan. El tokenizador implementa los estados raw-text y RCDATA de WHATWG, que es lo que impide que un `</div>` dentro de una cadena de script se lea como una etiqueta y destroce todo lo que viene después.
HTML de entrada
Suelta un archivo .html
Se lee solo en esta pestaña. No se sube nada.
HTML formateado
Elementos
20
Nodos de texto
13
Comentarios
1
Profundidad máxima
5
Hasta dónde llega
- · Un tokenizador escrito a mano lee
<script>y<style>como texto en bruto, y<textarea>y<title>como RCDATA, de modo que un</div>dentro de una cadena no se confunde con una etiqueta. - · Nada de lo que hay dentro de
<pre>ni<textarea>se cambia ni en un carácter;<script>y<style>solo se reindentan línea a línea. El código que llevan dentro no se reescribe. - · Los elementos vacíos como
<br>,<img>y los elementos cuya etiqueta de cierre puede omitirse —<li>,<p>,<td>— se tratan como dice la especificación. Las etiquetas de cierre que falten no se insertan por ti. - · La minificación solo quita comentarios, espacios en blanco y comillas innecesarias. No elimina etiquetas de cierre opcionales ni reordena atributos.
- · Las etiquetas que no casan y los atributos duplicados se informan con línea y columna, y el documento se sigue leyendo hasta donde se pueda, que es lo que hace un navegador.
El CSS de dentro se puede limpiar aparte con el Formateador y minificador de CSS, y los scripts con el Formateador y minificador de JavaScript.
Cómo se usa
Pega una página o un fragmento
Un documento entero con doctype, o un parcial que copiaste de una plantilla. Ambos funcionan; un fragmento simplemente no tiene un elemento `html` dentro del cual indentar.
Ajusta la disposición
Ancho de indentación, si los atributos se normalizan a comillas dobles, el ancho de línea a partir del cual se ajusta una lista larga de atributos, y si el contenido de `html`, `head` y `body` se indenta: muchas páginas escritas a mano los dejan al ras.
Lee la lista de problemas
Las etiquetas desparejadas y los atributos duplicados se listan con línea y columna. El documento se formatea igualmente —el navegador también lo renderizaría—, pero cada entrada es algo que merece arreglarse.
O minifica para la red
Salen los comentarios, los espacios en blanco y las comillas de atributo innecesarias. Los comentarios condicionales y los comentarios `<!--!` se conservan, y las cifras antes/después muestran lo que se ganó.
Preguntas frecuentes
¿Mi bloque `<pre>` está a salvo?
Sí. Nada dentro de `<pre>` o `<textarea>` cambia ni en un solo carácter, en ninguno de los dos modos: allí el espacio en blanco es contenido. `<script>` y `<style>` se reindentan línea a línea pero su contenido nunca se reescribe.
¿Añade las etiquetas de cierre que omití?
No. Las entiende —`<li>`, `<p>` y `<td>` se cierran implícitamente, y los elementos vacíos como `<br>` e `<img>` nunca tuvieron etiqueta de cierre—, así que el árbol se construye correctamente. Pero escribir etiquetas que tú no escribiste es una edición, no un formateo.
¿Puede formatear un archivo de plantilla: Jinja, ERB, Handlebars?
Solo en la medida en que la sintaxis de plantilla se parezca a texto. Los bloques `{% if %}` no se entienden como estructura, así que la indentación dentro de ellos estará mal allí donde una etiqueta se abre en una rama y se cierra en otra. Formatea la salida renderizada en su lugar.
¿Minificar cambiará el aspecto de la página?
El espacio en blanco entre elementos en línea es significativo en HTML, y colapsarlo es el único ajuste de aquí que puede mover un píxel: `<span>a</span> <span>b</span>` no es lo mismo que los dos spans pegados. Desactiva Colapsar espacios en blanco si tu diseño depende de ello.
Puede recibir de
HTML a Markdown
HTML to Markdown
Convierte HTML pegado o una página guardada en Markdown limpio —títulos, listas anidadas, tablas GFM, bloques de código— descartando scripts y estilos.
Formateador y minificador de CSS
CSS Beautifier & Minifier
Formatea o minifica CSS sin reordenar nada, conservando exactamente el flujo de tokens.
Formateador y minificador de JavaScript
JavaScript Beautifier & Minifier
Quita comentarios y espacios de JavaScript o TypeScript sin renombrar nada, y vuelve a indentar un paquete minificado para poder leerlo.
Probador de XPath
XPath Tester
Evalúa una expresión XPath o un selector CSS sobre XML o HTML y enumera todos los nodos que coinciden.
Después
Estas aceptan lo que produce esta herramienta, así que el resultado puede pasar directamente.
Formateador y minificador de CSS
CSS Beautifier & Minifier
Formatea o minifica CSS sin reordenar nada, conservando exactamente el flujo de tokens.
Codificador de entidades HTML
HTML Entity Encoder
Escapa y desescapa entidades HTML, con salida por nombre, decimal o hexadecimal.
HTML a Markdown
HTML to Markdown
Convierte HTML pegado o una página guardada en Markdown limpio —títulos, listas anidadas, tablas GFM, bloques de código— descartando scripts y estilos.
Formateador y minificador de JavaScript
JavaScript Beautifier & Minifier
Quita comentarios y espacios de JavaScript o TypeScript sin renombrar nada, y vuelve a indentar un paquete minificado para poder leerlo.
Codificador y decodificador Base64
Base64 Encoder & Decoder
Codifica y decodifica Base64 y Base64URL, para texto o archivos, tratando UTF-8 correctamente.
curl a código
curl to Code
Convierte un comando curl en fetch, axios, requests de Python, Go, PHP o PowerShell.