画像 → Base64

このツールについて

画像をBase64文字列または完全なData URIにエンコードして、別ファイルなしにHTML、CSS、JSONへ直接埋め込めます。ドラッグ＆ドロップまたはクリックで画像を選択し、元のファイルサイズとエンコード後のサイズを表示します。

すべてのエンコードはブラウザのFileReader APIで行われ、画像はサーバーにアップロードされません。完全なData URI（data:image/…;base64, プレフィックス付き）と純粋なBase64のみ（プレフィックスなし）を切り替えられます。

使い方

1. アップロードエリアに画像をドラッグするか、クリックしてファイルを選択します。
2. ファイル読み込み後、エンコード結果が自動的に表示されます。
3. ボタンでData URIとBase64 Onlyを切り替えます。
4. コピーボタンをクリックして結果をクリップボードにコピーします。

活用事例

フロントエンド開発者は小さなアイコンをCSS/HTMLに直接埋め込んでHTTPリクエストを削減します。メールマーケターは外部画像のブロック問題を回避するためHTMLメールに画像をインライン化します。モバイルアプリ開発者はJSON APIペイロードに画像をエンコードし、Base64文字列をデータベースや設定ファイルに保存します。

よくある質問

• Base64エンコードでファイルサイズは増えますか？ — はい。Base64エンコードは元のバイナリより約33%ファイルサイズが増加します。
• どの画像形式に対応していますか？ — ブラウザが表示できる形式すべて：JPG、PNG、WebP、GIF、SVG、BMPなど。
• 大きな画像もBase64エンコードすべきですか？ — 約10 KB以上のファイルはファイルとしてホスティングするほうが良いです。大きなBase64文字列はHTML/CSSを肥大化させ、ページロード性能を低下させます。