Miten muunnan kuvan Base64-data-URI:ksi CSS:ää varten?

Pudota tai liitä kuva (Ctrl+V), avaa sitten CSS-välilehti ja napsauta Kopioi. Saat background-image: url(...) -säännön, johon data-URI on upotettu. HTML-, Markdown-, Raw Base64- ja JSON-välilehdet toimivat samoin.

Miksi Base64-tuloste on noin kolmanneksen suurempi kuin kuvani?

Base64 muuttaa jokaiset 3 tavua 4 tekstimerkiksi, joten teksti on noin 33 % suurempi kuin tiedosto. Siksi data-URI:t sopivat pieniin kuvakkeisiin ja logoihin, eivät suuriin valokuviin.

Miten saan Base64-merkkijonon lyhyemmäksi?

Avaa ensin Pienennä ja aseta Enimmäisleveys tai Muoto (WebP, JPEG tai PNG) ja laske WebP:n tai JPEG:n Laatua. SVG- ja GIF-tiedostoja ei voi pienentää näin; SVG:lle on sen sijaan SVG (URL-koodattu) -välilehti.

Voinko muuttaa Base64-merkkijonon takaisin kuvaksi?

Kyllä. Vaihda Suunnaksi Base64 kuvaksi ja liitä data-URI tai pelkkä Base64. Se tunnistaa PNG-, JPEG-, GIF-, WebP-, SVG-, BMP-, ICO- ja AVIF-muodot ja tarjoaa sitten latauksen. Virheellinen syöte näyttää virheen.

Miksi Kopioi epäonnistuu tai esikatselu näyttää katkenneelta suuressa kuvassa?

Esikatselu näyttää vain 2000 ensimmäistä merkkiä, mutta Kopioi ja Lataa antavat koko arvon. Hyvin suuret merkkijonot voivat ylittää selaimen leikepöydän rajan, joten käytä Lataa tai pienennä kuva ensin.

Onko se todella ilmainen?

Kyllä. Jokainen työkalu on ilmainen, eikä vaadi tiliä tai luottokorttia. Työ tehdään laitteellasi palvelimiemme sijaan, minkä ansiosta se pysyy maksuttomana.

Ladataanko tiedostoni palvelimelle?

Ei. Tiedostosi avataan ja käsitellään selaimessasi, eikä niitä lähetetä LibraToolille. Jotkin työkalut lataavat ensin selaimeesi käsittelymoottorin tai tekoälymallin; tämä lataus ei sisällä mitään tietojasi.

Toimiiko se mobiililla?

Kyllä. Se toimii nykyaikaisissa mobiiliselaimissa iOS:llä ja Androidilla, eikä mitään tarvitse asentaa. Hyvin suuret tiedostot voivat olla puhelimessa hitaita tai muisti voi loppua, joten käytä niihin tietokonetta.

🖼️

Kuva Base64:ksi ilmaiseksi

Muunna kuva Base64-data-URI:ksi upottamista varten CSS:ään, HTML:ään tai Markdowniin. Kopioi valmiit koodinpätkät. Koodataan selaimessasi; ei koskaan ladata.

Tiedostokoko riippuu laitteestasiTiedostot pysyvät yksityisinäEi kirjautumista tarvitaIlmainen ikuisesti

Toimii offline-tilassa kerran ladattuna

Pudota tiedosto tähän tai valitse napsauttamalla

PNG, JPG, WebP, GIF, SVG, AVIF, ICO, HEIC, HEIF · käsitellään laitteellasi

tai liitä leikepöydältä painamalla Ctrl+V

Selaa tiedostoja

Vinkki: voit myös liittää kuvan leikepöydältä (Ctrl+V).

Tiedostosi eivät koskaan poistu laitteeltasi. Kaikki käsittely tapahtuu paikallisesti selaimessasi.

Muunna kuva Base64-data URI:ksi, jonka voit liittää suoraan CSS:ään, HTML:ään tai Markdowniin — erillistä tiedostoa ei tarvita. Koodataan selaimessasi, ei koskaan lähetetä.

Yleiset käyttötavat

Upota Kuva CSS:ssäUpota pieni kuvake tai tausta data-URI:ksi tyylisivussasi.
Upota Kuva HTML:ssäUpota logo tai kuvake suoraan itsenäiseen HTML:ään.
Muunna SVG tai Kuvake Base64:ksiMuunna pieni kuvake data-URI:ksi upottamista varten.
Upota Kuva MarkdownissaUpota pieni kuva Markdown-tiedostoon data-URI:llä.
Hanki Kuvan Data URITuota raa'a data: URI:ta, jota voit käyttää missä tahansa.

Miten se toimii

Data URI upottaa kuvan suoraan koodiisi tekstinä, joten se latautuu ilman erillistä tiedostopyynnöstä — kätevä pienille ikonille ja itsenäiselle HTML:lle. Tämä koodaa sen selaimessasi.

1
Pudotat kuvan
Se luetaan paikallisesti FileReader API:lla — ei koskaan lähetetä.
2
Se on Base64-koodattu
Kuvan baitit muuttuvat data: URI:ksi (data:image/...;base64,…) suoraan selaimessasi.
3
Valitset pätkän
Kopioi raa'an data URI tai valmiit koodinäytteet CSS (background-image), HTML (<img>) tai Markdown.
4
Liitä se koodiisi
Kuva matkustaa nyt rivissä CSS/HTML:n kanssa — ei ylimääräistä tiedostoa isännöitäväksi.

Kuva koodataan kokonaan laitteellasi. Huomaa, että Base64 on ~33 % suurempi kuin alkuperäinen, joten data URI:t ovat parhaita pienille kuville.

Liittyvät työkalut

🖼️

Kuvastegonografia (piilota teksti kuvaan)

Piilota salainen tekstiviesti PNG-kuvaan vähiten merkitsevän bitin stegonografialla, valinnaisella AES-256-GCM-salasanasalauksella. Pura se myöhemmin samalla työkalulla. Kaikki toimii selaimessasi.

Kokeile sitäTiedostot pysyvät paikallisina

🔢

Base64-koodaaja ja -purkaja

Koodaa teksti tai tiedostot Base64-muotoon tai pura Base64-merkkijonot takaisin pelkäksi tekstiksi. Välitön, yksityinen ja ilmainen.

Kokeile sitä

🔗

URL-kooderi ja -dekooderi

Koodaa ja dekoodaa URL-osoitteita ja kyselymerkkijonoja. Tukee encodeURIComponent, decodeURIComponent ja kyselymerkkijonojen jäsennystä.