Saltar al contenido
ImageConverter

Conversión segura en el servidor

Convertir SVG a ICO

Convierte un SVG en un icono ICO de Windows con versiones de 16, 32, 48 y 256 píxeles dentro. De todas las conversiones de este sitio, esta es aquella en la que el formato de origen es exactamente el adecuado para el trabajo: cada tamaño se dibuja a partir de tus formas originales en lugar de reducirse desde un mapa de bits.

Se elimina automáticamente Archivos eliminados en 30 minutos

Arrastra y suelta tus imágenes SVG aquí

Añade varias a la vez. Cada archivo se procesa y luego se elimina de nuestro servidor.

Hasta 20 MB por archivo Admite lotes

Paso a paso

Cómo convertir SVG a ICO en 3 pasos

  1. Agrega tu SVG

  2. No hay nada que configurar

    Cada tamaño estándar se renderiza desde el vector.

  3. Descarga tu .ico

Comparación de formatos

SVG vs. ICO

SVG (Scalable Vector Graphics)

Vectorial

Describe formas y texto como instrucciones en lugar de píxeles, así que se puede dibujar con nitidez a cualquier tamaño.

  • Nítido a cualquier tamaño, del favicon a una valla publicitaria
  • Archivos muy ligeros para logotipos, iconos y diagramas
  • No puede representar una fotografía, y muchas aplicaciones no pueden importarlo

ICO (icono de Windows)

Icono de varios tamaños

Reúne varios tamaños de la misma imagen pequeña en un solo archivo, para iconos de Windows y favicons de sitios web.

  • Varios tamaños de icono en un solo archivo
  • Todos los navegadores lo reconocen como favicon
  • Solo para imágenes pequeñas: cada una mide como máximo 256 × 256 píxeles

Por qué un origen vectorial es realmente mejor aquí

Cualquier otro camino hacia un icono parte de un mapa de bits y lo reduce. Reducir promedia los píxeles entre sí, y a los tamaños en los que viven los iconos (16 y 32 píxeles) ese promedio es brutal. Una línea nítida de un píxel en una imagen de 256 píxeles se convierte en una tenue insinuación gris a 16.

Un SVG no son píxeles, son instrucciones. Así que la entrada de 16 píxeles se dibuja a 16 píxeles, y es el renderizador quien decide cómo colocar los bordes a esa escala, en lugar de derivarla de una imagen más grande. Las líneas caen en píxeles enteros, las formas siguen cerradas y el contraste sobrevive.

La diferencia se ve claramente en una pestaña del navegador, y es la razón por la que los diseñadores mantienen los iconos como vectores y exportan los mapas de bits al final.

La transparencia se conserva como es debido

Los diseños SVG casi siempre se dibujan sobre transparencia, y eso pasa directamente. Donde tu diseño no cubre, el icono es realmente transparente, así que queda bien sobre una pestaña clara, una oscura, una barra de tareas de color o cualquier otra cosa.

Los diseños no cuadrados se centran en un lienzo cuadrado con relleno transparente en lugar de estirarse, así que se mantienen las proporciones y no aparece ningún fondo.

Lo que sigue necesitando cuidado

Un detalle invisible a 16 píxeles es peor que inútil: se convierte en ruido que enturbia la forma. Si tu logotipo tiene trazos finos, texto pequeño o un contorno delgado, no se leerán, por bien que se rendericen.

Los juegos de iconos profesionales lo resuelven dibujando diseños simplificados aparte para los tamaños pequeños: menos elementos, trazos más gruesos, a veces solo una inicial. Si tu icono importa, vale la pena hacerlo: exporta un SVG simplificado, crea un ICO con él y úsalo para los tamaños pequeños.

Las fuentes son una trampa. Si tu SVG nombra una fuente en lugar de incrustar las formas de las letras, el renderizador la sustituye por la que tenga y tu logotipo tipográfico puede salir en algo totalmente distinto. Convierte el texto en contornos en tu editor antes de exportar.

Calidad

Calidad y tamaño del archivo

No hay ajuste de calidad. Cada tamaño se renderiza desde el vector y se guarda sin pérdida, que es el mejor resultado posible a partir de cualquier origen.

Reglas de diseño que de verdad importan a 16 píxeles

  • Una sola idea. Una marca, una letra, una silueta. No una escena, ni un logotipo tipográfico, ni un logotipo con eslogan.
  • Trazos no más finos que aproximadamente 1/16 del ancho. Todo lo más fino desaparece en el tamaño más pequeño.
  • Buen contraste tanto sobre claro como sobre oscuro. Las pestañas del navegador vienen de ambos tipos, y un icono que desaparece en uno de ellos falla la mitad de las veces.
  • Deja un poco de aire: un diseño que llega justo hasta el borde se ve apretado junto a otras pestañas.

Pruébalo en pequeño, con ambos temas

Mira la versión de 16 píxeles a tamaño real sobre blanco y sobre un fondo casi negro. La mayoría de los problemas de los iconos son invisibles a cualquier otro tamaño y evidentes a ese.

Para un sitio web, consigue el juego completo

Un ICO por sí solo lleva años sin ser suficiente. El generador de favicon toma el mismo SVG y produce todo el juego moderno (el ICO más los tamaños PNG que buscan Apple y Android, y las entradas del manifiesto), que es lo que realmente necesita un sitio.

¿Es seguro subir un SVG?

Es una pregunta razonable, porque SVG es el único formato de imagen que en realidad es un programa: puede contener scripts y referencias a recursos externos.

Cada SVG se revisa antes de que nada lo analice. Los archivos que declaran tipos de documento o entidades, que contienen scripts o que hacen referencia a recursos externos se rechazan directamente en lugar de limpiarse, y además el renderizador ignora las referencias externas. Como el resultado es un mapa de bits renderizado, nada de tu archivo podría ejecutarse nunca en ningún sitio.

Dónde poner el archivo

Llámalo favicon.ico y ponlo en la raíz de tu sitio (/favicon.ico), no en una carpeta de recursos. Los navegadores piden esa ruta exacta sin que nadie se lo diga, y lo mismo hacen los lectores de fuentes RSS, las aplicaciones de chat que generan vistas previas de enlaces y los gestores de marcadores.

Además puedes declararlo en tu HTML, pero el archivo en la raíz es lo que atrapa a todos los clientes que no leen antes tu código.

¿Por qué no usar simplemente un favicon SVG?

Puedes, y los navegadores modernos lo admiten: <link rel="icon" href="/icon.svg"> funciona en Chrome, Firefox y Safari, y se mantiene nítido a cualquier tamaño, incluso en pantallas que todavía no existen.

Lo que no cubre es todo lo que no es un navegador moderno: accesos directos de Windows, instaladores, clientes antiguos y la petición automática de /favicon.ico. La respuesta habitual es usar ambos: un icono SVG declarado en el HTML y un ICO en la raíz como respaldo. Esta herramienta crea lo segundo a partir de lo primero.

Recuperar el diseño de un icono antiguo

En la dirección contraria, ICO a PNG extrae la imagen más grande de un icono existente. Te dará un mapa de bits, no vectores (un ICO no contiene información de formas que recuperar), pero a menudo basta para redibujarlo.

Qué pasa con tu archivo

Los navegadores no pueden escribir el contenedor ICO, así que esto se hace en nuestro servidor. Lo que subes se borra en cuanto termina la conversión, el resultado se borra en cuanto lo descargas, y todo lo abandonado se elimina automáticamente.

Privacidad

Qué pasa con tu archivo

Esta herramienta funciona en nuestro servidor, así que da el mismo resultado en cualquier teléfono u ordenador. Tu archivo se sube, y esto es exactamente lo que le pasa:

  • Se guarda fuera de la parte pública del servidor con un nombre aleatorio, nunca con el nombre de tu archivo.
  • Se procesa y el archivo original se elimina de inmediato, tanto si la conversión funciona como si falla.
  • El resultado queda tras un enlace firmado que solo recibes tú, que deja de funcionar a los 20 minutos, y el archivo se elimina en cuanto lo descargas.
  • Lo que nunca se descarga se elimina automáticamente en menos de 30 minutos.
  • La imagen en sí nunca se registra ni se guarda. Si una conversión falla, anotamos los formatos y el error, no el archivo.
  • Los metadatos de la cámara, incluidas las coordenadas GPS que indican dónde se tomó la foto, se eliminan del resultado. Solo se conserva la rotación necesaria para mostrar la imagen derecha.

Preguntas y respuestas

SVG a ICO: preguntas frecuentes

¿Por qué un SVG es mejor origen para un icono que un PNG?

Porque cada tamaño se dibuja a partir de tus formas originales en lugar de reducirse desde un mapa de bits. Reducir promedia los píxeles, y a 16 píxeles eso es brutal: una línea nítida de un píxel en una imagen de 256 se convierte en una tenue insinuación gris. Renderizar a 16 permite que los bordes caigan en píxeles enteros y mantiene el contraste. La diferencia se ve en una pestaña del navegador.

¿Se conserva la transparencia?

Sí, como es debido. Los diseños SVG casi siempre se dibujan sobre transparencia y eso pasa directamente, así que el icono queda bien sobre una pestaña clara, una oscura o una barra de tareas de color. Los diseños no cuadrados se centran con relleno transparente en lugar de estirarse.

Mi logotipo tiene detalles finos. ¿Funcionará?

Probablemente no a 16 píxeles, por bien que se renderice: los trazos finos y el texto pequeño se convierten en ruido que enturbia la forma. Los juegos de iconos profesionales dibujan diseños simplificados aparte para los tamaños pequeños: menos elementos, trazos más gruesos, a veces solo una inicial. Si el icono importa, exporta un SVG simplificado y crea con él los tamaños pequeños.

Mi texto salió con la fuente equivocada.

Tu SVG nombra una fuente en lugar de incrustar las formas de las letras, así que el renderizador la sustituyó por la que tenía. Convierte el texto en contornos en tu editor antes de exportar: vale la pena hacerlo con cualquier diseño que salga de tu equipo.

¿Puedo usar simplemente un favicon SVG?

En parte. Los navegadores modernos admiten <link rel="icon" href="/icon.svg"> y se mantiene nítido a cualquier tamaño. No cubre los accesos directos de Windows, los instaladores, los clientes antiguos ni la petición automática de /favicon.ico que hacen los navegadores por su cuenta. La respuesta habitual es usar ambos: un SVG declarado en el HTML y un ICO en la raíz.

¿Es seguro subir un SVG?

Cada SVG se revisa antes de que nada lo analice: los archivos con declaraciones de tipo de documento, entidades, scripts o referencias externas se rechazan en lugar de limpiarse, y además el renderizador ignora las referencias externas. Como el resultado es un mapa de bits renderizado, nada de tu archivo podría ejecutarse en ningún sitio.

Sigue explorando

Ver todas las herramientas