Pembuat Data URI

Konversi teks dan berkas ke data URI secara instan dengan pembuat Data URI gratis kami. Ketik atau tempel teks, unggah berkas, atau seret dan lepas - alat ini otomatis mendeteksi tipe MIME dari lebih dari 60 ekstensi berkas dan pola konten. Hasilkan data URI untuk menyematkan gambar di HTML dan CSS, menyisipkan font, membuat email HTML mandiri, membangun prototipe satu berkas, dan lainnya. Salin data URI yang dihasilkan dengan satu klik. Tanpa pendaftaran.

Data URI Generator

Convert text or files to data URIs (data:[MIME-type];base64,...) for embedding in HTML, CSS, and JavaScript. Automatically detects MIME types from content and file extensions. Supports images, fonts, HTML, JSON, SVG, CSS, JavaScript, and more.

Text Content

Presets:

MIME Type (optional)

What is a Data URI?

A data URI is a URL scheme that allows you to embed data directly in HTML, CSS, and JavaScript using the format data:[MIME-type];base64,.... Data URIs eliminate extra HTTP requests by inlining small files. Common uses include embedding small images in CSS backgrounds, fonts in @font-face declarations, and HTML snippets in iframe srcdoc attributes. Data URIs are best for files under 10 KB - larger files should use traditional URLs to avoid bloating your HTML documents.

Mengapa Menggunakan Pembuat Data URI Kami?

Konversi Teks & Berkas ke Data URI: konversi konten teks atau berkas apa pun menjadi data URI secara instan. Ketik atau tempel teks langsung, atau unggah gambar, dokumen, font, dan lainnya. Alat ini otomatis mendeteksi tipe MIME dari ekstensi berkas dan pola konten, lalu menghasilkan data URI yang terformat benar dan siap disematkan.
Deteksi Tipe MIME Cerdas: otomatis mendeteksi tipe MIME dari lebih dari 60 ekstensi berkas dan 10+ pola konten. Mendeteksi HTML, JSON, SVG, CSS, JavaScript, Markdown, CSV, dan lainnya dari konten teks. Untuk berkas, alat membaca tipe konten dan memetakan ekstensi ke tipe MIME yang benar untuk hasil data URI yang akurat.
Analisis Ukuran & Rekomendasi: lihat ukuran asli, ukuran data URI, dan persentase overhead untuk setiap konversi. Dapatkan rekomendasi apakah data URI cocok untuk kebutuhan Anda - data URI di bawah 10 KB ideal, sedangkan berkas lebih besar sebaiknya memakai URL tradisional demi performa lebih baik.
Pemrosesan 100 % di Sisi Klien: semua konversi terjadi sepenuhnya di browser Anda. Berkas dibaca secara lokal menggunakan API FileReader, teks dikodekan di memori, dan tidak ada data yang pernah diunggah ke server mana pun. Konten teks dan berkas Anda tetap sepenuhnya privat di perangkat Anda.

Kasus Penggunaan Umum Pembuat Data URI

Gambar Inline di HTML & CSS: sematkan ikon, logo, dan grafik kecil langsung di HTML menggunakan data URI alih-alih berkas gambar terpisah. Gunakan pembuat Data URI kami untuk mengonversi gambar PNG, SVG, dan WebP menjadi data URI untuk latar belakang inline, tag, dan pseudo-element CSS. Menghilangkan permintaan HTTP tambahan dan mempercepat pemuatan untuk aset kecil.
Tanda Tangan Email Mandiri: buat tanda tangan email yang tampil benar tanpa hosting gambar eksternal dengan menyematkan gambar sebagai data URI. Konversi logo dan ikon media sosial Anda ke data URI dan sertakan langsung di tanda tangan HTML. Gambar tampil benar di sebagian besar klien email tanpa bergantung pada server eksternal.
Prototipe HTML Satu Berkas: bangun prototipe HTML mandiri yang berfungsi offline dengan semua aset disematkan sebagai data URI. Konversi CSS, JavaScript, gambar, dan font ke data URI dan sertakan langsung dalam satu berkas HTML. Sempurna untuk berbagi prototipe, demo, dan proof-of-concept yang harus berfungsi tanpa dependensi eksternal.
Aset Kampanye Email: sematkan gambar dan gaya langsung dalam kampanye email HTML untuk memastikan perenderan konsisten di berbagai klien email. Banyak klien email memblokir gambar eksternal secara default, tetapi data URI langsung tampil karena merupakan bagian dari isi email. Konversi gambar hero kecil, logo, dan ikon untuk pengiriman email yang andal.
Konten WebView Aplikasi Seluler: muat konten di WebView aplikasi seluler tanpa permintaan jaringan dengan menyematkan aset sebagai data URI. Konversi HTML, CSS, gambar, dan font ke data URI untuk konten WebView yang dapat bekerja offline. Menjamin konten dalam aplikasi Anda dimuat seketika, apa pun kondisi jaringannya.
Perkakas & Otomatisasi Pengembangan Web: gunakan pembuat Data URI kami dalam alur kerja pengembangan web - konversi SVG ke data URI untuk sprite sheet JavaScript, kodekan font untuk deklarasi CSS @font-face, atau sisipkan data konfigurasi JSON. Alat ini menyediakan deteksi tipe MIME yang akurat untuk alur kerja otomatis maupun manual.

Apa Itu Data URI?

Data URI (Uniform Resource Identifier) adalah skema URL yang memungkinkan Anda menyematkan data langsung ke dokumen HTML, CSS, dan JavaScript dengan format data:[tipe-MIME];base64,... Berbeda dari URL biasa yang menunjuk ke berkas eksternal, data URI memuat data sebenarnya secara inline - browser mendekode konten ber-Base64 dan merendernya langsung tanpa membuat permintaan HTTP. Data URI didefinisikan dalam RFC 2397 dan didukung semua browser modern. Tipe MIME umum meliputi image/png, image/svg+xml, text/html, application/json, dan font/woff2.

Cara Kerja Pembuat Data URI Kami

Masukkan Konten: pilih antara masukan teks (ketik atau tempel konten) atau unggah berkas (seret dan lepas atau telusuri). Untuk masukan teks, Anda dapat menimpa tipe MIME yang dideteksi otomatis menggunakan pemilih dropdown.
Deteksi Tipe MIME: untuk berkas, tipe MIME dideteksi dari ekstensi berkas (60+ ekstensi didukung). Untuk teks, konten dianalisis terhadap pola umum - tag HTML, objek JSON, aturan CSS, elemen SVG, header Markdown, dan lainnya. Anda dapat menimpa tipe MIME yang terdeteksi secara manual.
Pengodean & Pembuatan: konten teks dikodekan ke byte dengan UTF-8, lalu ke Base64. Berkas dibaca menggunakan API FileReader melalui readAsDataURL, yang langsung menghasilkan data URI terformat benar. Alat ini menghitung statistik ukuran dan memberi rekomendasi.

Kapan Memakai Data URI vs URL Biasa

Gunakan Data URI untuk: gambar kecil di bawah 10 KB (ikon, logo, elemen dekoratif), font untuk @font-face dengan kumpulan karakter kecil, SVG inline, email HTML mandiri, prototipe satu berkas, favicon, dan data konfigurasi JSON kecil yang disematkan dalam skrip.
Gunakan URL Biasa untuk: gambar besar, berkas audio dan video, dokumen yang dapat diunduh (PDF, DOCX), aset yang sering berubah (caching lebih efisien dengan URL), dan sumber daya apa pun di atas 100 KB yang overhead Base64-nya (sekitar 33 %) akan membengkakkan HTML atau CSS Anda.
Pertimbangan Performa: data URI tidak pernah di-cache terpisah dari dokumen induknya - jika Anda memakai data URI yang sama di beberapa halaman, ia akan diunduh di setiap halaman. Data URI juga memblokir perenderan pada CSS background-images hingga sumber daya induk selesai dimuat dan diurai.

Privasi, Keamanan & Keterbatasan

Pembuat Data URI kami memproses semuanya secara lokal di browser Anda. Teks dikodekan di memori menggunakan API TextEncoder, berkas dibaca menggunakan API FileReader, dan tidak ada data yang pernah dikirim ke server mana pun. Alat ini 100 % gratis tanpa pendaftaran, tanpa akun, dan tanpa batas penggunaan.

Keterbatasan penting: data URI memiliki batas panjang di sebagian besar browser (biasanya sekitar 2-4 MB untuk gambar dalam tag <img>). Berkas yang sangat besar dapat menyebabkan masalah memori browser saat dikodekan. Overhead pengodean Base64 sekitar 33 % - berkas 10 KB menjadi sekitar 13,3 KB sebagai data URI. Untuk berkas di atas 100 KB, sangat disarankan memakai URL berkas tradisional demi performa dan caching yang lebih baik.

Pertanyaan yang Sering Diajukan

Data URI adalah skema URL yang menyematkan data langsung ke dokumen web dengan format data:[tipe-MIME];base64,... Alih-alih membuat permintaan HTTP, browser mendekode konten Base64 secara inline. Data URI menghilangkan permintaan HTTP tambahan tetapi menambah ukuran dokumen sekitar 33 % karena pengodean Base64.

Semua format berkas didukung. Alat ini mendeteksi tipe MIME dari lebih dari 60 ekstensi, termasuk gambar (PNG, JPEG, GIF, WebP, SVG), dokumen (PDF, DOCX), kode (HTML, CSS, JS, JSON), font (WOFF2, TTF), audio (MP3, WAV), video (MP4, WebM), dan arsip (ZIP, RAR, 7z).

Gunakan data URI untuk berkas kecil di bawah 10 KB seperti ikon, SVG kecil, font inline, dan prototipe satu berkas. Gunakan URL biasa untuk berkas di atas 100 KB, aset yang dapat diunduh, dan konten yang sering berubah. Data URI tidak pernah di-cache secara terpisah.

Pengodean Base64 menambah ukuran sekitar 33 %. Berkas 10 KB menjadi sekitar 13,3 KB sebagai data URI. Alat kami menampilkan perbandingan ukuran persis dan persentase overhead untuk setiap konversi.

Bisa, tetapi kami menyarankan data URI hanya untuk berkas di bawah 100 KB. Sebagian besar browser membatasi data URI pada 2-4 MB. Data URI yang sangat besar dapat menyebabkan masalah memori dan memperlambat perenderan halaman.

Alat kami otomatis mendeteksi tipe MIME yang benar dari ekstensi berkas (60+ didukung) dan pola konten teks. Anda dapat menimpa tipe MIME secara manual menggunakan pemilih dropdown untuk masukan teks.

Tentu saja. Semua pemrosesan terjadi secara lokal di browser Anda. Teks dikodekan di memori dan berkas dibaca menggunakan API FileReader - tidak ada data yang pernah dikirim ke server mana pun.

Ya! 100 % gratis tanpa pendaftaran, tanpa akun, tanpa kunci API, dan tanpa batas penggunaan. Konversi berkas dan potongan teks sebanyak yang Anda butuhkan - sepenuhnya gratis, selamanya.