Cómo editar un archivo SVG: herramientas, código y buenas prácticas
Aprende a editar SVG con herramientas de diseño o código XML, corregir problemas de color y viewBox y mantener un flujo de trabajo sólido para producción.
Leer el blog SVGRota archivos SVG online gratis. Gira SVG 90°, 180° o 270°, voltéalos en horizontal o vertical y descarga el resultado al instante.
Bienvenido a SVG Editor
Suelta un archivo SVG, haz clic en "Subir"/"Iconos", o usa Ctrl/Cmd+V para pegar código SVG
Empieza con un icono de ejemplo
Elige un ejemplo o sube tu propio SVG.
Permite giros con un clic en ángulos comunes para ajustar orientación rápidamente. Mantiene bordes nítidos y evita transformaciones manuales en código. Úsalo para alinear iconos en tabs, navegación o estados espejados.
Espeja el arte para cambios de dirección de UI, layouts RTL o variantes de iconos. Los volteos son precisos y mantienen proporciones originales. Es útil cuando necesitas versiones izquierda/derecha sin redibujar.
Actualiza al instante para confirmar espaciado y alineación antes de exportar. Previsualizar evita sorpresas en producción y acelera revisiones. Usa un fondo contrastado para detectar strokes sueltos o padding extra.
Descarga el SVG transformado o exporta un PNG para docs y slides. Es útil cuando necesitas un fallback raster rápido o cuando una plataforma no soporta SVG. Guardar ambos formatos facilita el handoff.
Preserva o ajusta el viewBox para que el escalado siga siendo correcto tras las transformaciones. Esto reduce recortes inesperados. Si el archivo no tiene viewBox, conviene añadirlo antes de rotar.
Se ejecuta en tu navegador, sin subidas. Mantiene seguros assets de clientes y funciona en redes restringidas. También mantiene iteración rápida en archivos grandes.
Arrastra y suelta un archivo o pega el marcado SVG. La herramienta carga en local y conserva el viewBox original. Para resultados predecibles, asegúrate de que el arte esté centrado. Abre archivos SVG online y empieza a procesarlos al instante.
Elige un ángulo de rotación o dirección de volteo y mira la vista previa actualizarse al instante. Se mantiene la alineación para que la salida quede nítida. Si aparece padding extra, ajusta el viewBox de la fuente.
Descarga el SVG transformado o exporta PNG con un clic. Mantén nombres de archivo claros como icon-arrow-right.svg para variantes.
Combina rotación/volteo con estas herramientas para redimensionar, optimizar y exportar assets consistentes.
Redimensiona después de rotar para que las dimensiones encajen con tu grid.
Abrir herramientaReduce peso después de rotar para mantener salidas ligeras.
Abrir herramientaPrevisualiza antes y después para validar alineación y transparencia.
Abrir herramientaExporta PNGs como fallback raster para slides o documentación.
Abrir herramientaContinúa con guías prácticas sobre flujos SVG, resolución de problemas y producción.
Aprende a editar SVG con herramientas de diseño o código XML, corregir problemas de color y viewBox y mantener un flujo de trabajo sólido para producción.
Leer el blog SVGDescubre qué son los archivos SVG, cuándo convienen y cómo abrirlos, crearlos, editarlos, optimizarlos y convertirlos de forma segura.
Leer el blog SVGUn workflow SVG repetible para sistemas de diseño, para mantener iconos consistentes desde Figma hasta producción.
Leer el blog SVG