画像 → Base64変換
画像をBase64データURIにエンコードし、HTML/CSSにインラインで埋め込めるコードを生成します。小さなアイコン·ロゴ·メール署名添付に。
使い方
ドラッグ·クリック·Ctrl+Vで画像を取り込み。PNG·JPG·GIF·WebP·SVG·ICO·BMP対応。
data URI·HTML <img>タグ·CSS background-imageコードが自動生成。プレビューと原本/Base64サイズ比較も表示。
必要な形式(URI/HTML/CSS)横の「コピー」ボタンでワンクリックでクリップボードへ。
よくある質問
Base64エンコードとは?
バイナリデータ(画像·ファイル)をASCIIテキストで表現する方式。64文字(A-Z, a-z, 0-9, +, /, =)のみを使用するため、テキストベース環境(HTML·CSS·JSON·メール)に安全に埋め込めます。
なぜBase64でエンコード?
HTTPリクエスト削減(小さなアイコンが別ダウンロード不要)、オフライン動作(画像がコードに含まれる)、メールへのインライン添付などに利用。ただしファイルサイズが約33%増加するため、キャッシュが重要な大きい画像には不向き。
どこまで大きい画像が可能?
ブラウザのメモリ限界まで可能ですが、推奨は100KB以下の小さな画像です。1MB以上はBase64後に約1.33MBになり、ページ初期読み込みが大幅に遅くなる可能性があります。
CSSでの使い方は?
`background-image: url(data:image/png;base64,...)` 形式で使用します。「CSS」出力欄のコードをコピーしてそのまま使えます。SVGはより効率的な`data:image/svg+xml,...`エンコードも可能ですが、本ツールはすべてBase64に統一します。
サーバーに送信されますか?
いいえ。FileReader APIでブラウザ内のみエンコードされ、画像が外部に送信されることはありません。