ToolPilot

Convertidor de PNG, JPG y WebP a SVG gratis

Vectoriza una imagen PNG, JPG o WebP en un SVG de verdad, hecho de formas y curvas y no de píxeles. Ajusta colores, detalle y contraste, compara con el original y descarga el archivo. Todo ocurre en tu navegador.

Arrastra y suelta una imagen aquí

o haz clic para elegir un archivo PNG, JPG o WebP

Hasta 20 MB y 50 millones de píxeles.

Procesamiento 100 % local: tu imagen nunca se envía a un servidor.

Vectorizar una imagen en SVG: guía práctica

¿Por qué convertir un PNG o un JPG a SVG?

Una imagen PNG, JPG o WebP es una cuadrícula de píxeles: si la amplías más allá de su tamaño original, se ve borrosa o dentada. Un SVG, en cambio, describe formas (contornos, curvas, colores de relleno) que el navegador o el programa vuelve a dibujar a cada tamaño. Un logotipo vectorizado se ve nítido tanto como favicon de 16 píxeles como en una lona de varios metros.

El SVG (Scalable Vector Graphics) es un formato abierto estandarizado por el W3C, que muestran todos los navegadores actuales y que abren Inkscape, Adobe Illustrator, Figma o Affinity Designer. Cada forma obtenida se edita por separado: cambiar un color, borrar un elemento o recortar no degrada nada.

Un archivo .svg también puede limitarse a incrustar la imagen original en una etiqueta <image>: lleva la extensión .svg, pero sigue siendo una cuadrícula de píxeles igual de borrosa al ampliarla. Este convertidor hace lo contrario: cada zona de color se convierte en un trazado <path> real, formado por segmentos rectos y curvas de Bézier. La herramienta revisa el archivo generado y te muestra cuántos trazados vectoriales contiene.

¿Quién lo usa y para qué?

Diseñadores y autónomos
¿Tu cliente solo tiene su logotipo en un PNG de baja resolución o en un JPG comprimido? Vectorízalo con 2 a 6 colores y retoca los trazados en Inkscape o Illustrator en lugar de redibujarlo desde cero.
Corte y grabado (Cricut, láser)
Las máquinas de corte y grabado siguen trazados, no píxeles. En modo blanco y negro con fondo transparente, un dibujo de línea se convierte en un único trazado negro que puedes importar en Cricut Design Space o en LightBurn, que admiten SVG.
Desarrolladores web
Convierte un icono PNG en un SVG que puedes insertar directamente en el HTML: se ve nítido en pantallas de alta densidad y se recolorea con CSS, porque cualquier regla CSS prevalece sobre los atributos fill del archivo.
Firmas y bocetos escaneados
Fotografía o escanea una firma, un sello o un boceto a línea, sube el contraste y el umbral para eliminar el grano del papel y obtén un trazado negro sobre fondo transparente para colocarlo en cualquier documento.

¿Cómo funciona la vectorización?

Tu navegador lee la imagen y, si su lado más largo supera los 1.000 píxeles, la reduce a ese tamaño antes del trazado: el tiempo de cálculo y la memoria necesarios crecen con el número de píxeles multiplicado por el de colores. Aun así, el SVG conserva las dimensiones originales gracias a su atributo viewBox, y un vector se amplía sin pérdida de todos modos.

Primero se construye la paleta por corte de la mediana (el algoritmo que Paul Heckbert publicó en 1982) y después la biblioteca libre ImageTracerJS la afina en tres pasadas de tipo k-medias. Cada color forma una capa cuyos contornos se siguen con una variante del algoritmo marching squares y se aproximan con segmentos rectos y curvas de Bézier cuadráticas. El nivel de detalle fija la tolerancia de ese ajuste y el tamaño mínimo de las formas que se conservan.

El contraste se aplica antes de calcular la paleta. En blanco y negro, la luminancia de cada píxel, calculada con los coeficientes de la norma UIT-R BT.709 que también usa sRGB, se compara con el umbral elegido. El cálculo se ejecuta en un Web Worker, así que la página sigue respondiendo, y si cambias un ajuste a mitad de cálculo, ese cálculo se cancela. La vista previa muestra exactamente el archivo que vas a descargar.

Preguntas frecuentes

¿El SVG será idéntico a mi imagen?
No, es una interpretación. La imagen se divide en zonas de color liso: un degradado se convierte en una serie de franjas y una foto pierde su textura fina. La vectorización da sus mejores resultados con logotipos, iconos, ilustraciones planas, dibujos de línea y textos. Para una fotografía, mejor quédate con un JPG o un WebP.
¿Cuántos colores debo elegir?
2 colores, o el modo blanco y negro, para un logotipo de una tinta, una firma o un texto; de 3 a 8 para un logotipo con colores planos; de 16 a 32 para una ilustración con sombras. Cada color añade una capa: el archivo crece y el cálculo tarda más. Empieza con pocos y ve subiendo hasta que aparezcan los detalles que necesitas.
¿Por qué mi SVG pesa más que la imagen original?
Una foto o una imagen con ruido genera miles de formas pequeñas, cada una descrita por sus coordenadas. Reduce el número de colores, baja el nivel de detalle para eliminar las manchas pequeñas o sube el contraste para simplificar las zonas. Después puedes pasar el archivo por el optimizador SVG. Un logotipo con colores planos, en cambio, solo genera unas decenas de formas.
¿Cómo compruebo que el SVG contiene vectores de verdad?
Abre el archivo en un editor de texto: solo contiene etiquetas <path> cuyo atributo d describe desplazamientos (M), rectas (L) y curvas (Q), sin ninguna etiqueta <image> ni datos codificados en base64. La herramienta hace esta comprobación en cada cálculo y muestra el número de trazados bajo la vista previa.
¿Por qué se reduce la imagen a 1.000 píxeles?
Para acotar el tiempo de cálculo y la memoria, que crecen con el número de píxeles multiplicado por el de colores: un móvil tiene que poder con ello. La reducción solo afecta a la cuadrícula analizada. El SVG conserva el ancho y el alto del original, y sus curvas se ven nítidas a cualquier tamaño.
¿Se envía mi imagen a un servidor?
No. La lectura de la imagen, la vectorización y la creación del archivo SVG se hacen por completo en tu navegador. No se transmite ninguna imagen, no hace falta cuenta y no se guarda nada al cerrar la pestaña.