Editor de código SVG con resaltado de sintaxis y vista previa en tiempo real
Herramienta SVG en navegador • Sin subida • Ver y editar localmente
Visor, editor y optimizador SVG en línea
Visor y editor SVG en navegador. Renderizar, inspeccionar y optimizar archivos SVG.
Visor y editor SVG online
El visor SVG permite ver, editar y optimizar archivos SVG desde el navegador. Todo el procesamiento se realiza localmente en tu dispositivo y los archivos no salen del navegador.
Cómo usarlo
- 1.Pega el código SVG en el editor o sube un archivo .svg
- 2.Previsualiza el SVG renderizado en tiempo real en el panel derecho
- 3.Usa la barra de herramientas para optimizar, formatear o transformar el SVG
- 4.Exporta en el formato que necesites: SVG, React, PNG o Data URI
Funciones
Optimización SVG para reducir el tamaño sin perder calidad
Formateador para generar código SVG limpio y fácil de leer
Herramientas para rotar y voltear horizontal o verticalmente
Exportación a React JSX, React Native, PNG o Data URI
Controles de zoom para revisar los detalles
Preguntas frecuentes
¿Qué es SVG?
SVG (Scalable Vector Graphics) es un formato de imagen vectorial basado en XML para gráficos bidimensionales. A diferencia de PNG o JPG, puede escalarse sin perder calidad y es ideal para iconos, logotipos e ilustraciones.
¿Se suben mis datos SVG a un servidor?
No. Todo el procesamiento SVG se realiza en el navegador mediante JavaScript del cliente. Tus archivos y tu código no salen de tu dispositivo.
¿Qué hace la optimización SVG?
La optimización elimina metadatos, comentarios y atributos innecesarios, y simplifica las rutas para reducir el tamaño manteniendo el aspecto visual.
¿Puedo convertir SVG en componentes React?
Sí. El menú Exportar convierte SVG a React JSX o componentes SVG de React Native y adapta automáticamente los nombres de atributos de HTML a la convención de React (por ejemplo, stroke-width se convierte en strokeWidth).