Codificar una imagen en Base64
Obtén una imagen JPEG representada como texto para incrustarla o entregarla a una herramienta que acepte Base64.
Guía basada en el código 2.0.1-rc.7. Las capturas muestran la interfaz en inglés de una edición de prelanzamiento; sus valores ilustran ejemplos, no necesariamente los ajustes iniciales. Los paquetes de Descargas pueden ser diferentes: revisa sus notas y las opciones de guardado antes de procesar.
En esta página
Base64 no es compresión ni cifrado
Base64 transforma bytes en caracteres. La cadena suele ocupar más que los bytes codificados: no es una forma de ocultar la imagen ni una garantía de reducir el tamaño de una página.
En Yagua, el modo Base64 vuelve a codificar la imagen como JPEG, conservando sus dimensiones de píxeles. No representa los bytes exactos del PNG, WebP o JPEG de entrada y no conserva transparencia. Si necesitas Base64 del archivo original exacto, esta modalidad no cumple ese objetivo.
Entradas y controles
Abre LQIP / Base64, carga una imagen y elige Base64 en Generación. El selector individual ofrece JPEG, PNG, WebP, BMP, TIFF, AVIF y HEIC/HEIF con el soporte disponible. No preserva animaciones ni secuencias de varias páginas.
| Control | Función |
|---|---|
| Calidad JPEG | 85 inicialmente; rango 10–100. Determina la nueva codificación JPEG. |
| Generar | Crea la imagen codificada y sus representaciones. |
| Original / Resultado | Compara la entrada y el JPEG generado. |
| Código de salida | Data URI, HTML, CSS o Base64 puro. |
| Copiar código | Copia completo el formato seleccionado. |
| Exportar resultado… | TXT del formato elegido o JSON con todos. |
| Limpiar | Quita la selección y vuelve al estado inicial del módulo, en modo LQIP. |
Los campos Ancho y Radio de desenfoque pertenecen al modo LQIP y no se utilizan para Base64 completo. Bajar Calidad puede perder detalle; no reduce las dimensiones.
Procedimiento y ejemplo
- Selecciona una fotografía opaca de 800 × 600.
- Elige Base64, deja calidad 85 y pulsa Generar.
- Comprueba que Resultado mida 800 × 600 y revisa el detalle visual.
- Elige Data URI para pegarlo en un atributo de imagen o Base64 puro si el receptor espera solo la cadena.
- Copia con el botón o exporta.
El resultado es un JPEG 800 × 600 codificado como texto. La Data URI incluye data:image/jpeg;base64,; Base64 puro no. Pegar uno en un lugar que espera el otro no funciona sin adaptar el contenido.
La captura muestra otra imagen, de 6137 × 10910, calidad 48 y Raw Base64 seleccionado. Es un ejemplo de los controles y la salida; sus dimensiones y calidad no son las del procedimiento anterior.
HTML y CSS
HTML devuelve una etiqueta <img> con la URI embebida. Revisa el texto alternativo generado desde el nombre del archivo: debe describir el contenido para tus visitantes. CSS genera una clase con background-image; adapta su nombre al proyecto. Ninguna opción instala código automáticamente en tu sitio.
En general, para fotografías grandes puede resultar más práctico servir un archivo normal en lugar de incrustar una cadena extensa en HTML o CSS. Elige esta modalidad cuando la herramienta de destino realmente la necesite.
Exportación y conservación
TXT exporta la representación elegida e incluye un comentario con el nombre. JSON exporta nombre, base64, data_uri, html_tag y css_bg. El diálogo propone el nombre base con _lqip incluso al usar Base64; puedes cambiarlo para distinguir tus resultados.
Los campos exportados siguen describiendo un JPEG aunque el nombre fuente termine en PNG. No se guarda una imagen independiente desde este diálogo, sino texto. El original permanece sin cambios.
Cambios y errores
Al cambiar Calidad o modo, el resultado anterior queda invalidado y necesitas generar otra vez. Elegir otro formato de código no exige recodificar. La vista de cadenas largas puede abreviarse, pero copiar con el botón o exportar entrega el contenido completo.
Elegir una imagen nueva restablece todos los parámetros y vuelve al modo LQIP; selecciona Base64 otra vez. Cancelar la selección conserva la imagen actual. Limpiar también vuelve a los valores iniciales. Si falta memoria con un archivo enorme, prepara una copia más pequeña con Redimensionar y verifica que esa reducción sea apropiada para el receptor.