Generador de Data URI

• Conversión de Texto y Archivos a Data URI: convierte cualquier contenido de texto o archivo en un data URI al instante. Escribe o pega texto directamente, o sube imágenes, documentos, fuentes y más. La herramienta detecta automáticamente el tipo MIME a partir de extensiones de archivo y patrones de contenido, y genera un data URI correctamente formateado listo para incrustar.
• Detección Inteligente de Tipo MIME: detecta automáticamente tipos MIME a partir de más de 60 extensiones de archivo y más de 10 patrones de contenido. Detecta HTML, JSON, SVG, CSS, JavaScript, Markdown, CSV y más a partir del contenido de texto. Para archivos, lee el tipo de contenido y asigna las extensiones al tipo MIME correcto para una generación precisa.
• Análisis de Tamaño y Recomendaciones: consulta el tamaño original, el tamaño del data URI y el porcentaje de sobrecarga en cada conversión. Obtén recomendaciones sobre si un data URI es adecuado para tu caso de uso: los data URIs de menos de 10 KB son ideales, mientras que los archivos más grandes deberían usar URLs tradicionales para un mejor rendimiento.
• Procesamiento 100 % en el Cliente: todas las conversiones ocurren íntegramente en tu navegador. Los archivos se leen localmente con la API FileReader, el texto se codifica en memoria y nunca se sube ningún dato a ningún servidor. Tu contenido de texto y tus archivos permanecen totalmente privados en tu dispositivo.

• Imágenes en Línea en HTML y CSS: incrusta iconos, logotipos y gráficos pequeños directamente en HTML usando data URIs en lugar de archivos de imagen separados. Usa nuestro generador para convertir imágenes PNG, SVG y WebP en data URIs para fondos en línea, etiquetas y pseudoelementos CSS. Elimina peticiones HTTP adicionales y mejora el tiempo de carga para recursos pequeños.
• Firmas de Correo Autocontenidas: crea firmas de correo que se muestren correctamente sin alojamiento externo de imágenes incrustándolas como data URIs. Convierte tu logotipo y tus iconos de redes sociales en data URIs e inclúyelos directamente en tu firma HTML. Las imágenes se muestran correctamente en la mayoría de los clientes de correo sin depender de servidores externos.
• Prototipos HTML de un Solo Archivo: crea prototipos HTML autocontenidos que funcionen sin conexión con todos los recursos incrustados como data URIs. Convierte CSS, JavaScript, imágenes y fuentes en data URIs e inclúyelos directamente en un único archivo HTML. Perfecto para compartir prototipos, demos y pruebas de concepto que deben funcionar sin dependencias externas.
• Recursos para Campañas de Correo: incrusta imágenes y estilos directamente en campañas de correo HTML para garantizar un renderizado coherente en los clientes de correo. Muchos clientes bloquean las imágenes externas por defecto, pero los data URIs se muestran de inmediato porque forman parte del cuerpo del correo. Convierte imágenes destacadas pequeñas, logotipos e iconos para una entrega fiable.
• Contenido para WebView en Apps Móviles: carga contenido en WebViews de apps móviles sin peticiones de red incrustando recursos como data URIs. Convierte HTML, CSS, imágenes y fuentes en data URIs para contenido WebView que funciona sin conexión. Garantiza que el contenido de tu app cargue al instante, independientemente de la conectividad.
• Herramientas y Automatización de Desarrollo Web: usa nuestro generador en flujos de desarrollo web: convierte SVG en data URIs para sprite sheets de JavaScript, codifica fuentes para declaraciones CSS @font-face o incorpora datos de configuración JSON. La herramienta ofrece una detección precisa de tipos MIME tanto para flujos automatizados como manuales.

Un data URI (Uniform Resource Identifier) es un esquema de URL que permite incrustar datos directamente en documentos HTML, CSS y JavaScript con el formato data:[tipo-MIME];base64,... A diferencia de las URLs normales que apuntan a archivos externos, los data URIs contienen los datos reales en línea: el navegador decodifica el contenido codificado en Base64 y lo renderiza directamente sin hacer una petición HTTP. Los data URIs se definieron en el RFC 2397 y son compatibles con todos los navegadores modernos. Entre los tipos MIME habituales están image/png, image/svg+xml, text/html, application/json y font/woff2.

1. Introduce el Contenido: elige entre entrada de texto (escribe o pega contenido) o subida de archivo (arrastra y suelta o explora). Para la entrada de texto, puedes anular opcionalmente el tipo MIME autodetectado con el selector desplegable.
2. Detección del Tipo MIME: para archivos, el tipo MIME se detecta a partir de la extensión (más de 60 admitidas). Para texto, el contenido se analiza buscando patrones comunes: etiquetas HTML, objetos JSON, reglas CSS, elementos SVG, encabezados Markdown y más. Puedes anular manualmente el tipo MIME detectado.
3. Codificación y Generación: el contenido de texto se codifica a bytes con UTF-8 y luego en Base64. Los archivos se leen con la API FileReader mediante readAsDataURL, que produce directamente el data URI correctamente formateado. La herramienta calcula estadísticas de tamaño y ofrece recomendaciones.

• Usa Data URIs para: imágenes pequeñas de menos de 10 KB (iconos, logotipos, elementos decorativos), fuentes para @font-face con conjuntos de caracteres pequeños, SVG en línea, correos HTML autocontenidos, prototipos de un solo archivo, favicons y datos de configuración JSON pequeños incrustados en scripts.
• Usa URLs Normales para: imágenes grandes, archivos de audio y vídeo, documentos descargables (PDF, DOCX), recursos que cambian con frecuencia (el almacenamiento en caché es más eficiente con URLs) y cualquier recurso de más de 100 KB en el que la sobrecarga de Base64 (aproximadamente el 33 %) inflaría considerablemente tu HTML o CSS.
• Consideraciones de Rendimiento: los data URIs nunca se almacenan en caché por separado del documento principal: si usas el mismo data URI en varias páginas, se descarga con cada página. Los data URIs también bloquean el renderizado en CSS background-images hasta que el recurso principal se carga y analiza por completo.

Nuestro generador de Data URI procesa todo localmente en tu navegador. El texto se codifica en memoria con la API TextEncoder, los archivos se leen con la API FileReader y nunca se envía ningún dato a ningún servidor. La herramienta es 100 % gratuita, sin registro, sin cuenta y sin límites de uso.

Limitaciones importantes: los data URIs tienen un límite de longitud en la mayoría de los navegadores (normalmente en torno a 2-4 MB para imágenes en etiquetas <img>). Los archivos muy grandes pueden causar problemas de memoria del navegador al codificarse. La sobrecarga de la codificación Base64 es de aproximadamente el 33 %: un archivo de 10 KB pasa a unos 13,3 KB como data URI. Para archivos de más de 100 KB, considera seriamente usar URLs de archivo tradicionales para un mejor rendimiento y almacenamiento en caché.