Convertir una imagen a Base64 (data URI)
Importa una imagen y obtén directamente una cadena data:image/...;base64,... lista para pegar en CSS o HTML, para integrar un pequeño icono sin petición de red adicional.
Cómo funciona
¿Quieres integrar un pequeño icono, un logotipo o un pictograma directamente en una hoja de estilos CSS (por ejemplo en background-image) o en HTML, sin añadir un archivo separado ni una petición de red adicional? Importa tu imagen: se codifica en una cadena Base64 precedida del prefijo correcto data:image/png;base64, (o jpeg, gif, webp... según el formato detectado), directamente utilizable como valor de URL en tu código.
¿Cuándo usar una imagen en Base64 en lugar de un archivo separado?
Es sobre todo pertinente para imágenes muy pequeñas (iconos, pictogramas, pequeños logotipos): evita una petición HTTP adicional y puede simplificar el despliegue de un componente autónomo. Para fotos o imágenes más pesadas, un archivo separado sigue siendo preferible: el Base64 aumenta el tamaño en aproximadamente un 33% y no se almacena en caché de forma independiente por el navegador.
¿Se detecta automáticamente el formato de la imagen?
Sí. La herramienta analiza los primeros bytes del archivo importado para determinar su formato real (PNG, JPEG, GIF, WebP...) y lo inscribe en el prefijo de la cadena generada, sin fiarse de la extensión del nombre de archivo.
Procesamiento 100% local en tu navegador (WebAssembly) — tu imagen nunca se envía a un servidor.