画像をBase64に変換

画像とBase64文字列を相互変換します。すべての処理はブラウザ内で完結します。

ここに画像をドロップまたはクリックして選択

画像はまだありません

画像をBase64に変換について

画像をBase64エンコード文字列に変換してHTML、CSS、JSONに埋め込んだり、Base64文字列をデコードしてダウンロード可能な画像に戻したりできます。すべての処理はブラウザ内でローカルに行われます。

このツールについて

画像をBase64エンコード文字列に変換したり、既存のBase64文字列を表示・ダウンロード可能な画像にデコードしたりできるツールです。すべての処理はブラウザ内でローカルに行われ、サーバーへのアップロードは一切ありません。

使い方

  1. 画像をドロップゾーンにドラッグ＆ドロップするか、クリックしてファイルを選択します。
  2. Base64文字列が自動的に表示されるので、「コピー」をクリックしてコードで利用できます。
  3. 逆に変換する場合は、data:image/... 形式のBase64文字列をテキストボックスに貼り付けて「プレビュー」をクリックします。
  4. 「ダウンロード」をクリックしてプレビューした画像をデバイスに保存します。

主な用途

使いこなすヒント

よくある質問

画像をBase64に変換する代わりにファイルをリンクするだけではいけませんか？

画像をBase64で埋め込むと、余分なHTTPリクエストを回避でき、HTMLやCSSの一部として直接バンドルされるため、小さなアイコンやインライン画像に有効です。ただし、ブラウザが画像を個別にキャッシュできないため、大きな写真にはお勧めしません。

大きな写真をBase64に変換することはお勧めですか？

一般的にはお勧めしません。Base64はファイルサイズを約33%増加させ、ブラウザが画像を個別にキャッシュできないようにするため、大きな画像にはアイコンやロゴなどの小さなアセット用に予約する方が最適です。

「data:image/...」プレフィックスは何ですか？

これは、その後の文字列がインラインな画像データであることをブラウザに伝えるデータURI方式です。また、MIME タイプ（例：image/png）も指定され、ブラウザが別のファイルなしでレンダリング方法を知ることができます。

既存のBase64文字列から画像をプレビューできますか？

はい。デコード用のテキストボックスに完全な「data:image/...」文字列を貼り付けて「プレビュー」をクリックすると、レンダリングされ、「ダウンロード」を使って通常の画像ファイルとして保存できます。

画像をエンコードまたはデコードするときに送信されますか？

いいえ。エンコードとデコード処理はブラウザ内でローカルに行われます。画像データはサーバーに送信されません。

画像とBase64文字列をブラウザ内で相互変換します。無料・高速、アップロード不要。