Optimizador SVG
SaneadoOptimiza y limpia archivos SVG.
- Flujo de iconos
Input bytes
0
Output bytes
0
Colors
0
ViewBox
—
Colors
fill/stroke/stop-color
Preview an SVG to extract colors.
Preview
No preview yet.
Output SVG
Sanitization
SVG can execute scripts or load external resources. This tool sanitizes the markup before preview and removes risky elements/attributes.
- Removes
<script>,<foreignObject>, and event handler attributes (on*). - Strips external
href/xlink:hrefunless it’s an internal#idreference.
¿Qué es SVG?
SVG (Scalable Vector Graphics) es un formato de imagen vectorial basado en XML para gráficos bidimensionales, con soporte para interactividad y animación. A diferencia de los formatos rasterizados como JPEG o PNG, los SVG se definen mediante rutas matemáticas, lo que significa que se pueden escalar a cualquier tamaño sin perder calidad. Esto los hace perfectos para logotipos, iconos e ilustraciones en la web, donde se mantienen nítidos en cualquier dispositivo, desde pantallas móviles hasta monitores de escritorio de alta resolución.
Cómo usar esta herramienta
Pega tu código SVG en el área de texto Entrada SVG a la izquierda. Haz clic en Vista previa para ver el gráfico y extraer su paleta de colores. Usa los botones Optimizar o Minificar para limpiar el marcado y reducir el tamaño del archivo. Opcionalmente, reemplaza colores específicos introduciendo nuevos valores en el panel Colores y haciendo clic en Aplicar. Haz clic en Copiar o Descargar para guardar tu SVG saneado y optimizado.
Casos de uso comunes
Gestión de iconos para limpiar SVG exportados desde herramientas de diseño como Figma o Illustrator. Personalización de tema para cambiar rápidamente los colores de un conjunto de iconos y adaptarlos a tu paleta de marca. Seguridad para sanear SVG de fuentes no confiables y eliminar posibles scripts o referencias externas. Rendimiento para minificar el marcado SVG y reducir el tamaño de los gráficos en línea, mejorando los tiempos de carga de la página.
Consejos profesionales
Usa el botón currentColor para convertir todos los fills y strokes explícitos a currentColor, haciendo que tu SVG se pueda estilizar fácilmente con CSS. Optimiza siempre tus SVG antes de usarlos en producción para asegurarte de que sean lo más pequeños posible. Al crear SVG en herramientas de diseño, usa las funciones Outline Stroke y Simplify Path para reducir la complejidad del código generado antes de optimizarlo.