画像をBase64に変換

画像をBase64文字列に変換します。

画像をドラッグ&ドロップ、またはクリックして選択してください

ファイルを1つ選択してください

使用例

小さなアイコンをCSSに直接埋め込む

別の画像リクエストを発生させずに、CSSのbackground-image: url(data:image/png;base64,...)にそのまま入れる場合に使います。

画像をJSONや設定ファイルに含める

サーバーリクエストなしで、サンプル画像データをコードや設定ファイルの中にテキストとして含めたい場合に便利です。

メールのHTMLに画像をインラインで入れる

外部画像リンクがブロックされるメールクライアント向けに、画像をデータURIに変換してHTMLに直接埋め込めます。

よくある質問

アップロードした画像はサーバーに送信されますか?

いいえ。変換はブラウザ内でのみ行われ、画像がサーバーに送信されることはありません。

データURIとBase64のみの違いは何ですか?

データURIはdata:image/png;base64,で始まる完全な文字列で、<img src="...">やCSSのurl()にそのまま貼り付けて使えます。Base64のみはその後に続く純粋なエンコード値だけを含んでおり、自分でフォーマット文字列を組み立てる場合に適しています。

Base64に変換すると容量が大きくなりますか?

はい。Base64エンコードは元のサイズよりおよそ33%大きくなります。バイナリの画像データをテキストとして安全に表現するためのトレードオフなので、特に必要な場合でなければ大きな画像をこの方式で扱うのは避けたほうがよいでしょう。

どの画像フォーマットに対応していますか?

JPG、PNG、WebP、GIFなど、ブラウザが読み込める大半の画像フォーマットに対応しています。