Imagen a Base64
Codifica una imagen como data URL en Base64, lista para HTML, CSS o JSON.
Cómo usar Imagen a Base64
- 1
Selecciona una imagen.
- 2
Elige el formato de salida: data URL, Base64 puro, etiqueta <img> o fondo CSS.
- 3
Copia el resultado.
Acerca de Imagen a Base64
Imagen a Base64 codifica una imagen como texto para que puedas incrustarla directamente en HTML, CSS, JSON, correos o código sin alojar un archivo aparte. Los iconos y logotipos pequeños incrustados así cargan con la página y nunca fallan por un enlace roto.
Elige la salida que necesitas: una data URL completa, la cadena Base64 pura, una etiqueta HTML <img> lista para pegar o una regla CSS background-image. La codificación se hace en tu navegador y un aviso de tamaño te ayuda a no incrustar imágenes que deberían servirse como archivos normales.
El archivo se lee localmente con el FileReader del navegador y se convierte en una data URL que empieza por su tipo MIME, como data:image/png;base64. Elige la cadena pura para API y JSON, la data URL completa para atributos src o los fragmentos HTML y CSS listos para usar. Aparece un aviso con imágenes grandes, porque el texto Base64 ocupa aproximadamente un tercio más que el archivo original.
Para qué puedes usarla
- Incrustar iconos pequeños directamente en CSS o HTML.
- Incluir imágenes en cargas JSON o pruebas de API.
- Añadir un logotipo a la firma HTML de un correo.
- Guardar imágenes en una página web o prototipo de un solo archivo.
- Probar cómo se muestra una data URL en distintos navegadores.
Características
- Cuatro formatos: data URL, Base64 puro, etiqueta img y fondo CSS.
- Admite PNG, JPG, GIF, WebP, SVG e ICO.
- Muestra el tamaño codificado y avisa con imágenes grandes.
- Copia con un clic.
- Privado: la imagen nunca se sube.
Consejos para obtener el mejor resultado
- Usa Base64 solo para imágenes pequeñas; los navegadores guardan mejor en caché los archivos normales.
- Optimiza los iconos SVG antes de codificarlos para que la cadena sea más corta.
- Comprime antes los PNG y JPG con Comprimir imagen para reducir el texto generado.
Preguntas frecuentes
¿Por qué el texto Base64 ocupa más que el archivo?
La codificación Base64 añade aproximadamente un 33 % respecto al archivo binario.
¿Cuándo conviene usar imágenes en Base64?
Para imágenes pequeñas de menos de unos 10 KB, como iconos. Las grandes es mejor servirlas como archivos para que el navegador las guarde en caché.
¿Puedo decodificar Base64 a imagen?
Pega la data URL en la barra de direcciones del navegador para verla y guarda la imagen.
¿Funciona con SVG?
Sí. Los SVG se codifican como data URL de tipo image/svg+xml.
¿Se sube mi imagen?
No. Esta herramienta funciona por completo en tu navegador, así que tus datos nunca salen de tu dispositivo.