Base64 DataURL Converter

Puur Base64
0 tekens

Online tool om te schakelen tussen pure Base64 en het volledige data-URL-formaat, met automatische MIME-detectie.

Gerelateerde aanbevelingen

Base64 Codering

Base64 Decoderen

Base64 meerregelige samenvoegen

Base64 naar Afbeelding

Afbeelding naar Base64

Base64 Opschonen

Wat is een Base64 DataURL?

Een DataURL is een URI-schema dat gegevens rechtstreeks in de URL insluit, in de vorm data:[<MIME-type>];base64,<Base64-data>. Hiermee kun je kleine bronnen zoals afbeeldingen, PDF's en lettertypes inline opnemen in HTML, CSS of JavaScript, zonder extra HTTP-verzoeken.

**Pure Base64 vs DataURL:** pure Base64 is alleen de gecodeerde tekenreeks (bijv. iVBORw0KGgo...); een DataURL is een volledige URI met het voorvoegsel data: en een MIME-type, klaar om te gebruiken als waarde van src, href, url() en meer.

**Wat deze tool doet:** converteert tussen "pure Base64-strings" en "volledige DataURL's" — het voegt automatisch het voorvoegsel data: en een MIME-type toe aan bestaande Base64, of haalt het pure Base64-gedeelte uit een DataURL.

**Typische toepassingen:** ① achtergrondafbeelding in CSS; ② inline src in HTML <img>; ③ inline afbeelding in Markdown; ④ afbeeldingen plakken in rich-text-editors; ⑤ foutopsporing van het data-URI-schema.

Toepassingsgevallen

  • Voeg het voorvoegsel data: en een MIME-type toe aan bestaande Base64 om een DataURL te krijgen die direct in HTML ingebed kan worden
  • Haal het pure Base64-gedeelte uit een DataURL om het opnieuw samen te stellen of te versturen
  • Controleer bij debugging of de Base64-payload van een front-end data:-URI compleet is
  • Detecteer automatisch het MIME-type van Base64 die je naar het klembord hebt gekopieerd (PNG/JPEG/PDF, enz.)
  • Bereid een data-URL voor op CSS background-image of HTML <img src>
  • Vorm afbeelding-Base64 om tot een plakklare DataURL in een Markdown rich-text-editor

Hoe te gebruiken

  1. Kies een richting: "Voorvoegsel toevoegen" (pure Base64 → DataURL) of "Voorvoegsel verwijderen" (DataURL → pure Base64).
  2. Plak de inhoud in het linkervak: pure Base64 in modus Toevoegen, of een data:...-tekenreeks in modus Verwijderen.
  3. In modus Toevoegen kun je "Automatisch detecteren" aanhouden of een specifiek MIME-type kiezen in de dropdown.
  4. De tool converteert live en toont het resultaat rechts, klaar om te kopiëren of te downloaden als txt.

Functies

  • Twee richtingen: pure Base64 ↔ DataURL
  • 11 MIME-type-presets: afbeelding, document, audio, video, tekst
  • Automatische MIME-detectie via magic bytes voor PNG/JPEG/GIF/WEBP/PDF
  • Witruimte verwijderen: haalt nieuwe regels, spaties en ruis weg
  • Live conversie: resultaat wordt 300 ms na invoer herberekend
  • Richting wisselt invoer en uitvoer automatisch om
  • Kopiëren met één klik: kopieer het resultaat naar het klembord
  • Downloaden als txt: sla het resultaat op in dataurl-result.txt
  • Responsieve layout: versleepbare split op desktop, tabs op mobiel
  • Puur in de browser: inhoud wordt niet naar een server geüpload

Best Practices

Begin met automatische detectie

bij twijfel over het MIME-type laat je "Automatisch detecteren" aan en kies je alleen handmatig als detectie faalt.

Houd rekening met groottelimieten

browsers beperken DataURL's tot ca. 2–4 MB; verwijs naar grote bestanden via een URL in plaats van ze in te bedden.

Verwijder ruis

geplakte Base64 bevat vaak nieuwe regels die de tool automatisch weghaalt; gebruik de Base64 Cleaner voor een grondigere opschoning.

Controleer het resultaat

valideer de DataURL na conversie met de Base64 Validator of de DevTools van de browser om te bevestigen dat hij laadt.

Inspecteer na het plakken

bekijk het gedecodeerde resultaat in de browserconsole nadat je het op de doellocatie hebt geplakt om te zien of het aan je verwachting voldoet.

Veelgestelde vragen

Staat automatische detectie al aan in modus Toevoegen?

Ja. Automatische detectie staat standaard aan en bekijkt de eerste bytes van de Base64 (magic bytes) om PNG, JPEG, GIF, WEBP of PDF te herkennen. Kies handmatig een type in de dropdown voor andere MIME-types (bijv. application/json, video/mp4).

Wat gebeurt er als de invoer al het voorvoegsel data: heeft?

In modus Toevoegen geeft de tool de invoer ongewijzigd terug als deze al met data: begint — het voorvoegsel wordt niet gedupliceerd. In modus Verwijderen verwijdert de tool de witruimte en geeft pure Base64 terug als de invoer geen DataURL is.

Wat als automatische detectie faalt?

Als de Base64 niet overeenkomt met een magic byte van PNG/JPEG/GIF/WEBP/PDF, valt de automatische detectie terug op application/octet-stream. Kies handmatig een ander MIME-type als dat nodig is.

Welke MIME-types worden ondersteund?

image/png, image/jpeg, image/gif, image/webp, image/svg+xml, application/pdf, application/json, text/plain, text/html, audio/mpeg en video/mp4 — 11 gangbare types in totaal.

Zijn er limieten op de grootte van DataURL's in browsers?

Ja. De meeste browsers beperken de totale lengte van een DataURL (ca. 2 MB–4 MB); daarboven laden bronnen niet. Gebruik voor grote bestanden een gewone URL.

Waar kun je DataURL's gebruiken?

In <img src> van HTML, in url() van CSS, in downloads via <a href>, in fetch van JavaScript, in de afbeelding-syntax van Markdown, in ingebedde bronnen in JSON-data, en soortgelijke plekken.

Worden nieuwe regels en spaties in Base64 automatisch verwijderd?

Ja. In modus Toevoegen worden nieuwe regels en spaties verwijderd vóór het voorvoegsel wordt toegevoegd; in modus Verwijderen wordt witruimte ook verwijderd na extractie uit de DataURL.

Verandert de invoer wanneer ik van richting wissel?

Ja. Bij het wisselen van richting gebruikt de tool de huidige uitvoer als nieuwe invoer, zodat je door kunt gaan zonder opnieuw te plakken.

Wordt mijn inhoud naar een server geüpload?

Nee. Alle conversies draaien lokaal in je browser; invoer en uitvoer verlaten je apparaat niet.

Woordenlijst

DataURL
Het data-URI-schema uit RFC 2397, in de vorm data:[<mime>];base64,<data>, te gebruiken als waarde van src, href, url() en dergelijke.
MIME-type
Identificatie van een mediatype zoals image/png of application/pdf. Deze tool ondersteunt 11 gangbare MIME-types en kan ze automatisch detecteren.
Magic Bytes
Vaste bytes aan het begin van een bestand die het type aangeven. Deze tool herkent PNG/JPEG/GIF/WEBP/PDF aan de hand van magic bytes.
Base64
Codering die binaire gegevens voorstelt met 64 afdrukbare tekens. Het payload-gedeelte van een DataURL is Base64.
Data URI-schema
Het data:-URI-protocol uit RFC 2397; de formele naam van de specificatie voor DataURL.

Authoritative References