Inline an Image in CSS

Embed a small icon or background as a data URI in your stylesheet.

Tidak perlu loginFile tetap privat

Seret file ke sini atau klik untuk menjelajah

PNG, JPG, WebP, GIF, SVG, AVIF, X, Image tidak ada batasan ukuran file

Jelajahi file

File Anda tidak pernah meninggalkan perangkat. Semua pemrosesan terjadi secara lokal di browser Anda.

Convert an image to a Base64 data URI you can paste directly into CSS, HTML, or Markdown — no separate file needed. Encoded in your browser; never uploaded.

CSS tips

🎨

The CSS snippet gives you a ready background-image: url(...) with the data URI inlined.

⚡

Inlining a small icon removes an HTTP request, which can speed up first paint.

📏

Keep it to small images — Base64 is ~33% larger, so big images bloat your CSS.

🔒

Encoded in your browser — never uploaded.

Cara kerja

Pilih file

Drop your file into the tool above. It stays entirely on your device — nothing is sent to any server.

Proses

The tool processes your data instantly in your browser using JavaScript. No server, no waiting.

Unduh

Get your result instantly. Nothing is stored after you leave the page — complete privacy.

Mengapa milik kami?

✓Sepenuhnya gratis — tidak ada biaya tersembunyi, selamanya

✓Tidak perlu akun, email, atau login

✓File tidak pernah meninggalkan perangkat Anda

✓Tidak ada batasan ukuran file sama sekali

✓Tidak ada tanda air pada output apa pun

Also check out…

📧

Embed an Image in HTML

Inline a logo or icon directly in self-contained H

🔣

Convert an SVG or Icon to Base64

Turn a small icon into a data URI for inlining.

📝

Embed an Image in Markdown

Inline a small image in a Markdown file with a dat

🔗

Get an Image Data URI

Produce a raw data: URI you can use anywhere.

Pertanyaan yang sering diajukan

Back to Image to Base64