💡 このツールの使いどころ
Base64はバイナリデータをテキストで表現する形式です。画像をBase64化することで、HTMLやCSSに画像を直接埋め込むことができます。
-
HTMLへの埋め込み：
<img src="data:image/png;base64,...">の形式でHTMLに直接記述できます。外部ファイルなしでアイコンや小さな画像を扱いたいときに。 -
CSSへの埋め込み：
background-image: url("data:image/...")としてCSSに埋め込めます。 - Base64→画像の確認： APIレスポンスやログに含まれるBase64文字列が実際にどんな画像か確認・保存したいときに。
🛠️ 使い方
画像 → Base64（エンコード）：
① 「📷 画像 → Base64」タブを選択します。
②
画像ファイルをドロップ（またはクリックして選択）します。
③ data URI形式のBase64文字列が生成されます。「📋
コピー」ボタンでクリップボードにコピーできます。
Base64 → 画像（デコード）：
① 「📄 Base64 → 画像」タブを選択します。
② テキストエリアにBase64文字列を貼り付けます。
③ 「📷
画像を生成してダウンロード」ボタンで画像ファイルをダウンロードできます。
⚠️ 注意点
- 大きい画像をBase64化すると非常に長い文字列になります。埋め込み用途では小さい画像（アイコン・ロゴ等）の使用を推奨します。
- デコード時、生のBase64文字列（data URI形式でない場合）は画像の種類を自動判定します。判定に失敗した場合はPNG形式として出力します。
- 一部の画像形式（HEIC等）はブラウザが対応していないため正しく変換できない場合があります。
- 変換はすべてブラウザ内で完結します。ファイルデータが外部サーバーへ送信されることは一切ありません。
❓ よくある質問（FAQ）
- 画像をBase64に変換できますか？
- はい、対応しています。「📷 画像 → Base64」タブに画像をドロップすると、data URI形式のBase64文字列が即座に生成されます。JPG・PNG・WebP・SVG・GIF・BMP・AVIFに対応しています。
- Base64文字列から画像に戻せますか？
-
はい。「📄 Base64 →
画像」タブにBase64文字列を貼り付け、「画像を生成してダウンロード」ボタンを押すと画像ファイルとして保存できます。data
URI形式（
data:image/...;base64,...）と生のBase64文字列のどちらにも対応しています。 - data URIとは何ですか？
-
data:image/png;base64,iVBORw0K...のような形式で、画像データをURL文字列として直接埋め込む方法です。HTMLの<img src="">やCSSのurl()に貼り付けて、外部ファイルなしで画像を表示できます。 - Base64化すると画像サイズは小さくなりますか？
- 小さくなりません。Base64は元データより約33%大きくなります。圧縮・最適化ではなく、テキスト形式への変換です。ファイルサイズを減らしたい場合はJPG圧縮ツールやWebP変換ツールをご利用ください。
- 大きい画像をBase64化してもよいですか？
- 技術的には可能ですが、HTMLやCSSに埋め込む場合は推奨しません。大きな画像をBase64化するとページのHTMLサイズが大幅に増加し、読み込み速度が低下します。アイコンや小さなロゴ（目安として10KB以下）の用途に向いています。
- 画像ファイルはサーバーに送信されますか？
- 送信されません。このツールはすべての処理をブラウザ内で完結しています。画像データが外部サーバーへ送信されることは一切ありません。
- SVGやWebPもBase64に変換できますか？
- はい、対応しています。JPG・PNG・WebP・SVG・GIF・BMP・AVIFをBase64化できます。ただしHEICなど、ブラウザが対応していない形式は変換できない場合があります。
- 文字列のBase64変換はできますか？
- このページは画像のBase64変換に特化しています。テキスト・日本語文字列のBase64変換には、Base64変換ツール（文字列）をご利用ください。URL-safe Base64やパディング調整にも対応しています。