Data URI Generator — Create Base64 Data URIs Online

Generate data: URIs from text input or file upload. Select the MIME type, encode to Base64, and get a ready-to-use data URI for embedding in HTML, CSS, or JavaScript.

What are data URIs?

Data URIs (also called data URLs) allow you to embed file content directly in HTML, CSS, or JavaScript using the format: data:[mediatype][;base64],data. This eliminates the need for separate HTTP requests, making pages load faster for small assets.

They're commonly used for small images (icons, logos), CSS backgrounds, custom fonts, and inline SVG. The trade-off is a ~33% size increase due to Base64 encoding, so they're best suited for files under 10KB.

Common MIME types

  • Images: image/png, image/jpeg, image/gif, image/svg+xml, image/webp
  • Text: text/plain, text/html, text/css, text/javascript
  • Application: application/json, application/pdf, application/xml

Best practices

  • Use data URIs for small files (under 10KB) to reduce HTTP requests
  • For larger files, use regular URLs — Base64 increases size by ~33%
  • Always specify the correct MIME type for the content

FAQs

What is a data URI?

A data URI is a way to embed file content directly into web documents using the data: scheme. Instead of linking to an external file, the content is Base64-encoded and included inline, reducing HTTP requests.

When should I use data URIs vs regular URLs?

Use data URIs for small, frequently used assets like icons and small images (under 10KB). For larger files, regular URLs are better because data URIs increase file size by ~33% and can't be cached separately.

Are data URIs supported in all browsers?

Yes. All modern browsers support data URIs. The main limitation is size — some browsers have maximum length limits for data URIs, typically around 2MB, though this varies by browser.

Herramientas relacionadas

Codificador y decodificador Base64 en línea

Codifica o decodifica cadenas Base64 directamente en tu navegador

Codificador y decodificador de texto

Convierte texto a Base64 o decodifica Base64 a texto plano

Imagen a Base64

Convierte imágenes a cadenas codificadas Base64

Base64 a imagen

Decodifica cadenas Base64 a imágenes visibles

Archivo a Base64

Codifica cualquier archivo a una cadena Base64

Base64 to File

Decode any Base64 string back to its original file

Base64 a PDF

Decodifica cadenas Base64 a documentos PDF

Decodificador JWT

Decodifica e inspecciona tokens JWT

Codificador/Decodificador URL

Codifica o decodifica URLs con codificación porcentual

Codificador/Decodificador HTML

Convierte caracteres especiales a entidades HTML y viceversa

Convertidor Hex ↔ Base64

Convierte entre formatos hexadecimal y Base64

Base64 to Text

Decode Base64 strings to plain readable text

Base64 Validator

Check if a string is valid Base64 encoding

Base64 to JSON

Decode Base64 and pretty-print as formatted JSON

Base64 to Hex

Convert Base64 strings to hexadecimal and back

SVG to Data URI

Convert SVG to data URIs for CSS and HTML

UTF-8 Encoder & Decoder

Encode text to UTF-8 bytes or decode bytes to text

Artículos relacionados

Data URLs Explained: Using Base64 in HTML and CSS Base64 Image Encoding for HTML and CSS