🖼️ 画像 ⇄ Base64 変換
📁
ドラッグ&ドロップ、またはクリックして画像を選択
PNG / JPEG / GIF / WebP / SVG / BMP(最大 10 MB)
ファイル情報
デコード結果
【概要】
画像 ⇄ Base64 変換ツールは、PNG・JPEG・GIF・WebP などの画像をBase64形式のDataURI文字列に変換し、HTML/CSS に直接埋め込める形式で出力するツールです。逆変換(Base64から画像への復元)も可能。小サイズの画像・アイコン をサーバー依存なしで配信する際に活躍します。
【仕組み・計算式】
Base64エンコード:バイナリ画像データを6ビット単位で分割。64種類の英数・記号「A-Z/a-z/0-9/+/=」で表現。3バイト→4文字に拡張。
DataURI形式:「data:image/png;base64,iVBORw0K...」のように MIME タイプ + Base64データを結合。HTML img タグの src に直接記述可能。
ファイル情報:元のファイルサイズ、MIME タイプ、Base64変換後の文字数を計測。大きさの変化を可視化。
デコード処理:Base64 文字列を逆変換してバイナリデータに復元。元の画像フォーマットを自動判定して表示・ダウンロード可能。
【使い方】
- 「画像 → Base64」タブで、ドラッグ&ドロップまたはクリックで画像を選択
- プレビュー表示とファイル情報が更新
- HTML/CSS コード欄に DataURI 形式の文字列が生成。「コピー」で取得
- 「Base64 → 画像」タブで、Base64 テキストを貼り付けてデコード・プレビュー
【よくある質問(FAQ)】
Q1. Base64 に変換するとファイルサイズが大きくなります。
A. Base64 は約 33% のオーバーヘッドがあります。ただし、HTTP リクエスト削減による高速化メリットがある場合は、小サイズ画像の埋め込みが有効です。
Q2. DataURI で画像が表示されません。
A. HTML内のコードをコピーした際、前後の引用符が正しいか、MIME タイプが正確か確認してください。ブラウザの開発者ツールでエラーを確認。
Q3. 対応していない画像形式はありますか?
A. PNG / JPEG / GIF / WebP / SVG / BMP に対応。最大 10 MB まで処理可能。より大きい画像はファイルサーバーでの配信をお勧めします。