Imagen a Base64

Convierte imágenes PNG, JPG, WebP o GIF en un data URI Base64, una cadena Base64, una etiqueta img HTML o un fondo CSS. Ideal para incrustar iconos pequeños

🌍 Acceso global 🔒 Privacidad primero ⚡ Conversión instantánea 💯 Ilimitado
📄

Suelta tu archivo imagen aquí

o haz clic para seleccionar

Advertisement

Convierte un PNG, JPG, WebP, GIF o SVG a Base64 y obténlo en la forma que realmente necesitas: un data URI completo, una cadena Base64 sin más, una etiqueta <img> de HTML o una declaración background de CSS, listos para pegar.

Incrustar gráficos pequeños directamente en el código elimina una petición de red y garantiza que el icono aparezca incluso antes de que se cargue la hoja de estilos, y por eso los data URI son populares para iconos, indicadores de carga y firmas de correo. La contrapartida es el tamaño: Base64 es aproximadamente un tercio más grande que el archivo binario y no se puede almacenar en caché por separado, así que resérvalo para recursos pequeños y enlaza las imágenes grandes de la forma habitual.

Cómo convertir una imagen a Base64

1

Elige una imagen

2

Selecciona el formato de salida que necesites

3

Copia el data URI, la etiqueta o el CSS

Preguntas frecuentes

¿Cuándo debería incrustar una imagen en lugar de enlazarla?

Para gráficos pequeños y de uso frecuente de unos 10 KB como máximo (iconos, logotipos, indicadores de carga), donde ahorrar una petición importa más que el aumento de tamaño. Las fotos grandes deberían seguir siendo archivos para que el navegador pueda guardarlas en caché.

¿Por qué la cadena Base64 es más grande que mi archivo?

Base64 codifica cada tres bytes como cuatro caracteres, lo que añade alrededor de un 33 %. Ese sobrecoste es inevitable en la propia codificación.

¿Qué formatos puedo usar?

PNG, JPG, WebP, GIF y SVG. Un SVG vectorial incrustado como data URI sigue siendo escalable, así que suele ser la mejor opción para iconos.

¿Funciona en CSS igual que en HTML?

Sí, copia la forma CSS para usarla en una declaración background-image, o la forma HTML para un atributo src de img.

¿Lo mostrarán los clientes de correo?

La mayoría de los clientes modernos sí, pero algunos eliminan los data URI por seguridad. Para plantillas de correo, aloja la imagen y enlázala si el diseño importa.

¿Se sube mi imagen?

No, la codificación ocurre en tu navegador.

De un vistazo

Entradaimagen
Varios archivosSí
Dónde se ejecutaEn tu navegador: los archivos no se suben nunca
Funciona sin conexiónSí — una vez cargada la página
PrecioGratis, sin registro y sin marca de agua

Dónde se rompen las conversiones sin hacer ruido

La mayoría de los errores de conversión no tienen que ver con la sintaxis, sino con el significado. Una columna CSV de códigos postales pierde sus ceros iniciales en el momento en que una hoja de cálculo supone que es un número; un ID largo supera la precisión de coma flotante; las fechas cambian de significado según si van con el día primero o el mes primero. Las claves de JSON no tienen orden, pero los arrays no, y una herramienta que ordena claves no cambia nada, mientras que una que ordena arrays cambia los datos. Unicode es otra trampa: el texto puede llegar como UTF-8, como UTF-16 o con BOM, y un decodificador que adivina mal convierte los caracteres acentuados en «Mojibake». Antes de fiarte de cualquier conversión, revisa la primera y la última fila, cualquier campo con ceros iniciales y cualquier campo que contenga comillas, comas o saltos de línea.

Elegir un formato de datos

JSON es lo predeterminado para todo lo que devuelve una API o lee un programa: maneja estructuras anidadas, números, booleanos y null de forma natural, y todos los lenguajes lo analizan. CSV es más pequeño y se abre directamente en una hoja de cálculo, pero no tiene forma de expresar anidamiento ni un estándar compartido para el delimitador, las comillas o el juego de caracteres, que es justo donde fallan las conversiones. XML es verboso, pero admite atributos, contenido mixto y esquemas, así que sigue dominando los formatos de documento y las integraciones heredadas. YAML es el más legible para configuración, pero es sensible a los espacios y tiene conversiones de tipo sorprendentes («no» se convierte en false, una versión como 1.10 se convierte en 1.1). Elige el formato que prefiera la herramienta que lo va a consumir, no el que se vea más bonito.

Advertisement