Суретті CSS үшін Base64 data URI пішіміне қалай түрлендіруге болады?

Суретті сүйреп әкеліңіз немесе қойыңыз (Ctrl+V), содан кейін CSS қойындысын ашып, Көшіру түймесін басыңыз. Data URI енгізілген background-image: url(...) ережесін аласыз. HTML, Markdown, Raw Base64 және JSON қойындылары да дәл солай жұмыс істейді.

Base64 нәтижесі неге суретімнен шамамен үштен біріне үлкен?

Base64 әрбір 3 байтты 4 мәтіндік таңбаға айналдырады, сондықтан мәтін файлдан шамамен 33% үлкен болады. Сондықтан data URI үлкен фотосуреттерге емес, шағын белгішелер мен логотиптерге жарайды.

Base64 жолын қалай қысқартуға болады?

Алдымен Кішірейту бөлімін ашып, Макс. ені немесе Пішім (WebP, JPEG не PNG) орнатыңыз, WebP немесе JPEG үшін Сапаны төмендетіңіз. SVG және GIF файлдарын бұлай кішірейту мүмкін емес; SVG үшін оның орнына SVG (URL-кодталған) қойындысы бар.

Base64 жолын қайтадан суретке айналдыруға бола ма?

Иә. Бағытты Base64-тен суретке деп ауыстырып, data URI немесе жай Base64 қойыңыз. Ол PNG, JPEG, GIF, WebP, SVG, BMP, ICO және AVIF пішімдерін таниды, содан кейін жүктеп алуды ұсынады. Жарамсыз енгізу қате көрсетеді.

Үлкен суретте Көшіру неге орындалмайды немесе алдын ала қарау неге кесілген болып көрінеді?

Алдын ала қарау тек алғашқы 2000 таңбаны көрсетеді, ал Көшіру мен Жүктеп алу толық мәнді береді. Өте ұзын жолдар браузердің алмасу буфері шегінен асуы мүмкін, сондықтан Жүктеп алуды қолданыңыз немесе алдымен суретті кішірейтіңіз.

Шынымен тегін бе?

Иә. Әрбір құрал тегін, аккаунтсыз және несие картасынсыз қолданылады. Жұмыс серверлерімізде емес, құрылғыңызда орындалады, бұл оның тегін жұмыс істеуін қамтамасыз етеді.

Файлдарым жүктеле ме?

Жоқ. Файлдарыңыз браузер ішінде ашылып, өңделеді және LibraTool-ға жіберілмейді. Кейбір құралдар алдымен браузеріңізге өңдеу қозғалтқышын немесе AI үлгісін жүктейді; бұл жүктеуде сіздің деректеріңіз болмайды.

Мобильді құрылғыларда жұмыс істей ме?

Иә. iOS және Android жүйелеріндегі заманауи мобильді браузерлерде ештеңе орнатпай жұмыс істейді. Өте үлкен файлдар телефонда баяу жұмыс істеуі немесе жады жетпей қалуы мүмкін, сондықтан оларға компьютерді пайдаланыңыз.

🖼️

Кескінді Base64-ке — тегін

Кескінді CSS, HTML немесе Markdown-да кірістіре пайдалану үшін Base64 деректер URI-ге айналдырыңыз. Дайын үзінділерді көшіріңіз. Браузерде кодталады; ешқашан жүктелмейді.

Файл өлшемі құрылғыңызға байланыстыФайлдар жеке қаладыКіруді қажет етпейдіМәңгілік тегін

Жүктелгеннен кейін офлайн жұмыс істейді

Файлды осы жерге тастаңыз немесе таңдау үшін басыңыз

PNG, JPG, WebP, GIF, SVG, AVIF, ICO, HEIC, HEIF · құрылғыңызда өңделеді

немесе алмасу буферінен қою үшін Ctrl+V басыңыз

Файлдарды шолу

Кеңес: Сіз сондай-ақ қопламадан суретті құйса аласыз (Ctrl+V).

Файлдарыңыз ешқашан құрылғыңызды тастамайды. Барлық өңдеу шолғышыңызда жергілікті түрде жүзеге асырылады.

Суретті CSS, HTML немесе Markdown-ға тікелей қоюға болатын Base64 data URI-ге түрлендіреді — бөлек файл қажет емес. Браузерде кодталады; ешқайда жүктелмейді.

Жиі қолданылуы

CSS-де Суреттерді Ішінде АйналдырыңызШағын тәмгесін немесе фонды өзінің стиль сызығында мәліметтер URI ретінде орналастырыңыз.
HTML-де Суреттерді ОрналастырыңызЛоготипті немесе тәмгені өзінің HTML-де ішінде ағарытыңыз.
SVG немесе Тәмгелерді Base64-ге АйналдырыңызШағын тәмгелерді мәліметтер URI-на айналдырыңыз ішінде істі.
Markdown-да Суреттерді ОрналастырыңызMarkdown файлындағы шағын суреттерді мәліметтер URI-мен ішінде айналдырыңыз.
Сурет Мәліметтері URI АлыңызКез келген жерде пайдалана аласыз шикі мәліметтер құрап аласыз: URI.

Қалай жұмыс істейді

Мәлімет URI суретті кодтарының ішіне тікелей ендіреді мәтін сияқты, сондықтан оны бөлек файл сұрау қажет емес — кішігі пиксельдер және өз-өзінен тұрмалы HTML үшін қол жетімді. Бұл браузерде кодталады.

1
Сіз суретті төмен түсіресіз
Оны FileReader API пайдаланып жергілік түрде оқырады — ешқашан жүктелмейді.
2
Base64-та кодталады
Сурет байттары браузеріңізде мәлімет: URI (data:image/...;base64,…) болады.
3
Сіз фрагментті таңдайсыз
Өңі мәлімет URI, немесе дайын CSS (background-image), HTML (<img>) немесе Markdown көшіріңіз.
4
Кодыңызға жапсаңыз
Сурет қазір CSS/HTML-мен сағала ағысатын құрамса - ешқандай файлдарды ұстатуға болмайды.

Сурет толық түрде сіздің құрылғысында кодталады. Base64 түпнұсқаның ~33% үлкен, сондықтан мәлімет URI-лер ең кішігі сурет үшін жақсы.

Байланысты құралдар

🖼️

Кескін стеганографиясы (кескінде мәтін жасыру)

Ең маңызды емес бит стеганографиясын, міндетті емес AES-256-GCM парольмен шифрлаумен пайдаланып PNG-ге құпия мәтін хабарын жасырыңыз. Кейінірек бірдей құрал арқылы шығарып алыңыз. Бәрі браузерде жұмыс істейді.

Байқап көріңізФайлдар жергілікті қалады

🔢

Base64 кодтаушы және декодтаушы

Мәтін немесе файлдарды Base64-ке кодтаңыз немесе Base64 жолдарын қарапайым мәтінге декодтаңыз. Лезде, жеке және тегін.

Байқап көріңіз

🔗

URL кодтаушысы және декодер

URL мекенжайларын және сұрау жолдарын кодтау және декодтау. encodeURIComponent, decodeURIComponent және сұрау жолын талдауды қолдайды.