Ir al contenido
snowkitDev

Convierte Base64 de nuevo en una imagen

Pega una URL de datos o una cadena Base64 sin formato para previsualizar la imagen y guardarla como archivo.

Imagen y Base64

Añade imágenes para obtener URL de datos, o pega Base64 para recuperar la imagen.

    o suéltalos en cualquier parte de esta página

    PNG, JPEG, GIF, WebP, SVG, BMP, ICO o AVIF. Puedes añadir varias a la vez.

    Las imágenes se leen en este dispositivo y nunca se suben

    Cambia la dirección arriba para decodificar una URL de datos que ya tengas. Convierte imágenes en texto Base64 y URL de datos para páginas web, correos y código, o convierte Base64 de nuevo en un archivo de imagen. Es gratis y privado.

    Cómo convertir una imagen a Base64

    1. Elige la dirección Imagen a Base64.
    2. Pulsa Elegir imágenes y elige uno o más archivos.
    3. Copia el Base64 o la URL de datos de cada una. Se muestran los tamaños del original y del codificado.

    Cómo convertir Base64 de nuevo en una imagen

    1. Elige la dirección Base64 a imagen.
    2. Pega el texto en Base64 o URL de datos.
    3. Revisa la vista previa y luego descarga la imagen. Borrar vacía el cuadro.

    Por qué Base64 es un tercio más grande

    Base64 escribe cada 3 bytes del archivo como 4 caracteres de texto sin formato, así que el texto codificado es aproximadamente un 33% más grande que la propia imagen, más un breve prefijo data:image/png;base64, para una URL de datos. Cada imagen muestra ambos tamaños para que veas el coste antes de pegarla.

    Cuándo tiene sentido una URL de datos

    Incrustar es práctico para cosas pequeñas: iconos, fondos diminutos, firmas de correo, un favicon o un solo archivo que debe funcionar sin conexión. Para algo de más de unos 10 KB, un archivo de imagen normal suele ser mejor: el navegador puede guardarlo en caché, carga en paralelo con la página y mantiene pequeños tu HTML y tu CSS. Las imágenes grandes reciben un aviso sobre esto.

    Decodificar Base64

    Pega una URL de datos completa, una línea CSS url(), una etiqueta img o solo el texto Base64. Se aceptan espacios, saltos de línea y las letras seguras para URL - y _, y se añade el relleno que falte. El tipo se lee de los primeros bytes del propio archivo, no de la etiqueta, así que un PNG etiquetado por error como JPEG se descarga igualmente con la extensión correcta. Si el texto no es Base64 válido o no es una imagen, recibes una explicación sencilla.

    Archivos admitidos

    Cualquier imagen que tu navegador pueda abrir, incluidas PNG, JPG, WebP, GIF, SVG, ICO y AVIF.

    Consejos

    • Comprime o cambia el tamaño de la imagen primero, ya que Base64 la hace más grande.
    • Conserva las imágenes grandes como archivos normales y enlázalas.
    • Usa SVG siempre que puedas para iconos. Ya es texto y a menudo es más pequeño que un PNG.
    • Para reducir una imagen antes de codificarla, prueba comprimir imagen a un tamaño.

    Usos comunes

    Incrustar un logotipo pequeño en un correo HTML, poner un icono directamente en una hoja de estilos, guardar una imagen en un archivo JSON y recuperar una imagen de una URL de datos que encontraste en el código. Para un conjunto completo de iconos del sitio, mira el generador de favicons.

    Privado por diseño

    Las imágenes se leen y se convierten en esta página, en tu navegador. No se sube nada y los archivos nunca salen de tu dispositivo.

    Preguntas

    ¿Base64 es cifrado?

    No. Es solo una forma de escribir datos como texto. Cualquiera puede decodificarlo.

    ¿Por qué el archivo decodificado tiene la extensión equivocada?

    No debería. El tipo se lee del propio archivo y no de la etiqueta.

    ¿Por qué el texto Base64 es tan largo?

    Cada imagen pasa a ser un tercio más grande como texto, y las fotos ya son grandes de por sí.

    Qué hacer ahora

    Sigue con lo que acabas de crear, todavía en tu dispositivo.

    Más de Snowkit