ハコツールズ

画像形式変換(WebP/PNG/JPG)

WebPで受け取った画像が、使いたいソフトでは開けないことはないでしょうか。ファイルをドラッグ&ドロップするだけで、JPGやPNGなど目的の形式にまとめて変換できます。

公開: / 更新: / 制作・運営: ハコツールズ運営者

WebP / PNG / JPG ファイルをドラッグ&ドロップ、または

複数ファイル選択可(最大 50MB / ファイル)

使い方・仕組み解説

画像形式変換(WebP/PNG/JPG)とは?

WebP・PNG・JPGの画像ファイルを、選んだ形式にブラウザ内で一括変換するツールです。Canvas APIで画像を再エンコードするため、画像データがサーバーに送信されることはありません。複数ファイルをまとめて変換し、ZIPで一括ダウンロードできます。会員登録も枚数制限もありません。

WebPをJPGに変換するには?

本ツールにWebPファイルをドラッグ&ドロップし、出力形式でJPGを選んで「変換する」を押すだけです。PNGやJPGを起点にする場合も手順は同じで、ドロップした画像をそのまま指定形式に変換します。

使い方

  1. 変換したいWebP/PNG/JPGファイルをドラッグ&ドロップするか、「ファイルを選択」から選びます(複数選択可)
  2. 出力形式(JPG/PNG/WebP)を選択します。JPGの場合は画質スライダーで圧縮率を調整できます(既定は0.9)
  3. 「変換する」を押すと、各ファイルが順番に変換されプログレスバーで進捗が表示されます
  4. ファイル一覧には元のサイズと変換後のサイズが並んで出るので、容量がどれだけ変わったかその場で確認できます
  5. 1枚の場合は「保存」リンクから、複数の場合は「一括ダウンロード (ZIP)」からまとめて保存できます

WebP・PNG・JPGはどう使い分ける?

写真はJPG、スクリーンショットや図表はPNG、Webページに載せる画像はWebPが基本です。3つの形式は圧縮方式と透過の扱いが違い、その差が得意な画像の種類を決めます。

WebPは非可逆圧縮と可逆圧縮の両方を扱え、透過も保持できます。GoogleのWebP公式ドキュメントでは、非可逆のWebPは同等品質のJPGより25〜34%小さく、可逆のWebPはPNGより26%小さいとされています。500KBのJPG写真をWebPに置き換えるなら、おおむね330〜375KBが目安です。Chrome・Edge・Firefox・Safariを含む主要ブラウザは表示に対応済みです。自分のサイトやブログに載せる画像なら、WebPが第一候補になります。

JPGは非可逆圧縮で、写真のように階調が連続する画像で効率よく容量を稼げます。透過は保持できません。それでもJPGを選ぶ理由は互換性です。古い業務システム、応募フォーム、印刷所の入稿仕様は、JPGとPNGしか受け付けないことが珍しくありません。相手の環境が分からないままメールで送る画像も、JPGが無難です。

PNGは可逆圧縮で、保存し直しても画素は変わりません。色数が少なく境界がくっきりした画像、つまりスクリーンショット・ロゴ・アイコン・図表・イラストに向いています。こうした画像をJPGにすると、文字や線の周囲に色のにじみが出て読みにくくなります。逆に写真をPNGで保存すると、ほぼすべての画素が異なる色を持つため可逆圧縮が効かず、JPGの数倍から十数倍の容量になります。圧縮方式そのものの詳しい仕組みは画像一括圧縮の解説で扱っています。

WebP・PNG・JPGの違いは次のとおりです。

形式圧縮方式透過得意な画像主な用途
WebP非可逆・可逆の両対応。同画質ならJPGより小容量対応写真・透過が必要な画像Webページ表示用の画像。容量を抑えつつ透過も保ちたい場合
JPG非可逆圧縮。写真のような階調豊かな画像で効率が良い非対応写真書類・メール添付・フォーム投稿・印刷など汎用用途
PNG可逆圧縮。劣化しないが写真ではJPGより大容量対応スクリーンショット・ロゴ・図表・イラスト透過を保ちたい画像、繰り返し編集する画像

用途ごとにどの形式へ変換すればいい?

迷ったら、その画像を最後に誰が開くかで決めてください。自分のサイトに置くならWebP、他人に渡すならJPG、文字や透過が含まれるならPNGです。

用途選ぶ形式理由
サイト・ブログに載せる写真WebP同じ画質でJPGより小さく、表示が速くなる
メールで取引先に送るJPG相手の環境を問わず開ける
応募・申請フォームへのアップロードJPG受付形式がJPGとPNGに限られることが多い
印刷所への入稿JPG(画質0.9以上)画面表示より高い解像度が要る。圧縮は控えめにする
スクリーンショット・図表・グラフPNG文字と細い線がにじまない
透過のあるロゴ・アイコンPNG / WebPJPGにすると透明部分が白で塗りつぶされる
何度も編集し直す作業用の原本PNG可逆圧縮なので保存を繰り返しても劣化しない

変換の仕組みは?

本ツールはcreateImageBitmapで画像をデコードし、Canvasに描画してからtoBlob()で指定形式に再エンコードします。処理はすべてお使いの端末内(JavaScript)で完結し、画像データがインターネットに送信されることはありません。ページを開いた後は通信を切っても動作するため、社外秘の資料や家族の写真も安心して変換できます。

再エンコードなので、出力されるのは画素から作り直した別のファイルです。元のファイルを詰め直したものではありません。寸法(ピクセル数)は元のまま引き継がれ、変わるのは形式と容量だけです。寸法も一緒に変えたい場合は画像リサイズを使ってください。

JPGの画質設定でファイルサイズはどう変わる?

数値が低いほど圧縮率が高まりファイルは小さくなりますが、輪郭のにじみやブロックノイズが目立つようになります。目安として、4,000×3,000pxの写真をPNGからJPGに変換する場合、画質0.9ならおおむね1〜3MB、画質0.5まで下げるとおおむね300KB〜1MBまで縮みます(実際の容量は画像の内容によって変わります)。画質スライダーは0.1〜1.0の範囲で指定し、この値はtoBlob()のquality引数にそのまま渡ります。

容量と画質は比例しません。高い側では下げてもあまり縮まず、低い側では急に縮む代わりに劣化が見えてきます。用途別の目安は次のとおりです。

  • 0.9(既定): 拡大しても違いが分かりにくい水準。印刷に回す写真や納品用
  • 0.8: 通常の閲覧では劣化を感じません。メール添付やフォーム投稿の標準設定
  • 0.6: 空や肌などの平坦な部分にわずかなむらが出ます。一覧表示やサムネイル用
  • 0.4以下: 輪郭のまわりのノイズと平坦部の段差がはっきり出ます。容量を最優先する場合のみ

画質を下げても目標の容量に届かないときは、寸法を見直してください。ピクセル数は面積で効くため、長辺を半分にすればピクセル総数は4分の1になり、画質を落とさずに容量を大きく削れます。

PNGやWebPで出力するときも画質は選べる?

選べません。画質スライダーは出力形式がJPGのときだけ表示され、PNGとWebPはブラウザ既定の品質でエンコードします。

PNGは可逆圧縮なので、そもそも指定する画質がありません。WebPには品質の概念がありますが、JPG用に下げたスライダーの値がWebPのエンコードにも漏れると、意図せず粗い画像ができてしまいます。それを避けるため、本ツールはJPG以外への変換では品質の指定をブラウザに任せています。WebPの容量を数値で詰めたい場合は、品質を指定してWebP出力できる画像一括圧縮のほうが向いています。

透過のある画像をJPGに変換すると何が起きる?

透明だった部分は白で塗りつぶされます。JPGはアルファチャンネル(透明度)を保持できない形式です。本ツールはCanvasに描画する前に白い背景を敷いてから画像を重ねています。透過をそのまま残したい場合は、出力形式にPNGかWebPを選んでください。

背景を敷かずに透過画像をJPGへ書き出すと、透明部分は黒く潰れます。白で塗るのはこれを避けるためです。白以外の背景色は指定できません。先に画像編集側で背景を敷いてから変換してください。

形式の変換を何度も繰り返すと画質はどうなる?

JPGを経由するたびに劣化が積み重なります。可逆圧縮のPNGは画素をそのまま保存するため、PNGだけを経由するなら劣化しません。ただしJPGからPNGへ戻しても画質は復元されません。最初のJPG化で捨てた情報はすでに失われているため、JPGとPNGを往復させても劣化した画素をPNGの大きな容量で抱えるだけです。編集と変換を繰り返す予定があるなら、元のファイルは別に保管してください。なおWebPの書き出し方(非可逆・可逆)はブラウザ既定に任せているため、本ツール側では選べません。

変換すると撮影日時や位置情報は残る?

残りません。撮影日時・位置情報・カメラの機種といったExif情報は、再エンコードの過程で引き継がれません。これは用途によって利点にも欠点にもなり、位置情報が分かるスマホ写真をSNSやブログに載せる前に変換すれば位置情報だけを落とせる一方、撮影日時を記録として残したい写真は変換後のファイルだけでは日付が分からなくなります。日付を残したい写真ほど、元ファイルの保管が前提になります。

複数の画像をまとめて変換できる?

できます。枚数の上限は設けていません。投入した順に1枚ずつ変換され、プログレスバーで進捗が分かります。

変換が2枚以上完了すると「一括ダウンロード (ZIP)」ボタンが出ます。押すとimage-format-converter.zipという1つのファイルにまとまります。このZIPは無圧縮(store)で作ります。JPG・PNG・WebPはいずれも圧縮済みのデータで、ZIP側で再圧縮しても容量は減らずCPU時間の無駄になるためです。同じ名前のファイルが混ざった場合は「写真 (2).jpg」のように連番が付き、上書きされることはありません。高解像度の画像を数十枚まとめて投入すると、端末のメモリとCPUを使う処理のためブラウザが重くなることがあります(目安は10〜20枚ずつ)。

50MBを超える画像はどうすればいい?

先に容量か寸法を落としてから変換してください。本ツールは1ファイル50MBまでで、超えたファイルはその行がエラー表示になります。

50MBに達するのは、長辺が1万ピクセル級のスキャン画像や、写真を可逆圧縮のまま保存した大きなPNGです。画像一括圧縮で容量を落とすか、画像リサイズで寸法を小さくすれば、本ツールで扱える大きさになります。

HEICやAVIF、GIFも変換できる?

できません。入力として受け付けるのはWebP・PNG・JPGの3形式だけで、それ以外は「WebP・PNG・JPG 以外の形式には対応していません。」というエラーになります。

iPhoneで撮った写真のHEIC形式はHEIC→JPG変換が担当します。HEICをWebPにしたい場合は、まずHEIC→JPG変換でJPGにし、そのファイルを本ツールでWebPに変換する2段構えになります。

ほかの画像ツールとの使い分けは?

本ツールの役目は形式の変換だけです。容量・寸法・見た目を変えたいなら、それぞれ専用のツールのほうが手数が少なく済みます。

注意事項

  • 1ファイルあたり50MBまで対応しています。それ以上のファイルはエラーになります
  • WebP形式の書き出し(エンコード)は一部のブラウザで非対応の場合があります。非対応の環境では自動的にPNGにフォールバックし、拡張子もpngに差し替えたうえで、ツール内にその旨を表示します
  • JPGは非可逆圧縮のため、変換のたびに画質がわずかに劣化します。何度も再変換を繰り返す予定がある場合はPNGを選んでください
  • WebP・PNGを入力にしてJPGへ変換する場合、透過部分は白で塗りつぶされ元に戻せません
  • 画質スライダーはJPG出力のときだけ効きます。PNGとWebPはブラウザ既定の品質で書き出されます
  • JPGの出力ファイルの拡張子はjpgです(jpegではありません)
  • 撮影日時や位置情報などのExifは引き継がれません。必要な場合は元ファイルを保管してください
  • 寸法(ピクセル数)は変換しても変わりません。寸法を変えたい場合は画像リサイズを使ってください
  • 処理はお使いの端末のメモリとCPUを使います。多数のファイルを一度に変換すると時間がかかる場合があります

画像ツール全体の使い分けは画像の圧縮・リサイズ・モザイク・文字入れをインストールなしで行う方法、ブラウザだけでファイルを処理する仕組みは画像・PDFの変換はインストール不要?ブラウザだけで処理する方法のガイドで解説しています。

よくある質問

WebPをJPGに変換するには?
本ツールにWebPファイルをドラッグ&ドロップし、出力形式でJPGを選んで「変換する」を押すだけです。ブラウザ内のCanvas APIで再エンコードするため、サーバーへのアップロードは発生しません。
透過のあるPNGやWebPをJPGに変換するとどうなる?
透明だった部分は白で塗りつぶされます。JPGはアルファチャンネル(透明度)を保持できない形式のためです。透過を残したい場合はPNGかWebPを出力形式に選んでください。
WebP形式で書き出せないブラウザだとどうなる?
自動的にPNGで出力します。WebPの表示(デコード)は主要ブラウザが対応済みですが、書き出し(エンコード)は一部のブラウザで非対応の場合があるためです。フォールバックが発生した場合はツール内に表示されます。
変換した画像はサーバーに送信される?
いいえ。デコードと再エンコードはブラウザ内で完結し、画像データが外部サーバーに送信されることはありません。個人の写真や社外秘の画像も安心して変換できます。
このツールをシェア:

関連ツール

画像

ドット絵図案メーカー(アイロンビーズ・クロスステッチ対応)

画像をアップロードすると、マス目に区切ったドット絵の図案に変換できる無料ツール。使う色数を指定して減色し、色ごとの必要個数とプレート枚数まで集計します。アイロンビーズ・クロスステッチ・パーラービーズの図案づくりに。登録不要・ブラウザ内完結で画像は送信されません。

画像

うちわ文字メーカー(無料・A4分割印刷・型紙対応)

コンサートやライブで使う応援うちわの文字を、ブラウザだけで作れる無料ツール。太い袋文字(縁取り文字)を作り、ジャンボうちわサイズをA4用紙に分割して家庭用プリンタで印刷できます。切り抜き用のカットラインつき。登録不要・データ送信なし。

画像

電子印鑑メーカー(丸印・角印・無料)

氏名・会社名を入力するだけで丸印(認印)と角印の電子印鑑を無料で作成。朱色の濃さ・かすれ・書体を調整でき、Word や Excel にそのまま貼れる透過 PNG を保存できます。入力内容はブラウザ内で処理し、サーバーへ送信しません。

画像

バーコード作成

JAN-13(EAN-13)・EAN-8形式のバーコードを無料で作成。チェックデジットを自動計算し、PNG・SVGでダウンロードできます。作成はすべてブラウザ内で完結し、入力内容がサーバーに送信されることはありません。