画像⇄Base64変換ツール
画像をBase64(data URI)文字列に変換し、<img>タグやCSS background用のスニペットをワンクリックでコピー。逆にBase64を貼り付けて画像に復元・ダウンロードもできます。すべての処理はブラウザ内で完結し、画像がサーバーに送信されることはありません。
ドラッグ&ドロップ
または
Ctrl+V でスクリーンショットを直接貼り付け
JPEG, PNG, GIF, WebP, SVG, ICO(最大10MB)/iPhoneの写真(HEIC)はJPGにしてから変換します
Data URI(data:...;base64,...)
Base64文字列のみ(プレフィックスなし)
HTML <img> タグ
CSS background-image
使い方
1
変換方向を選ぶ
「画像 → Base64」で画像をdata URIに変換、「Base64 → 画像」でdata URIを画像に復元します。
2
画像またはBase64を入力
画像はドラッグ&ドロップ・ファイル選択・Ctrl+V貼り付けに対応。逆変換はBase64文字列をテキスト欄に貼り付けます。
3
結果をコピー/保存
data URI・<img>タグ・CSSスニペットをワンクリックでコピー。復元した画像はそのままダウンロードできます。
画像⇄Base64変換ツールとは
画像ファイルをBase64エンコードした「data URI」文字列に変換するオンラインツールです。data URIはHTMLやCSSに画像を直接埋め込めるため、HTTPリクエストを減らしてアイコンや小さな画像の読み込みを高速化できます。逆に、Base64文字列やdata URIを貼り付けて元の画像に復元・ダウンロードすることも可能です。すべての処理はブラウザ内(JavaScript)で完結するため、画像がサーバーに送信されることは一切ありません。
機能・特徴
- 双方向の変換画像→Base64、Base64→画像のどちらにも対応。一つのツールで往復できます。
- コピペで即利用data URI・<img>タグ・CSS background用スニペットをワンクリックでコピー可能。
- Ctrl+V貼り付け対応スクリーンショットやコピーした画像をCtrl+V(Cmd+V)でそのまま変換できます。
- 完全ブラウザ処理すべての処理はブラウザ内で完結。画像がサーバーに送信されることはありません。
活用シーン
- CSS/HTMLに小さなアイコンやロゴを直接埋め込む
- メールHTMLやWebフォントで画像をインライン化
- APIのJSONレスポンスに含まれるBase64画像を確認
- data URIで受け取った画像をファイルとして保存
- HTTPリクエスト削減によるページ表示の高速化
よくある質問
画像はサーバーに送信されますか?
いいえ。すべての変換処理はお使いのブラウザ内(JavaScript)で完結します。画像データがサーバーに送信・保存されることは一切ありません。
Data URI(data URL)とは何ですか?
「data:image/png;base64,...」のように、画像データを文字列として表現する形式です。HTMLやCSSに直接埋め込めるため、外部ファイルを読み込まずに画像を表示できます。
Base64にすると容量はどうなりますか?
Base64エンコードでは元のデータより約33%サイズが増えます。そのため大きな画像よりも、アイコンなど小さな画像の埋め込みに向いています。
どの画像形式に対応していますか?
JPEG・PNG・GIF・WebP・SVG・ICOなど、ブラウザが扱える画像形式に対応しています。iPhoneの写真(HEIC)はそのままではWebページに表示できないため、JPGにしてから変換します。最大10MBまで変換できます。
Base64から画像に戻すときMIMEタイプは必要ですか?
「data:image/...;base64,」付きの文字列ならそのまま変換できます。プレフィックスなしのBase64でも、データの先頭から形式を自動判別して復元を試みます。
スマートフォンでも使えますか?
はい。スマートフォン・タブレット・PCのいずれのブラウザでもご利用いただけます。