Bilde til Base64
Slipp et hvilket som helst bilde inn i denne bilde til Base64-konvertereren for å få en data-URI og klare-til-å-lime-inn-snutter for HTML, CSS og JavaScript. Innebygde bilder sparer HTTP-forespørsler for små ikoner, og de er essensielle for enkeltfil-HTML, e-postmaler og offline-apper.
Slik konverterer du Bilde til Base64 online
- Velg en bildefil eller lim inn en bilde-URL.
- Velg utdata: data-URI,
<img>, CSS-bakgrunn, favicon, JSON og mer. - Klikk Kode bilde til Base64.
- Forhåndsvis bildet og kopier koden.
Flere Bilde til Base64-konverterere
Utdataformater
Velg hvordan resultatet skal pakkes inn. Konvertereren kan returnere:
- txt: bare Base64-strengen, klar til å lime inn i kode, et databasefelt eller en API-forespørsel.
- uri: en komplett
data:-URI som du kan lime inn i nettleserens adresselinje eller bruke der en URL godtas. - html img: en
<img>-tagg med data-URI isrc. - css background image: en CSS-regel som bruker
background-image: url(data:...). - html favicon: en
<link rel="icon">-tagg for et innebygd favicon. - html hyperlink: en
<a>-lenke som laster ned eller åpner den innebygde filen. - html iframe: en
<iframe>som renderer innholdet innebygd. - javascript image: JavaScript som oppretter et
Image-objekt. - javascript popup: JavaScript som åpner innholdet i et nytt vindu.
- json: et JSON-objekt med filnavn, MIME-type og data.
- xml: et XML-element med dataene inne i en CDATA-seksjon.
Når bør du bygge inn bilder som Base64?
Bygg inn små bilder (under omtrent 5–10 KB) som ikoner, logoer og plassholdere for å spare forespørsler. Unngå å bygge inn store bilder: de gjør HTML/CSS tyngre, kan ikke caches separat og forsinker rendering. For en detaljert gjennomgang, se data-URI-er forklart.
Ofte stilte spørsmål
Hvordan konverterer jeg et bilde til Base64?
Velg bildet ditt, velg «Data-URI» eller «<img>» som utdata, og klikk «Kode bilde til Base64». Kopier resultatet inn i HTML eller CSS.
Hvilke bildeformater støttes?
Alle formater nettleseren din kan lese: PNG, JPG/JPEG, GIF, WebP, SVG, BMP, ICO, AVIF, TIFF og flere.
Hvordan bruker jeg et Base64-bilde i HTML?
Sett data-URI-en i src-attributtet: <img src="data:image/png;base64,iVBORw0KGgo..." alt="">.
Kommentarer (0)
Spørsmål, idéer eller en feil i «Bilde til Base64»? Legg igjen en kommentar, vurder verktøyet, eller svar andre.
Ingen kommentarer ennå. Bli den første til å dele tilbakemeldingen din!