> PNG | encode | data-uri <

S: Den konverterer det binære innholdet i en .png-fil til en ASCII-streng ved hjelp av Base64-alfabetet definert i RFC 4648. Den kodede teksten kan slippes rett inn i en HTML-<img>-tag, en CSS-background-image, en e-postmelding, en JSON-API-nyttelast eller hvilken som helst annen ren-tekst-transport. Selve PNG-bytene er uendret — hver IHDR-, IDAT-, tRNS- og IEND-chunk kodes og kan gjenopprettes nøyaktig.

S: Dra PNG-en din inn i slippsonen (eller klikk for å bla). Verktøyet leser filen med FileReader.readAsDataURL(), som allerede returnerer en bruksklar data:image/png;base64,…-URI. Velg Data-URI hvis du vil lime den direkte inn i <img src="…">, eller Kun Base64-nyttelast hvis API-et/databasen din forventer den rå Base64-delen uten prefikset data:image/png;base64,.

S: Nei. Base64 er en ren binær-til-tekst-transformasjon — hver byte i den opprinnelige PNG-en bevares, inkludert alfakanalen, paletten og fargeprofilen (iCCP/sRGB-chunker). Når du dekoder strengen tilbake, er filen bit-identisk med originalen. En SHA-256-hash av den dekodede PNG-en vil matche originalen. Det er derfor Base64 er det rette verktøyet for å bygge inn ikoner, logoer og skjermbilder der pikselnøyaktighet betyr noe.

S: Base64 bruker 4 tegn for hver 3 inn-byte, så den kodede strengen er ~33 % større enn den opprinnelige PNG-filen. Den nøyaktige størrelsen er 4 × ⌈n / 3⌉ tegn, der n er PNG-størrelsen i byte. En 10 KB PNG blir ~13,6 KB Base64-tekst. Siden HTTP-komprimering (gzip, Brotli) håndterer Base64-tekst ganske godt, er overheaden over nettet vanligvis nærmere 10–15 % i praksis.

S: Hver PNG-Base64-streng begynner med iVBORw0KGgo. Det prefikset er den 8-byte PNG-signaturen 89 50 4E 47 0D 0A 1A 0A omkodet til Base64. Så iVBORw0KGgoAAAANSUhEUg... er alltid en PNG, og å se det prefikset er en rask visuell kontroll på at dataene dine er intakte. Når den pakkes som en data-URI ser den slik ut:
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==

S: Lim hele data-URI-en inn i src-attributtet til en <img>-tag:
<img src="data:image/png;base64,iVBORw0KGgo…" alt="logo">
Nettleseren dekoder Base64-nyttelasten og gjengir PNG-en akkurat som om den ble lastet fra en URL. Ingen ekstra HTTP-forespørsel gjøres, noe som er nyttig for kritiske ikoner, e-postsignaturer og offline-first-apper.

S: Pakk data-URI-en inn i url()-funksjonen:
.icon { background-image: url('data:image/png;base64,iVBORw0KGgo…'); }
For gjenbruk, lagre den i en CSS-egendefinert egenskap:
:root { --logo: url('data:image/png;base64,iVBORw0KGgo…'); }
.brand { background: var(--logo); }
Innebygde bakgrunner eliminerer én HTTP-forespørsel per ikon, men blåser opp CSS-filen din, så bruk dem kun for små ikoner (< 4 KB).

S:
JavaScript (nettleser): const uri = await new Promise(r => { const f = new FileReader(); f.onload = () => r(f.result); f.readAsDataURL(pngFile); });
Node.js: fs.readFileSync('logo.png').toString('base64')
Python: import base64; base64.b64encode(open('logo.png','rb').read()).decode()
PHP: base64_encode(file_get_contents('logo.png'))
Go: base64.StdEncoding.EncodeToString(pngBytes)
Ruby: Base64.strict_encode64(File.read('logo.png'))

S: Bruk Base64-PNG-data-URI-er når:
• bildet er < 4 KB (for å spare en HTTP-tur)
• du må bygge det inn i en HTML-e-post (mange klienter blokkerer eksterne bilder)
• du leverer en HTML-rapport eller -dashbord i én enkelt fil
• du lagrer bildet inne i en JSON-nyttelast eller en databasekolonne
Foretrekk en ekstern .png-fil når bildet er stort, gjenbrukes på mange sider eller trenger separat CDN-bufring.

S: Ja. Siden Base64 er en bit-for-bit-transformasjon, støttes hver PNG-fargemodus likt:
• RGBA / truecolor + alfa — 32-bits farge, full gjennomsiktighet
• Palett (PLTE) + tRNS — indekserte palett-PNG-er med 1-bits gjennomsiktighet
• Gråtoner + alfa — 8/16-bits gråtoner med alfa
• 16-bits deep color-PNG-er — HDR-aktige PNG-er brukt i medisinsk bildebehandling og vitenskapelig visualisering
Alle disse går rent gjennom Base64 og vises korrekt i nettlesere som forstår PNG.

S: Nei. Base64 er en koding, ikke kryptering. Alle som kan lese strengen kan dekode den tilbake til den opprinnelige PNG-en på millisekunder. Hvis et skjermbilde inneholder et passord, et API-token eller personlig informasjon, beskytter ikke Base64-koding det — bruk et ekte krypteringslag (AES-GCM, age, PGP) oppå Base64-utdataene, eller transporter bildet over TLS til en server som anvender tilgangskontroller.

S: Det finnes ingen kunstig grense. Siden kodingen kjører lokalt, er grensen nettleserens minne — vanligvis 100 MB+ på skrivebord og 40–60 MB på mobil. For svært store PNG-er (medisinske bilder eller satellittbilder i høy oppløsning) leser vi filen i biter og kaller btoa() på hver bit slik at hovedtråden forblir responsiv. Hvis bildet ditt er større enn ~100 MB, vurder å strømme det direkte fra en server-side koder i stedet for å laste det inn i nettleseren.

S: Bruk PNG → Base64 for logoer, UI-ikoner, skjermbilder, diagrammer og alt med gjennomsiktighet eller skarpe kanter (tekst, diagrammer). PNG er tapsfri og alfa-bevisst. Bruk JPG → Base64 for fotografier eller bilder med mange farger der tapsbasert komprimering er akseptabelt. JPEG-filer er vanligvis 5–20× mindre enn PNG for foto, så Base64-nyttelasten er mye kortere. Som tommelfingerregel: hvis bildet kom fra et kamera eller inneholder fotografiske gradienter, bruk JPG; ellers PNG.