SVG

SVG (Scalable Vector Graphics) es un formato basado en XML para gráficos vectoriales bidimensionales, estandarizado por el W3C. Los archivos usan la extensión .svg y el tipo de medio image/svg+xml. En lugar de guardar píxeles, un archivo SVG describe formas, trazados, texto, degradados y filtros como marcado, que el visor dibuja a cualquier tamaño.

Como SVG es texto, puede editarse en un editor de código, comprimirse con gzip, dar estilo con CSS y modificarse con JavaScript. Los navegadores renderizan SVG de forma nativa, y las herramientas de diseño lo exportan para iconos, logotipos e ilustraciones. Un archivo SVG también puede contener imágenes de mapa de bits incrustadas, pero en ese caso esas partes se comportan como cualquier otro mapa de bits.

Vectorial frente a mapa de bits

	Vectorial (SVG)	Mapa de bits (PNG, JPG, WebP)
Guarda	Formas y trazados	Píxeles
Escalado	Nítido a cualquier tamaño	Se desdibuja al ampliar
Mejor para	Iconos, logotipos, diagramas	Fotos, capturas de pantalla
Tamaño del archivo	Crece con la complejidad	Crece con el número de píxeles

Dónde se usa SVG

• Logotipos y conjuntos de iconos de sitios web.
• Gráficos y diagramas generados por código.
• Ilustraciones y animaciones sencillas en páginas web.
• Favicons en navegadores que admiten favicons SVG.

SVG y capturas de pantalla

Una captura de pantalla es una cuadrícula de píxeles, así que por naturaleza es una imagen de mapa de bits. Guardarla dentro de un archivo SVG no la hace escalable; el mapa de bits incrustado sigue desdibujándose al ampliarse. Las herramientas de trazado pueden convertir una captura en trazados vectoriales, pero el resultado rara vez coincide con el texto pequeño de la interfaz y pesa mucho más.

Dónde encaja SVG en flujos con muchas capturas

SVG funciona bien en los elementos que rodean una captura: flechas, llamadas, logotipos y diagramas que explican la imagen. Un patrón habitual es una captura en PNG o WebP de la interfaz, con iconos y anotaciones SVG colocados encima en una página web.

Errores comunes

• Incrustar un PNG grande en un SVG y llamarlo archivo vectorial.
• Subir SVG a plataformas que solo aceptan PNG o JPG.
• Abrir archivos SVG que no son de confianza sin precaución, ya que SVG puede contener scripts.

¿Necesitas corregir una imagen ahora?

Convierte una captura entre PNG, JPG y WebP con el Image Converter, o reduce su tamaño con el Image Compressor.

Preguntas frecuentes

¿Puedo guardar una captura de pantalla como SVG?

Puedes envolverla en un archivo SVG, pero seguirá siendo un mapa de bits. Para capturas de pantalla, usa PNG.

¿SVG pesa menos que PNG?

Para formas simples, normalmente sí. Para imágenes detalladas y capturas de pantalla, normalmente no.

Fuentes

• Scalable Vector Graphics (SVG) 2 (W3C)
• SVG (MDN)

Recursos relacionados

• Conversor de imágenes: conversión entre PNG, JPG y WebP.
• Herramienta de anotación de capturas: añade flechas y etiquetas a una captura.
• Formatos de exportación: formatos de mapa de bits que exporta Temposhot.