Hur konverterar jag en bild till en Base64 data URI för CSS?

Släpp eller klistra in en bild (Ctrl+V), öppna sedan fliken CSS och klicka på Kopiera. Du får en background-image: url(...)-regel med data URI inbäddad. Flikarna HTML, Markdown, Rå Base64 och JSON fungerar på samma sätt.

Varför är Base64-resultatet ungefär en tredjedel större än min bild?

Base64 gör om var tredje byte till fyra texttecken, så texten blir ungefär 33 % större än filen. Därför passar data URI:er för små ikoner och logotyper, inte stora foton.

Hur kan jag göra Base64-strängen kortare?

Öppna Förminska först och ange en Maxbredd eller ett Format (WebP, JPEG eller PNG), och sänk Kvalitet för WebP eller JPEG. SVG- och GIF-filer kan inte förminskas på det här sättet; SVG får i stället en flik SVG (URL-kodad).

Kan jag göra om en Base64-sträng till en bild igen?

Ja. Växla Riktning till Base64 till bild och klistra in en data URI eller ren Base64. Den känner igen PNG, JPEG, GIF, WebP, SVG, BMP, ICO och AVIF och erbjuder sedan nedladdning. Ogiltig indata ger ett felmeddelande.

Varför misslyckas Kopiera eller ser förhandsvisningen avklippt ut för en stor bild?

Förhandsvisningen visar bara de första 2000 tecknen, men Kopiera och Ladda ner ger hela värdet. Mycket stora strängar kan överskrida webbläsarens gräns för urklipp, så använd Ladda ner eller krymp bilden först.

Är det verkligen gratis?

Ja. Alla verktyg är gratis att använda, utan konto och utan kreditkort. Arbetet utförs på din enhet istället för på våra servrar, vilket är det som gör det gratis att köra.

Laddas mina filer upp?

Nej. Dina filer öppnas och bearbetas i din webbläsare och skickas inte till LibraTool. Vissa verktyg laddar först ned en bearbetningsmotor eller AI-modell till din webbläsare; den nedladdningen innehåller inga data från dig.

Fungerar det på mobil?

Ja. Det fungerar i moderna mobilwebbläsare på iOS och Android, utan installation. Mycket stora filer kan gå långsamt eller ta slut på minne i en telefon, så använd en dator för dem.

🖼️

Gratis Bild till Base64

Konvertera en bild till en Base64-data-URI för inline-användning i CSS, HTML eller Markdown. Kopiera färdiga kodsnuttar. Kodas i din webbläsare; laddas aldrig upp.

Filstorleken beror på din enhetFiler förblir privataIngen inloggning krävsGratis för alltid

Fungerar offline när den väl lästs in

Släpp en fil här, eller klicka för att bläddra

PNG, JPG, WebP, GIF, SVG, AVIF, ICO, HEIC, HEIF · bearbetas på din enhet

eller tryck Ctrl+V för att klistra in från urklipp

Bläddra bland filer

Tips: du kan också klistra in en bild från ditt urklipp (Ctrl+V).

Dina filer lämnar aldrig din enhet. All bearbetning sker lokalt i din webbläsare.

Konvertera en bild till en Base64-data-URI som du kan klistra in direkt i CSS, HTML eller Markdown — ingen separat fil behövs. Kodas i din webbläsare; laddas aldrig upp.

Vanliga användningar

Infoga en bild i CSSBädda in en liten ikon eller bakgrund som en data-URI i ditt formatmallar.
Bädda in en bild i HTMLInfoga en logotyp eller ikon direkt i fristående HTML.
Konvertera en SVG eller ikon till Base64Förvandla en liten ikon till en data-URI för infogning.
Bädda in en bild i MarkdownInfoga en liten bild i en Markdown-fil med en data-URI.
Hämta en bilddatas-URIProducera en rå data: URI som du kan använda var som helst.

Så här fungerar det

En data-URI bäddar in en bild direkt i din kod som text, så den laddas utan en separat filförfrågan — praktisk för små ikoner och fristående HTML. Detta kodar det i din webbläsare.

1
Du släpper in en bild
Den läses lokalt med FileReader API — aldrig uppladdat.
2
Den är Base64-kodad
Bildbytena blir en data: URI (data:image/...;base64,…) direkt i din webbläsare.
3
Du väljer ett utdrag
Kopiera rå data-URI, eller färdiggjord CSS (background-image), HTML (<img>) eller Markdown.
4
Klistra in det i din kod
Bilden reser nu inline med din CSS/HTML — ingen extra fil att lagra.

Bilden kodas helt på din enhet. Observera att Base64 är ~33% större än originalet, så data-URI:er är bäst för små bilder.

Relaterade verktyg

🖼️

Bildsteganografi (Dölj text i bild)

Dölj ett hemligt textmeddelande i en PNG med minst-signifikant-bit-steganografi, med valfri AES-256-GCM-lösenordskryptering. Extrahera det senare med samma verktyg. Allt körs i din webbläsare.

Prova detFiler stannar lokalt

🔢

Base64-kodare och avkodare

Koda text eller filer till Base64, eller avkoda Base64-strängar tillbaka till klartext. Direkt, privat och gratis.

Prova det

🔗

URL-kodare och -avkodare

Koda och avkoda URL:er och frågesträngar. Stöder encodeURIComponent, decodeURIComponent och analys av frågesträngar.