Imagen a Base64
Convierta imágenes en cadenas codificadas en Base64
Imagen de entrada
Seleccione o arrastre una imagen
Archivos de imagen de hasta 10 MiB. JPG, PNG, GIF, WebP, SVG y otros formatos de imagen.
Información del archivo
- Nombre
- —
- Tamaño
- 0 B
- Tipo MIME
- —
- Dimensiones
- —
Acerca de la codificación Base64
- Inserte imágenes directamente en HTML, CSS o JSON sin archivos externos
- Útil para plantillas de correo electrónico, URI de datos y respuestas de API
- La codificación Base64 aumenta el tamaño del archivo aproximadamente un 33%
- Ideal para imágenes pequeñas como iconos, logotipos o miniaturas
Resultado Base64
Suba una imagen para ver el resultado Base64.
0 caracteres
Suba una imagen para ver el resultado Base64.
Ejemplos de uso
Los ejemplos se han acortado para mostrarlos. Los botones de copiar copian el HTML o CSS completo.
Acerca del conversor de imagen a Base64
Nuestro conversor gratuito de imagen a Base64 transforma archivos de imagen en cadenas de texto codificadas en Base64 que pueden incrustarse directamente en HTML, CSS, JavaScript o JSON. Basta con subir o arrastrar una imagen y la herramienta genera al instante un data URI completo, listo para usar en su código.
La codificación Base64 convierte los datos binarios de una imagen en un formato de texto que usa un alfabeto de 64 caracteres. Esto permite incluir imágenes en línea dentro de documentos basados en texto, sin necesidad de solicitudes de archivos de imagen independientes. Aunque la codificación Base64 aumenta el tamaño de los datos en aproximadamente un 33%, compensa en imágenes pequeñas como iconos, logotipos y miniaturas, donde reducir las solicitudes HTTP mejora el rendimiento de carga de la página.
El conversor procesa sus imágenes íntegramente en el navegador mediante la API FileReader. Ningún dato de la imagen se sube a un servidor, por lo que es totalmente seguro para codificar gráficos propietarios, capturas de pantalla confidenciales o cualquier contenido visual sensible. La herramienta admite todos los formatos de imagen principales hasta 10MB de tamaño.
Características principales
- Compatibilidad con JPG, PNG, GIF, WebP, SVG y otros formatos de imagen
- Selección de archivos arrastrando y soltando o haciendo clic para subir
- Conversión instantánea en el cliente, sin subidas al servidor
- Vista previa de la imagen en vivo junto al resultado en Base64
- Resultado completo en data URI con el encabezado del tipo MIME
- Copia con un clic de toda la cadena Base64 al portapapeles
- Descarga de la cadena Base64 como archivo de texto
- Información del archivo (nombre, tamaño, tipo)
- Fragmentos de código HTML y CSS listos para usar
- Tamaño máximo de archivo de 10MB con validación de formato
Cómo usar el conversor de imagen a Base64
- Suba su imagen: Haga clic en el área de subida o arrastre y suelte un archivo de imagen. Los formatos admitidos incluyen JPG, PNG, GIF y WebP de hasta 10MB.
- Vea la vista previa: La herramienta muestra una vista previa de la imagen subida junto con la información del archivo (nombre, tamaño y tipo).
- Copie la cadena Base64: Haga clic en el botón Copiar para copiar el data URI completo al portapapeles, listo para pegarlo en su código.
- Descargue como texto: Haga clic en el botón Descargar para guardar la cadena Base64 como archivo de texto y usarla más adelante.
- Use los fragmentos de código: Consulte los ejemplos de uso de HTML y CSS que aparecen debajo del resultado para integrar la imagen codificada en su proyecto.
- Borre y convierta otra: Haga clic en el botón X de la tarjeta de información del archivo para quitar la imagen actual y empezar una nueva conversión.
Casos de uso
- Incrustar iconos en HTML: Convierta iconos y logotipos pequeños a Base64 e inclúyalos directamente en su HTML mediante etiquetas img con data URI, eliminando solicitudes HTTP adicionales.
- Imágenes de fondo en CSS: Codifique imágenes decorativas y úselas como valores background-image en línea de CSS para reducir las dependencias de archivos externos.
- Diseño de plantillas de correo: Incruste imágenes directamente en plantillas de correo HTML para que se muestren incluso cuando los clientes de correo bloquean las imágenes externas.
- API y cargas JSON: Incluya datos de imagen en respuestas o solicitudes de API JSON cuando no haya endpoints de subida de archivos disponibles.
- Aplicaciones de un solo archivo: Cree archivos HTML autónomos con todas las imágenes incrustadas como Base64, ideales para documentación, informes o herramientas sin conexión.
- Archivos de configuración: Codifique imágenes pequeñas para incluirlas en archivos de configuración, variables de entorno o plantillas de infraestructura como código.
- Aplicaciones web progresivas: Almacene en caché imágenes críticas como cadenas Base64 en service workers o en el almacenamiento local para mostrarlas al instante sin conexión.
Preguntas frecuentes
¿Qué es la codificación Base64 de imágenes?
La codificación Base64 convierte los datos binarios de una imagen en una cadena de texto ASCII. El resultado puede usarse como data URI en etiquetas img de HTML, en propiedades background de CSS o incluirse en cargas JSON, lo que permite transmitir y almacenar imágenes como texto sin formato.
¿La codificación Base64 aumenta el tamaño del archivo?
Sí, la codificación Base64 aumenta el tamaño de los datos en aproximadamente un 33% porque utiliza 4 caracteres de texto para representar cada 3 bytes de datos binarios. Por eso se recomienda incrustar en Base64 principalmente imágenes pequeñas, como iconos y logotipos.
¿Cuándo debo usar imágenes en Base64 en lugar de archivos de imagen normales?
Use Base64 para imágenes pequeñas (menos de 10-20KB) cuando reducir las solicitudes HTTP sea beneficioso, para plantillas de correo en las que las imágenes externas pueden estar bloqueadas, o cuando necesite documentos HTML autónomos. Para imágenes más grandes, las referencias a archivos normales son más eficientes.
¿Esta herramienta es gratuita?
Sí, este conversor de imagen a Base64 es totalmente gratuito. No hay límites de conversiones, no requiere registro y no se aplican marcas de agua ni restricciones a su resultado.
¿Mis datos están seguros?
Sí. Sus imágenes se procesan íntegramente en su navegador mediante la API FileReader de JavaScript. Ningún dato de la imagen se sube ni se almacena en ningún servidor, por lo que esta herramienta es totalmente segura para imágenes sensibles o propietarias.
¿Cuál es el tamaño máximo de archivo?
Esta herramienta admite imágenes de hasta 10MB de tamaño. En la práctica, la codificación Base64 resulta más útil con imágenes de menos de 20KB. Es mejor servir las imágenes más grandes como archivos normales para no engordar su HTML o CSS.
Consejos y buenas prácticas
- Optimice las imágenes primero: Comprima y cambie el tamaño de sus imágenes antes de convertirlas a Base64. Los archivos de origen más pequeños producen cadenas Base64 más cortas y eficientes.
- Úselo solo con imágenes pequeñas: Base64 es ideal para iconos, logotipos y miniaturas de menos de 10-20KB. Para imágenes más grandes, las referencias a archivos externos ofrecen mejor rendimiento.
- Copie el data URI completo: El resultado incluye el prefijo completo data:image/[format];base64, por lo que está listo para pegarse directamente en HTML o CSS sin modificaciones.
- Revise los fragmentos de código: Use los ejemplos de HTML y CSS incluidos como plantillas para integrar la imagen en Base64 en su proyecto.
- Considere el almacenamiento en caché: Las imágenes codificadas en Base64 e incrustadas en HTML o CSS se almacenan en caché junto con el documento, mientras que las imágenes externas pueden almacenarse en caché de forma independiente. Elija el enfoque que mejor se ajuste a su estrategia de caché.
- Descargue como respaldo: Use el botón Descargar para guardar el archivo de texto Base64 como respaldo, sobre todo en imágenes que se utilicen en varios proyectos.