Mis mejores utilidades, ahora en tu móvil.

Accede a todas mis herramientas y proyectos de forma rápida, optimizada y en un solo lugar.

Saneador de SVG Online

Optimiza y limpia SVGs exportados desde Figma, Adobe Illustrator o Inkscape. Elimina metadatos, atributos innecesarios y grupos vacíos para obtener un SVG listo para producción.

Estudio de Utilidades

¿Quieres tener esta utilidad en tu web?

Personaliza colores y modo oscuro para WordPress, Notion o tu propio sitio.

Preguntas Frecuentes

¿Puedo pegar el HTML completo de una página con SVG embebido?
Sí. El saneador detecta el elemento SVG dentro del HTML y extrae solo ese bloque para procesarlo. También funciona si pegas directamente el fragmento SVG.
¿Se puede usar con SVGs de Illustrator?
Sí. Illustrator exporta SVGs con declaraciones XML, metadatos y namespaces propios que el saneador elimina. El resultado es un SVG compatible con todos los navegadores modernos.
¿Qué diferencia hay entre limpiar y minificar?
Limpiar elimina atributos y etiquetas innecesarios pero mantiene el formato con indentación para que puedas leer y editar el código. Minificar además colapsa todo en una sola línea para reducir el peso al máximo.
¿Al eliminar IDs puede romperse el SVG?
Solo si algún elemento del SVG referencia otro por ID, por ejemplo a través de fill="url(#gradient)". En ese caso desactiva la opción Eliminar IDs. Por defecto está desactivada precisamente para evitar este problema.
¿Mi código SVG se envía a algún servidor?
No. Todo el proceso ocurre en tu navegador usando las APIs nativas DOMParser y XMLSerializer. El código nunca abandona tu dispositivo.

# Saneador de SVG: Limpia el Código de Figma e Illustrator

Pega cualquier SVG exportado desde Figma, Adobe Illustrator o el inspector del navegador y obtén un archivo vectorial limpio, optimizado y listo para producción.

# ¿Por qué los SVG exportados son tan sucios?

Cuando exportas un SVG desde Figma, recibes un archivo cargado de atributos que solo tienen sentido dentro de la aplicación: data-name, xml:space, referencias a capas internas y metadatos de diseño. El resultado es un SVG que puede pesar un 40–70% más de lo necesario.

# Qué elimina el Saneador

  • Metadatos de editor: etiquetas metadata, title y desc que Figma e Illustrator añaden automáticamente.
  • Namespaces de Inkscape: todos los elementos con prefijo inkscape: y sodipodi:.
  • Atributos innecesarios: xml:space, version, xmlns:* superfluos y atributos data-* de Figma.
  • Grupos vacíos: elementos <g> sin contenido que los editores dejan como artefactos de capas eliminadas.
  • Declaraciones XML: la declaración <?xml version="1.0"?> y el DOCTYPE innecesarios al embeber SVG en HTML.

Referencias Bibliográficas

Esc