画像Base64変換（data URI作成）

画像をドロップするか選ぶと、すぐにBase64のdata URIが作られます。

入力した文章やファイルはサーバーに送らず、このブラウザー内だけで処理します。

画像をドロップ、クリックして選択、またはCtrl+Vで貼り付け

結果

使い方

画像を枠にドロップするか、枠をクリックしてファイルを選びます。スクリーンショットなどはCtrl+Vでそのまま貼り付けられます。
プレビューの下に形式・縦横サイズ・元のファイルサイズ・Base64にしたときのサイズが表示されます。
「出力形式」のボタンで、data URI、Base64のみ、CSSのbackground-image、幅と高さ付きのHTML imgタグ、Markdownの画像記法を切り替えます。
「コピー」でそのまま貼り付けられます。「ダウンロード」でテキストファイルとして保存することもできます。

data URIにするメリットは？

画像をHTMLやCSSに直接埋め込めるため、別ファイルの読み込みが不要になります。小さなアイコンや、画像ファイルを置けないHTMLメール・単体のHTMLファイルなどで便利です。

どのくらいのサイズまで使うべきですか？

Base64にすると元より約33%大きくなり、ブラウザーのキャッシュも別に効かなくなります。数KB〜数十KB程度の小さな画像に向いており、写真のような大きな画像は通常のファイルとして読み込むほうが軽くなります。

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

いいえ。画像の読み込みと変換はすべてブラウザー内で行われ、サーバーには送信されません。