Data URIジェネレーター＆パーサー

テキストやファイルからData URIを生成し、既存のData URIを解析してコンテンツとメタデータを抽出します。

100%クライアントサイド — データがデバイスから離れることはありません

Input Text or Data

生成オプション

MIMEタイプ（任意）

出力をBase64でエンコード

生成されたData URI

Data URIs in Code

How to programmatically generate and parse Data URIs.

JavaScript

// Generate a Data URI from text
const text = "Hello World";
const base64 = btoa(text);
const dataUri = `data:text/plain;base64,${base64}`;
console.log(dataUri); // data:text/plain;base64,SGVsbG8gV29ybGQ=

// Parse a Data URI
const uri = "data:text/plain;base64,SGVsbG8gV29ybGQ=";
const match = uri.match(/^data:([^;,]*)(;base64)?,(.*)$/);
if (match) {
  const mime = match[1];
  const isBase64 = !!match[2];
  const data = match[3];
  
  const decoded = isBase64 ? atob(data) : decodeURIComponent(data);
  console.log({ mime, decoded }); // { mime: "text/plain", decoded: "Hello World" }
}

よくある質問

以下を検索するか、よくある質問をご覧ください。

Data URIは、外部リソースであるかのようにWebページ内にデータをインラインで埋め込むことができるスキームです。HTMLやCSSに画像を埋め込むためによく使用されます。

いいえ、Data URIにはプレーンテキストやURLエンコードされたデータも含めることができます。ただし、画像などのバイナリファイルを埋め込む場合はBase64が標準です。

Related Tools

Base64 Converter

Encode text to Base64 or decode Base64 to text — all in one tool

Image to Base64

Convert PNG, JPG, GIF, SVG, and WebP images to Base64 data URIs

CSS Data URI Converter

Convert images to Base64 data URIs for CSS background-image properties

MIME Type Inspector

Analyze Base64 strings to instantly detect their underlying MIME type using magic numbers