画像を Base64 に変換

画像をコードに貼れる文字列に。

無料 · 登録不要 · 端末内で処理

ファイルは端末から出ません

  • Data URIで返る
  • HTML/CSSに埋め込む
  • コピーで写す
  • 非公開端末内で変換
実際の使い勝手

安心して使えるポイント

  • 0件の送信
    • 変換はブラウザの中で
    • 画像は端末に残ります
  • 100%ブラウザで完結
    • サーバー処理はなし
    • 順番待ちなしで返る
  • 1:1の写し
    • 中身をそのまま文字に
    • 画質は落ちません
仕様

画像を Base64 に変換ツールの仕様一覧

入力形式
JPG・PNG・WebP・HEIC
返ってくるもの
データ URI とコピー
貼る先
CSS や HTML にそのまま
一度に扱う数
一枚ずつ
処理する場所
ブラウザのタブの中
ファイルの追加
ドロップ・選択・貼り付け
料金
無料
登録の要否
不要
使い方

画像を Base64 に変換ツールの使い方

  1. 1

    画像を入れる

    画像を落とすか、押して端末から選びます。SVG など多くの形式が使えます。

  2. 2

    文字列をコピー

    データ URI がすぐ出ます。コピーを押すと全部が写ります。

  3. 3

    コードに貼る

    HTML の src か、CSS の url() にそのまま貼って画像を埋め込みます。

よくある質問

よくある質問

どんなときに Base64 を使いますか？

アイコンのような小さな画像に向きます。大きな画像を埋め込むと HTML や CSS が重くなり、表示が遅くなります。

画質は変わりますか？

変わりません。同じ画像のデータを別の書き方で表しているだけで、読み戻せば見た目は同じです。

Base64 から画像に戻せますか？

この画面は画像から文字列にする側だけです。文字列を画像に戻す仕組みは入っていません。

一度に何枚まで追加できますか？

上限はありません。合計 500 MB を超えると開始前に警告が出ます。同名ファイルは ZIP 内で自動的に連番が付きます。動作しない古いブラウザーには、その旨をはっきり表示します。

解説

Base64 をウェブで使う

画像の種類と Base64 の中身を持つデータ URI を作ります。HTML、CSS、JSON に直接埋め込めます。

  • データ URI で埋め込むと通信の回数が減り、小さなアイコンや背景では表示が軽くなります。
  • 引き換えに、文字列は元より三割ほど大きくなり、HTML や CSS と別に貯めておけません。

仕様をすべて見る

画像を Base64 に変換ツールの仕様
入力形式JPG・PNG・WebP・HEIC・HEIF をタブの中で読みます。
返ってくるものデータ URI が一つ。横にコピーのボタンが付きます。
貼る先CSS や HTML にそのまま貼れます。
一度に扱う数一枚ずつです。
処理する場所このブラウザのタブの中。画像は端末から出ません。
ファイルの追加ドラッグ＆ドロップ、選択、Ctrl／⌘+V の貼り付けに対応。そのまま別ツールへ引き継ぎ可。
料金無料
登録の要否不要
次にできること

同じファイルのまま続ける

開発ツール一覧： SPOTTOOLSの開発ツール