Convertidor de Imagen a Base64
Convierte cualquier imagen en un data URI Base64 que puedes pegar en HTML, CSS o JSON, codificado en tu propio navegador.
Arrastra y suelta una imagen aquí
PNG, JPG, GIF, WebP o SVG — hasta 10 MB
Tu imagen no sale de este dispositivo: todo se codifica dentro del navegador.
Cómo Usar el Convertidor de Imagen a Base64
- Arrastra una imagen a la zona de carga o usa el selector de archivos para elegir un PNG, JPG, GIF, WebP o SVG de tu equipo.
- Revisa la miniatura y la línea con el nombre, el tipo y el tamaño para confirmar que es la imagen correcta.
- Elige "Data URI" si vas a pegarlo en un src o en url(), o "Base64 sin prefijo" cuando tu API solo espera los datos.
- Copia el resultado o usa "Copiar como background-image de CSS" y "Copiar como etiqueta img" para llevarte el fragmento ya montado.
- Pulsa "Limpiar" cuando quieras codificar otra imagen distinta.
¿Qué Es un Convertidor de Imagen a Base64?
Un convertidor de imagen a Base64 lee los bytes de una fotografía o un icono y los reescribe con caracteres ASCII imprimibles. Si añades el prefijo data:image/... obtienes un data URI: una imagen autocontenida que vive dentro de tu HTML, CSS, JSON o plantilla de correo en lugar de estar en un servidor como archivo aparte.
Esta técnica compensa cuando una petición de red cuesta más que unos kilobytes extra: iconos pequeños, favicons, firmas de correo, demos de un solo archivo HTML o un avatar que debe viajar dentro de un JSON. El precio es el peso, porque Base64 añade alrededor de un 33% al original, así que aquí verás un aviso en cuanto el resultado supere 1 MB.
¿Necesitas el camino inverso? El decodificador de Base64 a imagen devuelve un data URI a su formato original. Para texto plano tienes el codificador y decodificador Base64, y puedes aligerar fotos pesadas con el compresor de imágenes.
Preguntas Frecuentes (FAQ)
¿Cómo convierto una imagen a Base64?
Suelta la imagen en la zona de carga o elígela con el botón de archivo y la cadena Base64 aparece al instante. Selecciona el formato data URI para pegarla en HTML o CSS, o Base64 sin prefijo si solo necesitas los datos.
¿Qué es un data URI en Base64?
Es una imagen completa dentro de una sola cadena con la forma data:image/png;base64,AAA... El navegador la trata igual que la URL de un archivo, así que funciona en el src de un img, en un url() de CSS o en un correo sin descargas adicionales.
¿Cómo paso un PNG a Base64 sin subirlo a ningún sitio?
Esta herramienta usa la API FileReader del navegador, de modo que el PNG se lee desde tu propio disco y se codifica localmente. Ninguna copia del archivo llega a ToolGenie ni a otro servidor.
¿Convertir una imagen a Base64 la hace más pesada?
Sí. Base64 representa cada tres bytes con cuatro caracteres, por lo que la cadena resultante pesa alrededor de un 33% más que el archivo original. Es asumible en iconos pequeños y poco recomendable en fotografías.
¿Cómo uso una imagen Base64 en CSS?
Pulsa "Copiar como background-image de CSS" y pega el resultado en cualquier regla, por ejemplo .logo { background-image: url("data:image/png;base64,...") }. La imagen se pinta sin ninguna petición HTTP extra.
¿Qué formatos admite: JPG, GIF, WebP o SVG?
Cualquier formato que el navegador reconozca como imagen, incluidos PNG, JPG, GIF, WebP, SVG, BMP e ICO. El tipo MIME del archivo elegido se escribe automáticamente dentro del data URI.
¿Hay un límite de tamaño de archivo?
Se aceptan archivos de hasta 10 MB. Por encima de ese límite la cadena Base64 resultaría incómoda de pegar y ralentizaría de forma perceptible cualquier página que la incruste.
Consejos para Convertir Imágenes a Base64
- Tip 1: Reserva el Base64 incrustado para recursos de menos de 10 KB: iconos, indicadores de carga y logotipos. Por encima de ese tamaño suele ganar el archivo cacheado que el navegador reutiliza entre páginas.
- Tip 2: El SVG es el formato que mejor se incrusta. Al ser texto desde el principio, un logotipo en línea se mantiene nítido a cualquier resolución y evita una segunda petición.
- Tip 3: Usa Base64 sin prefijo cuando un campo de API espera solo los datos, y el data URI cuando quien lo va a mostrar es un navegador. Confundir ambos es una causa habitual de subidas que fallan.
- Tip 4: Comprime antes de codificar: pasa el archivo por el compresor de imágenes para reducir la cadena y después comprueba el resultado en el convertidor de Base64 a imagen.