Imagen a Base64 URI de datos instantánea.

Suelta una imagen y obtén una URI de datos lista para pegar en CSS, HTML, JSON o correo electrónico. Se ejecuta en tu navegador.

Cómo convertir

Suelta una imagen

Suelta cualquier archivo PNG, JPG, GIF, SVG o WebP.

Copia la URI de datos

La cadena completa data:image/...;base64,... aparecerá en el cuadro de salida.

Pega donde quieras

Úsala en url() de CSS, <img src> de HTML o configuraciones JSON.

Cuándo usar base64

Iconos pequeños

Inserta iconos de menos de 1 KB para evitar una solicitud de red.

HTML para correo

Cuando no puedes enlazar recursos externos.

CSS en línea

Elimina la solicitud HTTP adicional para imágenes de fondo críticas.

Apps sin conexión

Incluye imágenes en el código fuente para un uso totalmente offline.

Preguntas frecuentes

¿Qué es la codificación de imagen base64?

Base64 codifica datos binarios como texto ASCII, permitiéndote insertar imágenes directamente dentro de CSS, HTML o JSON.

¿Cuándo debería usar base64 en lugar de una URL?

Para imágenes diminutas, correos electrónicos o CSS en línea. Para archivos más grandes, usa una URL alojada, ya que base64 aumenta el tamaño en un 33% aproximadamente.

¿Por qué la cadena base64 es tan larga?

Base64 utiliza 4 caracteres por cada 3 bytes, lo que supone un incremento de tamaño del 33%.

¿Se sube algo a un servidor?

No. Se utiliza la llamada local FileReader.readAsDataURL.

¿Codificación SVG?

Funciona. La codificación de URL puede ser más eficiente para archivos SVG.

¿Cómo usarlo en CSS?

Pégalo dentro de url() — background-image: url('data:image/png;base64,...').

¿Cómo usarlo en HTML?

Ponlo en el src de la imagen: <img src="data:image/png;base64,...">.

¿Hay límite de tamaño de archivo?

Los límites prácticos del navegador rondan los 2 MB para URIs de datos en línea.

¿Necesitas una URL alojada en su lugar?

Para imágenes de más de 2 KB, una URL de CDN es más rápida.

Probar el cargador principal