画像をBase64に変換
74バイトの小さなPNGが、data:image/pngで始まる1行の文字列になって返ります。外部の画像を読み込めないメールやPDF、オフラインのアプリにそのまま貼り付けられます。画像の種類はファイル名ではなく中身から判定します。ブラウザで無料で使えます。
- 無料
- ブラウザで動作
- 登録不要
- データは端末の外に出ません
無料で実行
処理はブラウザ内で完結します。ファイルは送信されません。無料でご利用いただけます。
画像ファイルをBase64形式の文字列に変換する機能です。処理はブラウザ内で完結し、無料でご利用いただけます。
Base64がコード内で役立つ場面
小さなアイコンやプレースホルダー画像をコードに直接埋め込みたいとき、Base64形式に変換すれば別ファイルとして読み込む必要がなくなります。外部画像が読み込まれにくいメール用テンプレートでも扱いやすくなります。
変換の流れ
画像ファイルを選ぶと、形式に応じたdata URIの接頭辞を付けたBase64文字列を生成します。生成した文字列はワンクリックでコピーするか、テキストファイルとしてダウンロードできます。
向いていない使い方
サイズの大きい写真をBase64に変換すると、文字列は元のファイルよりおよそ3割ほど大きくなります。通常サイズの写真であれば、画像ファイルへのリンクのままにしておくほうが軽く仕上がります。
活用例
メールテンプレートへのロゴ埋め込み
有限会社ささき印刷が発行する注文確認メールでは、ロゴ画像をBase64文字列として埋め込み、外部画像がブロックされる環境でも表示されるようにしています。
社内ツールのアイコン埋め込み
開発チームが社内ツールのCSSに繰り返し使うアイコンを直接埋め込み、個別のアイコンファイルを大量に読み込む手間を減らしています。
試作段階のプロトタイプ
個人開発者の山本翔太さんは、画像の保存先をまだ用意していない試作段階のアプリで、Base64文字列として画像を仮埋め込みしています。
よくある質問
アップロードした画像は外部に送信されますか?
いいえ。 ブラウザでの利用では変換処理はお使いの端末の中だけで行われます。
Base64にすると容量はどう変わりますか?
元のファイルよりおよそ3割ほど大きくなります。サイズの大きい写真には向いていません。
出力される文字列はどんな形式ですか?
画像形式に応じた接頭辞を含む、完全なdata URI形式で出力されます。
日本語のサポートはありますか?
申し訳ありませんが、日本語でのサポートは行っておりません。サポートは英語またはスペイン語で、担当者が直接対応します。ツール自体は日本語で問題なくご利用いただけます。
Base64の画像はどんな場面で役立ちますか?
外部画像を読み込まないメールにロゴを載せるとき、PDFの請求書に署名やロゴを入れるとき、通信がなくても表示したいアプリの小さなアイコン、1つのファイルで完結させたいHTMLの報告書などで役立ちます。
関連ツール
開発者向け — APIアクセス
このページの機能はすべてAPIからも利用できます。自社システムに組み込みたいチーム向けのセクションです。それ以外の方は上のツールをそのままお使いください。
エンドポイント
Bearerトークンで認証し、POST1回でタスクをキューに登録します。結果はWebhookまたは署名付きリンクで受け取れます。
お使いのスタックから呼び出す
curl -X POST https://api.kit.forhosting.com/image/to-base64 \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"image":"https://ejemplo.com/imagen.jpg"}'const res = await fetch("https://api.kit.forhosting.com/image/to-base64", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"image": "https://ejemplo.com/imagen.jpg"
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/image/to-base64",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"image": "https://ejemplo.com/imagen.jpg"
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/image/to-base64", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"image":"https://ejemplo.com/imagen.jpg"}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"image":"https://ejemplo.com/imagen.jpg"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/image/to-base64", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)リクエスト例
{
"image": "https://ejemplo.com/imagen.jpg"
}レスポンス例
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "image.to_base64",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}非同期APIです。task_idは即時に返ります。ポーリングは1秒あたり1リクエストまでです。
料金
単価はすべて公開しています。トークン換算や独自クレジットはありません。失敗したタスクは課金されません。
制限
max_mb | 15 |
max_megapixels | 12 |
エラー
| HTTP | コード | 意味 |
|---|---|---|
401 | unauthorized | APIキーが無効か、指定されていません。Authorizationヘッダーを確認してください。 |
402 | insufficient_balance | 残高が不足しています。チャージ後に再度お試しください。 |
404 | unknown_type | 指定されたタスクタイプは存在しません。タイプ名を確認してください。 |
429 | rate_limited | リクエストが多すぎます。しばらく待ってから再度お試しください。 |
技術的な注記
生成した文字列はHTML・CSS・JSONに直接埋め込め、別ファイルとしての読み込みが不要になります。
料金について
ブラウザでの通常利用は無料で、回数の制限もありません。ビルド工程やCMSに組み込んで自動化したい場合は、同じ機能をAPI経由で呼び出せます。サーバー側で処理する場合は1リクエストあたり$0.002(米ドル)です。
技術的な質問
APIで自動化する場合の料金は?
サーバー側で処理する場合は1リクエストあたり$0.002です。ビルド工程などへの組み込みで必要な場合の料金で、通常のブラウザ利用は無料です。
ファイルサイズに制限はありますか?
15MB、1200万画素までの画像に対応しています。