Saltar al contenido

Convertir SVG a JPG

Algún formulario de carga, marketplace o imprenta solo acepta JPG. Renderiza el vector al tamaño que necesitas, sobre el fondo que elijas (porque un JPG no tiene transparencia), y no se guarda nada.

  • Nunca se guarda
  • Sin filas ni esperas
  • Sin registro, sin marca de agua

Cómo funciona

1

Agrega tus SVG

Suelta todos los archivos .svg que quieras.

2

Elige el tamaño y el fondo

Define el ancho en píxeles (un vector es nítido a cualquier tamaño) y el color que rellena lo que era transparente.

3

Descarga

Uno por uno o en un ZIP, con la calidad que definas.

Por qué JPG pelea con el arte vectorial, y cómo perder lo mínimo

JPEG se diseñó para fotografías: degradados suaves y sin bordes duros, que su transformación en bloques de 8×8 y su submuestreo de color manejan con elegancia. El arte vectorial es lo contrario (rellenos planos, trazos de un píxel, esquinas afiladas y texto pequeño), y cada uno de esos bordes recoge en un JPEG un leve halo de ondulaciones, con franjas de color donde un borde saturado toca el blanco, porque el color se guardó a la mitad de resolución. A partir de calidad 90 los halos son casi invisibles; a 75 se notan en cualquier logo. Por eso el control de calidad de esta página empieza alto.

El color de fondo no es un detalle estético. Un SVG sin fondo dibuja sobre nada, y un JPEG tiene que tener algo en cada píxel, así que la zona vacía se rellena antes de codificar. Los bordes suavizados se mezclaban hacia la transparencia; ahora se mezclan hacia el color elegido, así que un logo renderizado sobre blanco y colocado en una página oscura muestra un halo claro. Elige el color del destino, o usa PNG, que conserva los bordes sin mezclar.

Todo lo autocontenido se renderiza tal como se dibujó: degradados, filtros, máscaras, recortes, imágenes incrustadas como data URI. Las imágenes vinculadas y las fuentes web no se cargan, porque un SVG que se renderiza como imagen está aislado de la red, y los scripts no se ejecutan. Si el SVG solo declara un viewBox, la relación de aspecto sale de ahí y el ancho que definas decide la altura.

Si buscas otra cosa

rsvg-convert -w 1600 -b white in.svg -o out.png seguido de cjpeg -quality 92 da un JPEG más limpio que un codificador de navegador, con un conjunto de fuentes real detrás del texto, e Inkscape exporta con el DPI y el fondo que elijas desde la línea de comandos para una carpeta completa.

Antes de convertir nada, pregúntate si lo que exige un JPG aceptaría un PNG: casi todo lo acepta, y el PNG de un logo es más liviano, más nítido y transparente. Los casos que de verdad necesitan un JPG son pocos: marketplaces con cargadores estrictos, algunas imprentas y sistemas tan antiguos que son anteriores a la compatibilidad con PNG.

Preguntas frecuentes

¿No debería ser un PNG?

Normalmente, sí. El arte vectorial son colores planos y bordes definidos, que JPG comprime mal y PNG a la perfección, y solo PNG conserva la transparencia. Usa esta página cuando algo exija específicamente un JPG (un formulario de publicación, un sistema antiguo, una imprenta) y SVG a PNG en el resto de los casos.

¿Qué pasa con el fondo transparente?

JPG no tiene transparencia, así que la zona que el SVG no dibujó se rellena con el color que elijas antes de codificar. Blanco de forma predeterminada; hazlo coincidir con el lugar donde irá la imagen.

¿A qué tamaño debería renderizarlo?

Al tamaño más grande al que se vaya a mostrar o imprimir, multiplicado por dos para pantallas de alta densidad. Renderizar en grande no tiene penalización, porque el origen es un vector; la única penalización está en el tamaño del archivo.

¿Por qué el texto se ve distinto que en mi programa de diseño?

El SVG nombra una fuente, y la máquina que lo renderiza la sustituye por la que tenga si esa fuente falta. Convierte el texto en contornos antes de exportar y el problema desaparece. Las fuentes web referenciadas por URL no se descargan: el renderizado no se conecta a nada.

¿Mis archivos se guardan en algún lugar?

No: no se guarda nada en ningún momento.

Conviene saber: Los SVG que dependen de imágenes externas o de fuentes web se renderizan sin ellas; los scripts no se ejecutan y las animaciones se renderizan en su primer fotograma. Los bordes definidos adquieren halos de JPG con calidad baja: mantenla en 90 o más para ilustraciones.

Agrega esta herramienta a tu sitio web

Gratis para cualquier blog, página de clase o artículo de ayuda. Pega un fragmento de código y tus visitantes podrán usarla directamente en tu página.