Vaizdas į Base64 keitiklis

Konvertuok vaizdą į Base64 ar data URI su paruoštu įklijuoti CSS ir HTML kodu arba dekoduok Base64 atgal į vaizdą su peržiūra. Nemokamai, be įkėlimo.

Vaizdas → Base64

Nutempk vaizdą čia arba spustelėk ir pasirink Tavo failai lieka tavo įrenginyje: jie niekada neįkeliami.

Išvestis Rezultatas

Base64 → vaizdas

Base64 tekstas arba data URI

Kaip konvertuoti vaizdą į Base64

Skiltyje Vaizdas → Base64 nutempk vaizdą į sritį arba spustelėk ją ir pasirink failą (PNG, JPEG, GIF, WebP, SVG, ICO, BMP, AVIF…).
Pasirink Išvestis: Data URI (data:image/png;base64,…), Tik Base64, CSS background-image arba HTML žyma, kurioje taip pat nurodomas vaizdo plotis ir aukštis.
Spustelėk Kopijuoti arba Atsisiųsti kaip .txt ilgiems rezultatams.

Eilutė po sritimi parodo tikrąjį formatą (nuskaitytą iš failo baitų, o ne iš pavadinimo), matmenis, failo dydį ir data URI ilgį.

Kaip konvertuoti Base64 atgal į vaizdą

Skiltyje Base64 → vaizdas įklijuok tekstą į Base64 tekstas arba data URI. Gali įklijuoti gryną Base64 eilutę, pilną data URI arba net visą CSS taisyklę ar <img> žymę: data URI randamas jos viduje. Eilučių lūžiai ir tarpai ignoruojami, o URL saugus Base64 (su - ir _) taip pat veikia.
Spustelėk Dekoduoti vaizdą. Pasirodo peržiūra, tipas, matmenys ir dydis.
Spustelėk Atsisiųsti vaizdą, kad jį išsaugotum su tinkamu failo plėtiniu.

Tipas tikrinamas pagal failo „magiškuosius baitus“ – parašą, esantį kiekvieno vaizdo formato pradžioje (pavyzdžiui, 89 50 4E 47 PNG arba FF D8 FF JPEG). Jei data URI teigia esąs image/jpeg, bet viduje yra PNG, įrankis tau tai pasako ir naudoja tikrąjį tipą. Viskas, kas nėra atpažįstamas vaizdas, atmetama, o riba yra 20 MB vaizdo duomenų.

Kaip veikia Base64

Base64 kas 3 failo baitus paverčia 4 spausdinamais simboliais, paimtais iš A–Z, a–z, 0–9, + ir /, o pabaigoje pridedamas = kaip užpildas. Todėl užkoduotas tekstas yra maždaug 33 % didesnis už failą: 30 KB piktograma tampa maždaug 40 KB teksto. Data URI prideda trumpą antraštę data:<tipas>;base64,, kad naršyklė žinotų, kaip jį skaityti.

Kada vaizdus verta įterpti kaip data URI

Data URI patogūs:

mažoms piktogramoms, logotipams ir fonams CSS faile, kad sutaupytum vieną užklausą;
HTML el. laiškams ir vieno failo HTML dokumentams, kurie turi veikti be išorinių failų;
JSON API ir konfigūracijos failams, kurie gali perduoti tik tekstą.

Didelėms nuotraukoms jie netinka. Tekstas trečdaliu didesnis už failą, jo negalima talpinti podėlyje atskirai nuo puslapio ar stilių lapo, kuriame jis yra, ir jis lėtina atvaizdavimą. Virš maždaug 10–100 KB paprastai laimi įprastas vaizdo failas su gerai sureguliuotu podėliu, todėl įrankis rodo priminimą vaizdams, didesniems nei 100 KB.

Viskas veikia tavo naršyklėje: vaizdai ir įklijuotas tekstas niekada neįkeliami.

Dažnai užduodami klausimai

Ar Base64 yra būdas suspausti ar apsaugoti vaizdą?

Ne. Base64 padaro duomenis maždaug 33 % didesnius, ir bet kas gali juos dekoduoti. Jis tik paverčia dvejetainius duomenis tekstu, kuris gali keliauti ten, kur dvejetainiai duomenys negali.

Kodėl mano data URI nerodomas?

Dažniausios priežastys: trūkstamas ar neteisingas tipas antraštėje, į eilutės vidurį įklijuoti tarpai ar kabutės arba nukirstas tekstas. Įklijuok jį į Base64 → vaizdas: įrankis praneša apie netinkamus simbolius ir patikrina tikrąjį tipą.

Ar galiu naudoti SVG kaip data URI?

Taip. SVG galima užkoduoti Base64 kaip bet kurį vaizdą. SVG atveju URL užkoduotas data URI (data:image/svg+xml,%3Csvg…) dažnai trumpesnis; šis įrankis dekoduoja abi formas.

Ar tai veikia su HEIC ar AVIF vaizdais?

Kodavimas veikia su bet kuriuo vaizdo failu. Peržiūra pasirodo tik jei naršyklė gali parodyti formatą, bet Base64 tekstas ir atsisiuntimas visada teisingi.

Ar yra dydžio riba?

Taip, 20 MB vaizdo duomenų abiem kryptimis. Didesnės eilutės lėtina naršykles ir retai kada tinka tinklalapyje.