Imagen a Base64
Este conversor transforma cualquier archivo de imagen en una URL de datos Base64: una única cadena autocontenida que empieza por data:image/…;base64, y que incrusta el archivo completo. Usa la API FileReader del navegador (readAsDataURL), así que la codificación ocurre en tu dispositivo y la imagen nunca se sube. Suelta o elige una imagen, comprueba en la vista previa que se leyó el archivo correcto y copia la cadena completa con un clic. Las URLs de datos brillan donde un archivo aparte resulta incómodo: iconos y logos pequeños incrustados en HTML o CSS para ahorrar una petición HTTP, imágenes dentro de payloads JSON o firmas de correo, documentos autocontenidos de un solo archivo y prototipos rápidos. Eso sí, los sacrificios son reales: Base64 codifica 3 bytes como 4 caracteres (~33% más de tamaño), la cadena no se cachea con independencia de la página y engorda tu marcado — resérvala para recursos de unas pocas decenas de kilobytes y sirve las fotos grandes como archivos normales.
Arrastra y suelta una imagen aquí
o haz clic para buscarCómo usar
- Arrastra una imagen a la zona, o haz clic (o pulsa Enter) para buscarla — se acepta cualquier tipo de imagen que tu navegador entienda.
- Comprueba en la vista previa que se leyó la imagen correcta; la URL de datos completa aparece al lado.
- Haz clic en Copiar para llevarte la cadena entera de una vez.
- Pégala en un src de img, en background-image: url(…) de CSS, en un campo JSON o donde se espere una URL. Usa Limpiar para empezar de nuevo con otra imagen.
Preguntas frecuentes
- ¿Se sube mi imagen?
- No. El archivo se lee localmente con la API FileReader del navegador y el resultado se queda en la página; no se envía nada a un servidor ni se guarda nada cuando te vas.
- ¿La conversión altera o comprime la imagen?
- No. Base64 es una recodificación sin pérdidas de los bytes exactos: decodificar la cadena devuelve un archivo idéntico al original. Nunca reduce el tamaño; si necesitas un resultado más pequeño, redimensiona o comprime la imagen primero y convierte el archivo reducido.
- ¿Debo incrustar imágenes grandes?
- Normalmente no. Base64 infla el tamaño en torno a un 33%, los datos no se pueden cachear por separado del documento que los contiene y las cadenas enormes hacen penoso editar HTML y CSS. Incrusta recursos pequeños y muy reutilizados, como iconos; sirve las fotos como archivos normales.
- ¿Qué formatos sirven?
- Cualquier cosa que tu navegador lea como imagen: PNG, JPEG, GIF, WebP, SVG, AVIF, ICO y más. El tipo MIME original se conserva en el prefijo data:image/…;base64,, así que la URL pegada se muestra exactamente igual que el archivo de origen.
- ¿Puedo usar el resultado en CSS o Markdown?
- Sí. En CSS, pégalo en background-image: url(…); en Markdown, úsalo como destino de la imagen: . Ten en cuenta que algunos editores y linters limitan las líneas muy largas, así que las URLs de datos enormes pueden resultar incómodas ahí.
Guías sobre este tema
Herramientas relacionadas
Analizador y decodificador de Data URI
Decodifica un data: URI para ver su tipo MIME, codificación, tamaño y contenido decodificado, en tu navegador.
Codificador / Decodificador Base64
Codifica texto a Base64 o decodifica Base64 a texto al instante.
Constructor de URL Lorem Picsum
Construye URLs de imagen placeholder desde picsum.photos — dimensiones, escala de grises, desenfoque, seed para imágenes estables o un ID de imagen específico.
Generador de Códigos QR
Crea códigos QR personalizados desde cualquier texto o URL y descárgalos.
Compresor de Imágenes
Comprime y redimensiona imágenes JPEG, PNG y WebP en tu navegador.
Redimensionar Imagen
Cambia el tamaño de una imagen y exporta como PNG, JPEG o WebP — todo en tu navegador.