画像をBase64に変換

画像を Base64 データ URI に変換、テキストの Base64 エンコード / デコード、Base64 からファイルへの復元も

✓ ずっと無料 · ✓ 登録不要 · ✓ アップロード不要 · ✓ オフライン対応

🔒 データがデバイスの外に出ることはありません。 すべての処理はFileReader APIを使用してブラウザ内でローカルに行われます。アップロード、サーバー、追跡は一切ありません。

特長

データURI出力 — HTML、CSS、JavaScriptに直接貼り付けられる、完全なdata:image/... URI文字列を取得します。
ワンクリックコピー — 生のデータURI、<img>タグ、またはCSSのbackground-imageプロパティとしてコピーできます。
サイズ比較 — 元のファイルサイズとBase64文字列の長さを比較できます（Base64は約33%大きくなります）。
テキストとデコードにも対応 — 任意のテキストを UTF-8 で Base64 に（標準または URL セーフ）、Base64 をテキストに戻す、Base64 文字列をプレビュー・ダウンロードできるファイルに復元。

仕組み

画像をアップロード — 画像をドロップしてBase64に変換します。
コピー形式を選択 — データURI、<img>タグ、またはCSSのbackground-imageとしてコピーします。
コードに貼り付け — Base64文字列で画像をコードに直接埋め込めます — 別ファイルは不要です。

活用例

小さな画像をHTMLに直接埋め込みHTTPリクエストを削減
画像を内包した単体の HTML ファイル（レポート、オフラインページ）— なお Gmail と Outlook はメール内の data URI 画像をブロックします
スタイルシートに埋め込むCSSの背景画像
単一ファイル配布用にJavaScriptコードにアイコンをバンドル

よくある質問

Base64はいつ使うべきですか？

小さな画像（10KB以下）— アイコン、ロゴ、小さなUI要素に最適です。埋め込みにより追加のHTTPリクエストを回避できます。大きな画像は別ファイルとして提供する方が効率的です。

Base64文字列がファイルより大きいのはなぜですか？

Base64エンコーディングはバイナリデータをASCIIテキストに変換するため、サイズが約33%増加します。これは画像をコードに直接埋め込むための代償です。

画質は完全に保持されますか？

はい。Base64 は同じバイト列の別の表現にすぎず、画質の劣化はありません。例外は iPhone の HEIC 写真で、ブラウザが data URI の HEIC を表示できないため先に JPEG に変換します。その場合はページでお知らせします。

Base64 のデコードもできますか？

できます。「テキスト ⇄ Base64」で「デコード」を選び、Base64 または data: URI 全体を貼り付けてください。スペース・改行・URL セーフ形式も読めます。テキストならテキストを、ファイル（PNG、JPG、PDF、ZIP など）なら可能な限りプレビューとダウンロードを表示します。不正な文字はその文字と位置を示します。

URL セーフな Base64 とは？

+ と / の代わりに - と _ を使い、通常 = のパディングも付けない同じエンコードです。URL や JWT にエスケープなしで入れられます。エンコード時に「URL セーフ」をオンに。デコードはどちらも自動で読みます。