Archivos SVG: cómo abrir, crear, editar y convertir
Descubre qué son los archivos SVG, cuándo convienen y cómo abrirlos, crearlos, editarlos, optimizarlos y convertirlos de forma segura.
Leer el blog SVGPrevisualiza SVGs al instante, inspecciona viewBox y dimensiones y pasa a edición dentro del mismo flujo.
Abre archivos SVG online y haz zoom o desplázate para inspeccionar detalles a cualquier escala. Comprueba alineación de trazos, antialiasing y pixel snapping en iconos.
Alterna entre fondo transparente, claro u oscuro para validar bordes y transparencia. Es ideal para detectar halos, paths sueltos o sombras recortadas.
Las vistas de ajuste a pantalla y tamaño real ayudan a juzgar cómo se verá el asset en contextos de UI. Usa 1:1 para verificar el alineado a píxeles.
Consulta width, height, viewBox y tamaño de archivo en un panel claro. Detecta atributos ausentes para arreglar escalado y prevenir problemas de layout.
Se eliminan scripts y etiquetas inseguras antes de renderizar. Las referencias externas se ignoran para evitar llamadas de red inesperadas.
Procesamiento 100% en el navegador: los archivos no salen de tu dispositivo. Esto mantiene la vista previa rápida y privada, incluso en entornos offline.
Arrastra y suelta, busca un archivo o pega el marcado SVG. SVG Viewer carga el origen localmente y mantiene el viewBox.
Haz zoom, desplázate y cambia fondos mientras revisas dimensiones y valores de viewBox. Confirma el layout antes de exportar u optimizar.
Abre herramientas relacionadas para optimizar, redimensionar o convertir. Detectar problemas de metadatos temprano evita exportaciones repetidas.
Usa este visor SVG online para QA rápido: abre SVGs, inspecciona viewBox, dimensiones y transparencia y continúa a edición, optimización o conversión en un flujo local.
Usa SVG Viewer con estas herramientas para optimizar, convertir y reutilizar assets tras la inspección.
Edita, optimiza y exporta después de confirmar que el SVG se ve correcto.
Abrir herramientaComprime assets para reducir peso tras revisar metadatos.
Abrir herramientaExporta PNGs con escala y opciones de fondo para previews o docs.
Abrir herramientaConvierte SVGs inspeccionados en componentes React reutilizables.
Abrir herramientaReproduce animaciones SMIL o CSS y valida timings antes de publicar.
Abrir herramientaContinúa con guías prácticas sobre flujos SVG, resolución de problemas y producción.
Descubre 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 SVGAprende XML y SVG con un workflow práctico para validación, sanitización, optimización, minificación y exportación.
Leer el blog SVG