Base64-bestandsconverter

Codeer elk bestand of elke afbeelding naar een Base64-data-URI en decodeer een data-URI terug naar een downloadbaar bestand.

Tool laden…

Base64-bestandsconverterZet elk bestand of elke afbeelding om in een Base64-data-URI die je rechtstreeks in CSS of HTML kunt plakken, en decodeer een data-URI met één downloadklik weer naar het oorspronkelijke bestand. Alles draait voor 100% in je browser met FileReader en atob, dus het bestand dat je neerzet verlaat nooit je apparaat en wordt nooit naar een server geüpload.

Wat is Base64-bestandsconverter?

De Base64-bestandsconverter is een gratis tool die in de browser werkt en converteert tussen binaire bestanden en Base64-data-URI's. Webontwikkelaars gebruiken hem om kleine afbeeldingen, lettertypen of iconen rechtstreeks in stylesheets en markup in te sluiten, waarmee een extra netwerkverzoek vervalt; QA-teams en supportmedewerkers gebruiken de decodeerkant om een bestand te herstellen dat hun als een lange data-URI is toegestuurd. Gebruik Coderen om een bestand neer te zetten en de data-URI te kopiëren (desgewenst al verpakt als een CSS-background-image-regel of een HTML-img-tag), en gebruik Decoderen om een data-URI te plakken en het herstelde bestand te downloaden. Afbeeldingsinvoer en gedecodeerde afbeeldingen tonen een voorbeeld dat je kunt aanklikken om te vergroten.

Base64-bestandsconverter gebruiken

  1. Kies bovenaan een modus met de Coderen / Decoderen-schakelaar.
  2. Om te coderen sleep of kies je een bestand (of afbeelding) in het uploadgebied; de Base64-data-URI verschijnt direct in het uitvoervak.
  3. Open Instellingen om het uitvoerformaat te kiezen: een ruwe data-URI, een CSS-background-image-regel of een HTML-img-tag.
  4. Druk op de knop Kopiëren om de data-URI op je klembord te zetten.
  5. Om te decoderen schakel je naar Decoderen en plak je een data-URI in het tekstveld; een voorbeeld en bestandsgegevens verschijnen.
  6. Klik op de knop Downloaden om het herstelde bestand op je apparaat op te slaan.

Voorbeelden

Een klein PNG-icoon in CSS insluiten

Codeermodus: zet een icon.png van 2 KB neer, stel het formaat in op CSS en kopieer de regel background-image: url("data:image/png;base64,…") rechtstreeks in je stylesheet.

Een als data-URI ontvangen bestand herstellen

Decodeermodus: plak een tekenreeks data:application/pdf;base64,… en klik op Downloaden om report.pdf terug te krijgen zonder enige serverronde.

Een Base64-afbeelding bekijken voordat je hem gebruikt

Decodeermodus: plak een tekenreeks data:image/jpeg;base64,… en de afbeelding wordt in het voorbeeldvak weergegeven; klik erop om hem op volledige grootte in de lightbox te bekijken.

Veelgestelde vragen

Welke soorten bestanden kan ik coderen?
Elk bestand werkt: afbeeldingen, PDF's, lettertypen, archieven, JSON, platte tekst en meer. De tool leest het bestand met de FileReader van de browser en maakt een Base64-data-URI met het juiste MIME-type.
Waarom is de Base64-uitvoer groter dan mijn bestand?
Base64 codeert 3 databytes in 4 tekens, dus een data-URI is ongeveer 33% groter dan het oorspronkelijke bestand. Die afweging is normaal en is de prijs van het insluiten van binaire data als tekst.
Welke bestandsnaam krijg ik bij het decoderen?
De tool leest het MIME-type uit de data-URI en benoemt de download dienovereenkomstig, zoals decoded.png of decoded.pdf. Is het type onbekend, dan valt hij terug op de extensie .bin.
Kan het een kale Base64-tekenreeks zonder het data:-voorvoegsel decoderen?
Ja. Als je een kale Base64-payload zonder data:-header plakt, wordt deze gedecodeerd als een generiek binair bestand (application/octet-stream) en als .bin-download aangeboden.
Wordt mijn bestand ergens geüpload?
Nee. Coderen en decoderen draaien beide volledig aan de clientzijde in je browser; er wordt niets geüpload en geen server gecontacteerd, dus je bestanden blijven privé op je apparaat.

Gerelateerde tools