画像 Base64 変換
画像とBase64エンコードの相互変換、ドラッグアップロードとリアルタイムプレビュー対応
画像アップロード
画像をここにドラッグ、またはクリックしてファイルを選択
JPG、PNG、GIF、WebP、SVGなどのフォーマットに対応
Base64画像エンコードとは?
Base64は、64個の印刷可能文字を使用してバイナリデータを表すエンコード方式です。画像Base64エンコードは、画像のバイナリデータをASCII文字列に変換し、HTML、CSS、JSONなどのテキストフォーマットに直接埋め込めるようにします。
Data URLフォーマット:data:image/[フォーマット];base64,[エンコードデータ]
使用方法
画像 → Base64
- 画像をアップロードエリアにドラッグ、またはファイル選択ボタンをクリック
- 出力フォーマットを選択:Data URLプレフィックス付きまたは純粋なBase64
- 「Base64をコピー」ボタンで結果をコピー
- コピーした内容を必要な場所に貼り付け
Base64 → 画像
- Base64文字列を入力ボックスに貼り付け
- 「画像に変換」ボタンをクリック
- 変換結果をプレビュー、画像をダウンロード保存可能
使用例
HTMLでの使用
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUg..." alt="image description">
CSSでの使用
.background {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUg...');
}JSON APIでの送信
{
"image": "iVBORw0KGgoAAAANSUhEUgAAAAUA...",
"format": "png"
}よくある質問 (FAQ)
Q: 画像をBase64に変換する理由は?
A: Base64エンコードはHTTPリクエスト数を削減でき、小アイコン、背景画像などに適しています。画像をコードに直接埋め込めるため、追加のファイルリクエストが不要です。
Q: Base64エンコード後、画像は大きくなりますか?
A: はい、Base64エンコードはデータを約33%増加させます。小さな画像(通常10KB未満)のみBase64エンコードを使用することをお勧めします。
Q: 大きな画像にBase64は適していますか?
A: 非推奨です。大きな画像をエンコードすると文字列が非常に長くなり、HTML/CSSファイルサイズが増加し、読み込みパフォーマンスに影響します。画像CDNやレイジーロード技術の使用をお勧めします。
Q: 画像はサーバーにアップロードされますか?
A: いいえ。すべての変換はブラウザでローカル完了し、画像データはサーバーにアップロードされず、プライバシーを保護します。