Hogyan alakíthatok át egy képet Base64 data URI-vá CSS-hez?

Húzzon be vagy illesszen be egy képet (Ctrl+V), majd nyissa meg a CSS fület, és kattintson a Másolás gombra. Kap egy background-image: url(...) szabályt a beágyazott data URI-val. A HTML, Markdown, Nyers Base64 és JSON fülek ugyanígy működnek.

Miért körülbelül egyharmaddal nagyobb a Base64 kimenet, mint a képem?

A Base64 minden 3 bájtból 4 szövegkarakter készít, így a szöveg körülbelül 33%-kal nagyobb a fájlnál. Ezért a data URI-k kis ikonokhoz és logókhoz jók, nem nagy fotókhoz.

Hogyan rövidíthetem le a Base64 karakterláncot?

Először nyissa meg a Kicsinyítés részt, és adjon meg Maximális szélességet vagy Formátumot (WebP, JPEG vagy PNG), WebP-nél és JPEG-nél pedig csökkentse a Minőséget. Az SVG- és GIF-fájlok így nem kicsinyíthetők; az SVG helyette egy SVG (URL-kódolt) fület kap.

Visszaalakíthatok egy Base64 karakterláncot képpé?

Igen. Állítsa az Irányt Base64-ből képpé értékre, és illesszen be data URI-t vagy nyers Base64-et. Felismeri a PNG, JPEG, GIF, WebP, SVG, BMP, ICO és AVIF formátumot, majd letöltést kínál. Érvénytelen bemenetnél hibát jelez.

Miért nem működik a Másolás, vagy miért tűnik levágottnak az előnézet nagy képnél?

Az előnézet csak az első 2000 karaktert mutatja, de a Másolás és a Letöltés a teljes értéket adja. A nagyon nagy karakterláncok meghaladhatják a böngésző vágólapjának korlátját, ezért használja a Letöltést, vagy előbb kicsinyítse a képet.

Igen. Minden eszköz ingyenesen használható, fiók és bankkártya nélkül. A munka a szervereink helyett a te eszközödön fut, ezért maradhat ingyenes a használata.

Feltöltődnek a fájljaim?

Nem. A fájlokat a böngészője nyitja meg és dolgozza fel, és nem kerülnek el a LibraToolhoz. Néhány eszköz előbb letölt a böngészőbe egy feldolgozómotort vagy MI-modellt; ez a letöltés semmilyen adatát nem tartalmazza.

Igen. Az iOS és Android jelenlegi mobilböngészőiben fut, telepítés nélkül. A nagyon nagy fájlok lassúak lehetnek, vagy elfogyhat a memória a telefonon, ezekhez használjon számítógépet.

🖼️

Ingyenes Kép Base64-fé alakítása

Alakíts képet Base64 adatURI-vá CSS-ben, HTML-ben vagy Markdownban való közvetlen felhasználáshoz. Másolj kész kódrészleteket. A böngésződben kódolt; sosem töltődik fel.

A fájlméret az eszközödtől függA fájlok privátok maradnakNem szükséges bejelentkezésÖrökre ingyenes

Betöltés után offline is működik

Húzza ide a fájlt, vagy kattintson a tallózáshoz

PNG, JPG, WebP, GIF, SVG, AVIF, ICO, HEIC, HEIF · az eszközödön dolgozza fel

vagy nyomjon Ctrl+V-t a vágólapról való beillesztéshez

Fájlok tallózása

Tipp: a képet beillesztheti a vágólapból is (Ctrl+V).

Az Ön fájljai soha nem hagyják el az eszközét. Minden feldolgozás helyileg történik a böngészőjében.

Képet konvertál Base64 Data URI-vá, amelyet közvetlenül beilleszthetsz CSS-be, HTML-be vagy Markdown-ba — külön fájl nélkül. A böngésződben kódolva; soha nem töltődik fel.

Gyakori felhasználások

Kép beágyazása CSS-beÁgyazzon be egy kis ikont vagy hátteret data-URI-ként az Ön stíluslapjába.
Kép beágyazása HTML-beÁgyazzon be egy logót vagy ikont közvetlenül az önálló HTML-be.
SVG vagy ikon konvertálása Base64-reAlakítson át egy kis ikont data-URI-vá a beágyazáshoz.
Kép beágyazása Markdown-baÁgyazzon be egy kis képet egy Markdown-fájlba data-URI-ként.
Kép data-URI szerzéseÁllítson elő egy nyers adatot: URI-t, amelyet bárhol használhat.

Hogyan működik

Egy adat URI közvetlenül a kódba ágyazza be a képet szövegként, így külön fájlkérés nélkül töltődik be — hasznos kis ikonokhoz és önálló HTML-hez. Ez a böngészőben kódol.

1
Egy képet dobsz bele
A FileReader API-val helyileg beolvasódik — soha nem kerül feltöltésre.
2
Base64-ként van kódolva
A képbájtok adat: URI-vá (data:image/...;base64,…) válnak közvetlenül a böngészőben.
3
Egy részletet választ ki
Másolja a nyers adat URI-t, vagy kész CSS (background-image), HTML (<img>) vagy Markdown.
4
Illeszd be a kódba
A kép most az CSS/HTML-lal utazik közvetlenül — nincs szükség extra fájlra a hosztoláshoz.

A kép teljes egészében az eszközödön van kódolva. Vedd figyelembe, hogy a Base64 körülbelül 33% nagyobb, mint az eredeti, ezért az adat URI-k legjobb kis képekhez.

Kapcsolódó eszközök

🖼️

Kép szteganográfia (szöveg elrejtése képben)

Rejts el titkos szöveges üzenetet egy PNG-ben legkisebb-bitű szteganográfia segítségével, opcionális AES-256-GCM jelszavas titkosítással. Nyerd ki később ugyanezzel az eszközzel. Minden a böngésződben fut.

Próbálja kiA fájlok helyi maradnak

🔢

Base64 kódoló és dekódoló

Kódolj szöveget vagy fájlokat Base64 formátumba, vagy dekódolj Base64 karakterláncokat vissza egyszerű szöveggé. Azonnali, privát és ingyenes.

Próbálja ki

🔗

URL kódoló és dekódoló

URL-ek és lekérdezési karakterláncok kódolása és dekódolása. Támogatja az encodeURIComponent, decodeURIComponent és lekérdezési karakterlánc elemzést.