Base64 画像変換ツール — オンライン画像変換
Encode PNG, JPG, WEBP, GIF, or SVG images directly to Base64 code snippets, or preview Base64 strings back to visual graphics.
画像をここにドラッグ＆ドロップ、またはクリックして選択
Supports PNG, JPG, WEBP, GIF, SVG up to 10MB
よくある質問 (FAQ)
オンラインで画像を Base64 に変換するにはどうすればよいですか?
画像ファイル (PNG、JPG、GIF、SVG、WEBP) を Image Base64 コンバーターにアップロードします。このツールは、ブラウザ内で画像をローカルに処理し、生の Base64 文字列、HTML img タグ、および CSS データ URI を生成します。このオフライン処理により、個人の写真や独自のグラフィックが完全にプライベートに保たれることが保証されます。
Base64 画像を HTML または CSS に直接埋め込むにはどうすればよいですか?
HTML では、img タグの src 属性を「data:image/png;base64,[string]」に設定することで、Base64 画像を埋め込むことができます。 CSS では、background-image プロパティを「url("data:image/png;base64,[string]")」に設定できます。インライン データ URI として知られる HTML または CSS に画像を直接埋め込むと、ブラウザーがページを読み込むために必要な HTTP リクエストの数が減り、小さなアイコンや装飾的な UI 要素のページ レンダリングが高速化されます。ただし、スタイルシートや HTML のサイズが大きくなるとページの読み込みが遅れる可能性があるため、大きな画像に対してこれを行うことは避けてください。
Base64 画像コンバーターはどの画像形式をサポートしていますか?
当社のクライアント側 Base64 画像コンバータは、一般的な Web 画像形式をすべてサポートしています。 PNG、JPEG/JPG、GIF、SVG、WEBP、ICO、AVIF ファイルをアップロードできます。コンバーターは、生成された Base64 文字列のファイル ヘッダーとプレフィックス形式から画像形式を自動的に検出し、生成された HTML および CSS スニペットが直接コピー＆ペーストできるように正しく形式設定されていることを確認します。プロセス全体がローカル ブラウザのメモリ内で実行されるため、高速な変換が保証されます。このローカル レンダリングにより、アニメーション GIF と透明 PNG は変換後もそのプロパティが完全に保持されます。
Base64 文字列をデコードして画像ファイルに戻すにはどうすればよいですか?
Base64 文字列をデコードして画像ファイルに戻すには、Base64 テキストまたはデータ URI を [画像デコーダ] パネルに貼り付けます。このツールは入力を解析し、再構成されたイメージのプレビューを生成し、ダウンロード リンクを提供します。 [ダウンロード] をクリックすると、ブラウザーはバイト ストリームをローカルで画像 BLOB に変換し、コンピューターに保存します。デコードプロセスは即時かつ安全であり、サーバーにアップロードせずにブラウザ内で完全に実行されます。これにより、開発者や設計者は、コマンド ライン ツールを使用せずに、base64 でエンコードされたグラフィックスを迅速に検証して保存できます。
運用 Web サイトで Base64 イメージを使用する必要がありますか?
Base64 イメージは、小さなアイコン、SVG、および追加の HTTP リクエストなしですぐに読み込む必要がある重要なデザイン要素に最適です。ただし、Base64 エンコードではファイル サイズが 33% 増加するため、運用コードに大きな画像や写真を埋め込むことは避けてください。これを行うと、HTML または CSS スタイルシートのサイズが増加し、ページのレンダリングがブロックされる可能性があります。大きな画像の場合は、CDN でホストされている WEBP や AVIF などの最新の形式を使用するのが最適です。一般に、Web パフォーマンスを最適化するには、遅延読み込みで応答性の高い画像を使用することがベスト プラクティスです。