画像 Base64 変換 - ローカルで Data URI を生成

無料のオンライン画像Base64変換ツール。PNG、JPG、SVG、WebP、またはGIF画像を、CSSの背景やHTMLのimgタグ用のData URIにローカルでエンコードします。アップロードは不要です。

Click for theater mode

変換結果

画像をアップロードすると、Data URI、CSS、HTMLコードが表示されます。

How to Use

  1. PNG、JPG、SVG、WebP、またはGIF画像をアップロードエリアにドラッグするか、クリックしてファイルを選択します。
  2. 画像のプレビュー、MIMEタイプ、元のサイズ、およびData URIの出力サイズを確認します。
  3. 完全なData URI、生のBase64文字列、CSSの background-image、またはHTMLの <img> スニペットをコピーします。
  4. コードをCSS、HTML、メールテンプレート、またはJSON構成に貼り付けます。

例:「SVGサンプルを読み込む」をクリックして、ローカルのSVGアイコンをData URIとして生成し、CSSまたはHTMLスニペットをコピーします。

Core Features

  • 即時の Data URI 生成: 画像をドロップするだけで、data:image/...;base64,... というData URIをブラウザ内で直接生成します。
  • そのまま使えるCSS&HTML: Data URIのプレフィックスを手書きすることなく、CSSの background-image やHTMLの <img> スニペットをコピーできます。
  • ウェブ画像フォーマットに対応: PNG、JPG、SVG、WebP、GIF、AVIF、およびお使いのブラウザが読み取り可能なその他の画像形式で動作します。
  • 一括処理キュー: 複数のアイコン、電子メール素材、またはUI画像をドロップし、ファイルごとに必要なスニペットをコピーできます。
  • 100%プライベートな処理: 画像はブラウザの FileReader APIを使用してローカルで読み込まれます。アップロードされることはありません。

Related Tools

FIRE計画シミュレーター (経済的自由の積立予測)

インフレ調整に対応した 2026 年版のFIRE計画計算機。将来の購買力をシミュレーションし、リタイアメントに必要な資産との差分(ギャップ)を分析。ExcelやNotionの管理用ダッシュボードに適したCSVをワンクリックで書き出せます。100%プライベートなクライアントサイド計算。

ポジションサイズ計算機 - 許容リスクによる最適なエントリー量の算出

口座資金、許容リスク比率(%)、エントリー価格、ロスカット価格から取引ポジションサイズを計算します。データは送信されず、ブラウザ上で安全に複数のリスクシナリオを比較できます。

複利計算シミュレーター | 積立投資の将来価値&金利推移グラフ

元本、毎月の積立額、想定利回り(年利)、運用期間から将来の複利効果を計算します。元本、運用益、合計残高をインタラクティブなグラフで視覚化。データは送信されません。

ローン計算機 | 毎月の返済額・元金・金利の内訳計算

元利均等および元金均等返済方式に対応したローンシミュレーター。毎月の返済額、金利総額、返済スケジュール表を計算し、グラフや表で可視化します。

投資・ROI計算機 | 複利シミュレーター&資産推移

初期投資額、毎月の積立額、想定利回り、およびインフレ調整後の結果をローカルで計算します。複利グラフ、投資収益率(ROI)、年次推移表を用いて将来の資産推移をシミュレーションできます。

APR APY 変換 | 名目金利&実質金利計算機

APR(名目年利率)と APY(実質年利率)をローカルで相互変換します。金利を入力し、複利計算の頻度を選択すると、実質金利、スプレッド、および頻度の比較結果が即座に表示されます。

粗利益率・マークアップ計算機 | Margin & Markup 相互変換

粗利益、マークアップ(値入率)、マージン(粗利益率)、および販売価格をローカルで計算します。原価と売価、または原価と目標マージンを入力するだけで、即座に計算結果が表示されます。

CPM & CPC 計算機 | 広告費&クリック率 (CTR) オンラインツール

CPM(インプレッション単価)とCPC(クリック単価)をローカルで計算します。予算、表示回数、クリック数、CPM、CPC、CTRを即座にシミュレーションし、広告キャンペーンの計画に役立ちます。

Calculation Logic

Base64エンコーディングは、バイナリの画像データをASCII文字列に変換します。これにより、画像をHTML、CSS、またはJSONに直接埋め込むことができます。Data URIは data:[mime-type];base64,[encoded-data] という形式になり、ブラウザはこれを画像リソースとして読み取ることができます。

重要なトレードオフ:Base64は画像の圧縮技術ではありません。エンコードされた出力は通常、元のファイルよりも約33%大きくなるため、小さなアイコン、ロゴ、メール画像、または少数のHTTPリクエストの削減に最適です。大容量の写真や大量のアセットは、通常は通常の画像ファイルのまま維持し、別途圧縮する必要があります。

FAQ

なぜ画像をBase64に変換するのですか?

小さなアイコン、メール画像、または設定用画像をコードに直接埋め込み、外部リクエストを削減したり、リモートメール画像のブロックを回避したりしたい場合に便利です。

Base64は画像サイズを削減しますか?

いいえ。Base64は通常、エンコードされたサイズを約33%増加させます。これは埋め込みやリクエストの削減には役立ちますが、ストレージの圧縮には役立ちません。

サポートされている画像フォーマットは何ですか?

PNG、JPG、JPEG、SVG、WebP、GIF、AVIF、およびお使いのブラウザが読み取り可能なすべての画像フォーマットです。

画像はアップロードされますか?

いいえ。変換にはブラウザネイティブの FileReader.readAsDataURL APIを使用するため、ファイルはデバイス内にとどまります。

CSSやHTMLを直接コピーできますか?

はい。各画像ごとに、完全なData URI、生のBase64文字列、CSSの background-image、およびHTMLの <img> スニペットが生成されます。