---
title: "画像Base64エンコード - 画像ファイルをBase64形式に変換 | Web ToolBox"
description: PNG、JPG、GIFなどの画像ファイルをBase64文字列に変換できるツールです。データURIの作成やHTML・CSSへの埋め込み用画像の準備に向いています。
canonical_url: "https://web-toolbox.dev/tools/base64-encode-image"
meta:
  author: K
  "og:description": PNG、JPG、GIFなどの画像ファイルをBase64文字列に変換できるツールです。データURIの作成やHTML・CSSへの埋め込み用画像の準備に向いています。
  "og:image": "https://web-toolbox.dev/og/ja/tools/base64-encode-image-e44c469a.png"
  "og:image:alt": 画像Base64エンコード
  "og:image:height": "630"
  "og:image:width": "1200"
  "og:title": "画像Base64エンコード - 画像ファイルをBase64形式に変換 | Web ToolBox"
---

> Index of every page on this site: [llms.txt](https://web-toolbox.dev/llms.txt)

# **画像Base64エンコード**

画像をBase64文字列に一括変換

**画像ファイル (複数可)**

**ここにファイルをドラッグ & ドロップ**

または

## 画像Base64エンコードとは？

画像ファイルをBase64文字列へ変換するツールです。変換結果は Raw、Data URI、HTML の `**img**` タグ、CSS の `**background-image**` 形式で確認できるため、用途に合わせた形でそのまま使えます。

小さな画像をHTMLやCSSへ直接埋め込みたいときや、画像データをテキストとして扱いたいときに便利です。複数画像にも対応しており、ブラウザ上でまとめて確認できます。

## 使い方

1. 画像ファイルを選択するか、ドラッグ&ドロップで追加します。
2. 自動でBase64変換結果が表示されます。
3. 必要な出力形式を選びます。
4. 結果をコピーして使います。

一度に最大20枚まで扱えるため、複数ファイルの比較やまとめて確認にも向いています。

## 出力形式

### Base64（Rawデータ）

Data URI宣言を含まない、純粋なBase64文字列です。APIや独自処理でBase64本体だけが必要なときに使います。

### Base64（DataURI宣言付き）

`**data:image/...;base64,**` を含む形式です。ブラウザでそのまま画像として扱いたいときに向いています。

### HTML imgタグ

`**<img src="..." />**` の形で出力します。HTMLへそのまま貼りたい場合に便利です。

### CSS Background Image

`**background-image: url("...");**` の形で出力します。CSSへ貼り付けたいときに使いやすい形式です。

## 確認できる情報

変換結果ごとに、画像のプレビューと次の情報を確認できます。

- ファイル名
- 最終更新日
- 縦サイズ
- 横サイズ

出力形式だけでなく、元画像の基本情報も合わせて見たいときに便利です。

## 活用シーン

- 小さな画像をHTMLやCSSへ直接埋め込みたいとき
- Data URI形式の画像データを作りたいとき
- APIやJSONで画像をテキストとして扱いたいとき
- 複数画像のBase64結果をまとめて確認したいとき

## 使うときの注意点

- Base64化すると文字列が長くなるため、大きな画像では扱いにくくなります
- 小さな画像や埋め込み用途との相性が良く、大きな画像ではファイル参照のほうが向くこともあります
- 画像を追加すると結果はブラウザ上で生成されますが、極端に大きな画像では表示や操作が重くなることがあります

**使ってみてどうでしたか？**

最終更新: 2025年1月22日

### **関連ツール**

- [<h4>**画像Base64デコード**</h4>](https://web-toolbox.dev/tools/base64-decode-image)
- [<h4>**ダミー画像ジェネレーター**</h4>](https://web-toolbox.dev/tools/dummy-image-generator)
- [<h4>**画像比較スライダー**</h4>](https://web-toolbox.dev/tools/image-compare-slider)
- [<h4>**画像リサイズ**</h4>](https://web-toolbox.dev/tools/image-resizer)
- [<h4>**JPG変換**</h4>](https://web-toolbox.dev/tools/jpg-converter)
- [<h4>**ピクセルアート変換**</h4>](https://web-toolbox.dev/tools/pixelart-converter)
- [<h4>**PNG変換**</h4>](https://web-toolbox.dev/tools/png-converter)
- [<h4>**QRコードジェネレーター**</h4>](https://web-toolbox.dev/tools/qrcode-generator)

```json
{"@context":"https://schema.org","@graph":[{"@id":"https://web-toolbox.dev/#website","@type":"WebSite","description":"アカウント登録不要で使える無料Web開発ツール80種類以上。JSON整形、Base64変換、カラーコード変換、QRコード生成などをブラウザ上で瞬時に実行。開発者の作業効率を大幅に向上させます。","inLanguage":"ja-JP","name":"Web ToolBox","url":"https://web-toolbox.dev/","workTranslation":{"@id":"https://web-toolbox.dev/en#website"}},{"@id":"https://web-toolbox.dev/tools/base64-encode-image#webpage","@type":"WebPage","description":"PNG、JPG、GIFなどの画像ファイルをBase64文字列に変換できるツールです。データURIの作成やHTML・CSSへの埋め込み用画像の準備に向いています。","name":"画像Base64エンコード - 画像ファイルをBase64形式に変換","url":"https://web-toolbox.dev/tools/base64-encode-image","isPartOf":{"@id":"https://web-toolbox.dev/#website"},"potentialAction":[{"@type":"ReadAction","target":["https://web-toolbox.dev/tools/base64-encode-image"]}]},{"@id":"https://web-toolbox.dev/tools/base64-encode-image#/schema/web-application/1","@type":"WebApplication","applicationCategory":"UtilityApplication","description":"PNG、JPG、GIFなどの画像ファイルをBase64文字列に変換できるツールです。データURIの作成やHTML・CSSへの埋め込み用画像の準備に向いています。","name":"画像Base64エンコード - 画像ファイルをBase64形式に変換","operatingSystem":"Windows, macOS, Linux, Android, iOS"}]}
```

## Sitemap

See the full [sitemap](https://web-toolbox.dev/sitemap.md) for all pages.