Conversor Base64 DataURL

Base64 puro
0 caracteres

Herramienta online para convertir entre Base64 puro y el formato data URL completo, con detección automática de MIME.

Relacionado

Codificación Base64

Decodificación Base64

Fusionar Base64 multilínea

Base64 a imagen

Imagen a Base64

Limpieza de Base64

¿Qué es un DataURL en Base64?

Un DataURL es un esquema URI que embebe datos directamente en la URL, con el formato data:[<tipo MIME>];base64,<datos Base64>. Permite incluir recursos pequeños como imágenes, PDF o fuentes dentro de HTML, CSS o JavaScript sin peticiones HTTP adicionales.

**Base64 puro vs DataURL:** el Base64 puro es solo la cadena codificada (p. ej. iVBORw0KGgo...); un DataURL es un URI completo con el prefijo data: y un tipo MIME, listo para usar como valor de src, href, url(), etc.

**Qué hace esta herramienta:** convierte entre "cadenas Base64 puras" y "DataURLs completos": añade automáticamente el prefijo data: y el tipo MIME al Base64 existente, o extrae la parte de Base64 puro de un DataURL.

**Usos típicos:** ① incrustar imágenes de fondo en CSS; ② src inline en HTML <img>; ③ imágenes inline en Markdown; ④ pegar imágenes en editores de texto enriquecido; ⑤ depurar el esquema data URI.

Casos de uso

  • Añadir el prefijo data: y un tipo MIME a un Base64 existente para obtener un DataURL listo para incrustar en HTML
  • Extraer la parte de Base64 puro de un DataURL para reensamblarlo o transmitirlo
  • Verificar que la carga útil Base64 de un data: URI del front-end esté completa durante la depuración
  • Detectar automáticamente el tipo MIME del Base64 copiado al portapapeles (PNG/JPEG/PDF, etc.)
  • Preparar un data URL para background-image en CSS o <img src> en HTML
  • Convertir el Base64 de una imagen en un DataURL listo para pegar en un editor Markdown

Cómo Usar

  1. Elige la dirección: "Añadir prefijo" (Base64 puro → DataURL) o "Quitar prefijo" (DataURL → Base64 puro).
  2. Pega el contenido en el cuadro izquierdo: Base64 puro en modo Añadir, o una cadena data:... en modo Quitar.
  3. En modo Añadir puedes mantener "Detección automática" o elegir un tipo MIME concreto en el desplegable.
  4. La herramienta convierte en vivo y muestra el resultado a la derecha, listo para copiar o descargar como txt.

Características

  • Conversión en dos sentidos: Base64 puro ↔ DataURL
  • 11 tipos MIME predefinidos: imagen, documento, audio, vídeo, texto
  • Detección automática de MIME mediante bytes mágicos PNG/JPEG/GIF/WEBP/PDF
  • Eliminación de espacios: limpia saltos de línea, espacios y caracteres sobrantes
  • Conversión en vivo: el resultado se recalcula 300 ms después de dejar de escribir
  • Cambio de dirección automático: entrada y salida se intercambian al cambiar de modo
  • Copiar con un clic: copia el resultado al portapapeles
  • Descargar como txt: guarda el resultado en dataurl-result.txt
  • Diseño adaptable: vista dividida arrastrable en escritorio, pestañas en móvil
  • Procesado en el navegador: el contenido no se sube a ningún servidor

Best Practices

Empieza con la detección automática

si no estás seguro del tipo MIME, mantén "Detección automática" y solo elige manualmente si falla.

Ten en cuenta el límite de tamaño

los navegadores limitan los DataURL a unos 2–4 MB, así que referencia archivos grandes por URL en lugar de incrustarlos.

Limpia caracteres sobrantes

el Base64 pegado suele traer saltos de línea que la herramienta elimina; usa el Limpiador de Base64 si necesitas una limpieza más estricta.

Verifica el resultado

tras la conversión, valida el DataURL con el Validador de Base64 o con las DevTools del navegador para confirmar que carga.

Comprueba tras pegar

revisa el resultado decodificado en la consola del navegador después de pegar en el destino para asegurarte de que coincide con lo esperado.

Preguntas Frecuentes

¿La detección automática ya está activa en modo Añadir?

Sí. La detección automática está activada por defecto e inspecciona los primeros bytes del Base64 (bytes mágicos) para identificar PNG, JPEG, GIF, WEBP o PDF. Para otros tipos MIME (p. ej. application/json, video/mp4), elige uno manualmente en el desplegable.

¿Qué pasa si la entrada ya tiene el prefijo data:?

En modo Añadir, si la entrada ya empieza por data: la herramienta la devuelve sin cambios, sin duplicar el prefijo. En modo Quitar, si la entrada no es un DataURL, la herramienta elimina los espacios y devuelve el Base64 puro.

¿Qué ocurre si la detección automática falla?

Si el Base64 no coincide con los bytes mágicos de PNG/JPEG/GIF/WEBP/PDF, la detección automática recae en application/octet-stream. Elige otro tipo MIME manualmente si necesitas uno distinto.

¿Qué tipos MIME se admiten?

image/png, image/jpeg, image/gif, image/webp, image/svg+xml, application/pdf, application/json, text/plain, text/html, audio/mpeg y video/mp4, 11 tipos habituales en total.

¿Hay límite de tamaño para los DataURL en los navegadores?

Sí. La mayoría de los navegadores limitan la longitud total de un DataURL (aprox. 2 MB–4 MB); superarlo hace que el recurso no se cargue. Para archivos grandes, usa una URL normal.

¿Dónde se pueden usar los DataURL?

En <img src> de HTML, en url() de CSS, descargas con <a href>, fetch en JavaScript, sintaxis de imagen en Markdown, recursos incrustados en datos JSON, y otros lugares similares.

¿Se eliminan automáticamente los saltos de línea y espacios del Base64?

Sí. En modo Añadir se quitan saltos de línea y espacios antes de añadir el prefijo; en modo Quitar también se eliminan los espacios tras extraer del DataURL.

¿Cambia la entrada al cambiar de dirección?

Sí. Al cambiar de dirección, la herramienta toma la salida actual como nueva entrada para que puedas seguir trabajando sin volver a pegar.

¿Se sube mi contenido a un servidor?

No. Todas las conversiones se realizan localmente en el navegador; ni la entrada ni la salida salen de tu dispositivo.

Glosario

DataURL
Esquema URI de datos definido por RFC 2397, con el formato data:[<mime>];base64,<data>; se usa como valor de src, href, url() y similares.
Tipo MIME
Identificador de tipo de medio, como image/png o application/pdf. Esta herramienta admite 11 tipos MIME habituales y puede detectarlos automáticamente.
Bytes mágicos
Bytes fijos al inicio de un archivo que sirven para identificar su tipo. Esta herramienta detecta PNG/JPEG/GIF/WEBP/PDF inspeccionando los bytes mágicos.
Base64
Codificación que representa datos binarios usando 64 caracteres imprimibles. La parte de carga útil de un DataURL es Base64.
Esquema Data URI
Protocolo URI data: definido por RFC 2397; es el nombre formal de la especificación del DataURL.

Authoritative References