Imagen a Base64 (y a la inversa)
Incrusta imágenes pequeñas directamente en tu HTML, CSS o JSON sin peticiones extra. Arrastra uno o varios archivos y copia el resultado en el formato que necesites; también puedes pegar un Base64 para recuperar la imagen.
Procesado 100% en tu navegador
Ctrl + Enter ejecutarCtrl + C copiar resultado
Cómo usar
- 1Arrastra una o varias imágenes (JPG, PNG, WebP, GIF, SVG, AVIF).
- 2Elige el formato: data URI, Base64 puro, etiqueta <img>, CSS o Markdown.
- 3Copia el código de cada imagen con un clic.
- 4Para el camino inverso, cambia a «Base64 → Imagen», pega el texto y descarga la imagen.
Casos de uso
- Incrustar iconos y logos pequeños en CSS o HTML para ahorrar peticiones.
- Insertar imágenes en correos HTML o plantillas.
- Enviar imágenes dentro de JSON en APIs.
- Recuperar la imagen de un data URI encontrado en el código de una web.
Preguntas frecuentes
¿Cuándo conviene usar Base64 para una imagen?
Con imágenes muy pequeñas (iconos de pocos KB) que quieres evitar descargar aparte. Para fotos grandes no compensa: Base64 pesa un 33 % más y no se guarda en la caché del navegador por separado.
¿Qué es un data URI?
Una URL que contiene el propio archivo codificado, con la forma data:image/png;base64,… Puede usarse en el atributo src de una imagen o en url() de CSS.
¿Se suben mis imágenes?
No. La conversión se hace en tu navegador; las imágenes no salen de tu dispositivo.
¿Puedo pegar un Base64 sin el prefijo?
Sí. Detectamos el tipo de imagen por su firma (JPG, PNG, GIF, WebP, SVG) aunque no tenga el prefijo data:.