Softonic

Afbeelding naar Base64-converter

Stap 1 / 3
Geselecteerd bestand herstellen...

Een Base64-data-URL combineert het mediatype en de gecodeerde bytes van een afbeelding in één tekstwaarde, zoals data:image/png;base64,.... Kies een afbeelding tot 20 MiB en de converter maakt die waarde lokaal in uw browser. Vóór het kopiëren ziet u de oorspronkelijke bestandsgegevens en de geschatte lengte van de gemaakte data-URL.

Hoe je een afbeelding base64-encodeert

  1. 1

    Kies een afbeelding

    Selecteer één afbeeldingsbestand van maximaal 20 MiB.

  2. 2

    Codeer lokaal

    De browser leest het bestand en maakt zonder upload een volledige Base64-data-URL.

  3. 3

    Controleer het resultaat

    Bekijk het mediatype, de bestandsgegevens en de geschatte lengte van de gemaakte data-URL.

  4. 4

    Kopieer de data-URL

    Kopieer de volledige waarde `data:image/...;base64,...` naar het klembord.

Wanneer je moet inlijnen en wanneer je moet koppelen

Base64-inbedding bespaart een HTTP-verzoek ten koste van een toename van de bestandsgrootte met 33%, de moeite waard voor sommige bestanden, verspilling voor andere.

Grootteberekening

Oorspronkelijke grootte Base64-grootte Extra bytes
1 KB 1.36 KB 360 B
10 KB 13.6 KB 3.6 KB
100 KB 136 KB 36 KB
1 MB 1.36 MB 360 KB

Beslissingsgids

Gebruiksscenario Inline of extern
Icoon onder 2 KB (SVG-logo of sprite) Inline
Cursorafbeelding in CSS (cursor: url()) Inline
Kleine zelfstandige HTML- of CSS-demo Inline
Icoon opgenomen in een JavaScript-payload Inline
Hero-afbeelding, groter dan 50 KB Extern
Alles wat apart kan worden gecachet Extern

Formaat van een gegevens-URI

data:[<mediatype>][;base64],<data>

Voorbeelden:

  • data:image/png;base64,iVBORw0KGgo..., PNG
  • data:image/svg+xml;utf8,<svg>...</svg>, SVG; vaak beter inline weergegeven zonder Base64
  • data:image/jpeg;base64,/9j/4AAQS..., JPG

Tips

  • SVG is vaak beter als url() met de codering utf8 in plaats van Base64; korter en leesbaarder.
  • Codering controleert of zuivert de afbeelding niet. Sluit alleen vertrouwde bestanden in, vooral SVG, dat actieve of externe inhoud kan bevatten.
  • Grote afbeeldingen binnen JSON-payloads kunnen het verwerken belemmeren als ze zeer groot zijn; overweeg gebruik van multipart of externe referenties.
  • Een CSS-background-image met base64 wordt netjes inline weergegeven, maar belemmert het cachen tussen pagina's.

Veelgestelde vragen

Base64 codeert drie bytes invoer als vier karakters; de uitvoer is daarom altijd ongeveer 33% groter dan de invoer. Een afbeelding van 10 KB levert een string van circa 13.600 karakters op. Langere strings zijn gebruikelijk.

De converter accepteert één afbeelding tot 20 MiB. Dat is een verwerkingslimiet, geen advies voor inbedding. Houd data-URL’s bij voorkeur klein, want Base64 voegt ongeveer een derde toe en verhindert afzonderlijke caching.

Nee, de Base64-encoding wordt uitgevoerd in uw browser. Het beeld verlaat uw apparaat nooit.

Niet in deze encoder. Gebruik de aparte tool Base64 naar afbeelding om een data-URL of ruwe Base64-string weer als afbeeldingsbestand te downloaden.

Gerelateerde tools

Material Design-kleurkiezer

Blader door het Material Design-kleurenpalet. Kopieer elke tint (van 50 tot A700) als HEX-, RGB- of HSL-waarde met één tik.

Gelinieerd papier generator

Maak gratis afdrukbaar gelinieerd papier. Kies college-, brede of smalle liniëring, stel de regelafstand in mm, het papierformaat en een kantlijn in, en druk af of download de SVG.

Ruitjespapier-generator

Maak online afdrukbaar ruitjespapier: kies een ruit- of stippenraster, stel de afstand in mm in, kies A4 of Letter en een eigen lijnkleur, en print of download een strak SVG-bestand.

Contactblad maken

Rangschik foto’s op afdrukbare A4- of Letter-contactbladen met bijschriften en voorvertoning en download JPEG-pagina’s of een pdf.

Kruissteekpatroon maken

Zet JPEG, PNG of WebP om in een afdrukbaar kruissteekpatroon van 10–150 steken met 2–40 eigen kleuren, symbolen, exacte aantallen en stofmaten.

Instagram-grid-splitter

Verdeel een brede afbeelding in een 3×3 Instagram-grid, of in een willekeurig aantal rijen. De tegels zijn genummerd, zodat je ze eenvoudig in omgekeerde volgorde kunt uploaden.

Tool beschikbaar in andere talen