Limpiador de HTML

Reduce el HTML pegado a un código limpio y seguro, solo con etiquetas de contenido.

Funciona en tu navegador
Sin subidas
Sin cuenta

Cargando tu herramienta del navegador…

Qué hace Limpiador de HTML

El HTML copiado de Word, Google Docs, plantillas de correo o un creador de sitios arrastra capas de span, estilos en línea y nombres de clase generados. Pegado en un CMS o en el editor de un centro de ayuda, choca con los estilos de tu sitio e infla la página. El limpiador reconstruye el código a partir del contenido y solo conserva las etiquetas que describen la estructura.

La línea de estado bajo el resultado cuenta lo que se ha quitado, como 3 estilos en línea o 2 etiquetas contenedoras. Cambia el resultado a “Vista previa” para comprobar que la versión limpia se sigue leyendo bien, y usa “Más opciones” para conservar cualquier categoría que necesites.

Ejemplo

Entrada

<div class="post"><p style="color:red" onclick="go()">Lee la <a href="javascript:alert(1)">guía</a> o el <a href="/help/">centro de ayuda</a>.</p><span></span><!-- nota --></div>

Resultado

<p>Lee la guía o el <a href="/help/" rel="noopener noreferrer">centro de ayuda</a>.</p>

Estado: Limpieza hecha. Se ha quitado: 2 etiquetas contenedoras, 1 estilo en línea, 1 controlador de eventos, 1 enlace no seguro, 1 comentario. Del enlace javascript: solo queda su texto, y el enlace seguro recibe rel="noopener noreferrer".

Cómo usar Limpiador de HTML

Pega HTML en el cuadro “HTML” o haz clic en “Abrir archivo” para cargar un archivo .html.
Abre “Más opciones” para conservar los estilos en línea, las clases e ids, los comentarios o los elementos vacíos, o para quitar las imágenes o las tablas.
Haz clic en “Copiar” o en “Descargar .html”.

Conviene saber

Solo se conserva un conjunto fijo de etiquetas de contenido. Elementos como <details>, <abbr> o los componentes personalizados se reducen a su texto, así que revisa después el contenido interactivo.
Desactivar “Mantener tablas” no borra los datos: cada fila pasa a ser un párrafo con las celdas separadas por |.
Las imágenes conservan src, alt, title, width y height, pero se quitan srcset y loading, así que los conjuntos de imágenes adaptables vuelven a un solo archivo.

Preguntas sobre Limpiador de HTML

¿Cómo limpio el HTML copiado de Word o Google Docs?

Pega en el cuadro el código HTML, no el texto visible. Word y Docs envuelven el texto en span con estilos en línea y nombres de clase; el limpiador los quita y conserva encabezados, párrafos, listas, enlaces y tablas. Pega el resultado en la vista HTML de tu editor.

¿Por qué un enlace se ha convertido en texto normal?

Su href usaba un esquema que el limpiador considera inseguro, como javascript: o data:. El limpiador quita el enlace pero conserva su texto para que la frase se siga leyendo. Añade en tu editor una URL https:// o relativa real si el enlace debe llevar a algún sitio.

¿Puedo conservar las clases para mi propio CSS?

Sí. Desactiva “Quitar clases e ids” en “Más opciones”. Los estilos en línea tienen su propio interruptor, “Quitar estilos en línea”, así que puedes conservar las clases y quitar igualmente los colores y las fuentes fijados en el código.

¿En qué se diferencia del Formateador de HTML?

El limpiador cambia el código quitando etiquetas y atributos, y luego sangra el resultado con dos espacios. El Formateador de HTML solo cambia los espacios en blanco y conserva todos los elementos y atributos que pegaste.