onlinetools.dev

画像形式変換

PNG・JPEG・WebP 間で画像を変換、品質調整付き

ローカル実行
loading…
このツールについて

PNG・JPEG・WebP の間で画像を変換します。インストールもアップロードも不要:ファイルをドロップし、変換先を選び、スライダーで品質を調整すれば、出力サイズがリアルタイムに更新されます。Δ タイルは変換後のファイルがどれだけ小さく(あるいは大きく)なったかを正確に示すので、品質設定は当てずっぽうではなくなります。

3 つの形式には明確な役割分担があります。PNG は完全な透過付きのロスレス — スクリーンショット、UI 素材、シャープな輪郭や文字を含むものに向きます。JPEG は写真を強力に圧縮しますがアルファチャンネルがなく、硬いエッジをにじませます。WebP は同等品質で JPEG より 25–35% 小さくなるのが普通で、透過をサポートし、現行ブラウザすべてで使えます — Web 用途ではたいてい WebP が正解です。

変換はブラウザ内の canvas 上で行われます:画像はデコードされ、再描画され、ブラウザがページ表示に使うのと同じコーデックで再エンコードされます。これがこのツールがプライベートである理由であり、正確なバイト数が Chrome・Firefox・Safari で少しずつ違う理由でもあります — 各ブラウザが独自のエンコーダを積んでいるからです。

よくある質問

JPEG や WebP の品質はどの値にすべき?
75〜90 でほぼすべての実用ケースをカバーできます。85 なら大半の写真は元と見分けがつかず、サイズは数分の一。約 70 を下回るとグラデーションや肌にブロックノイズが出始め、90 を超えると見えない改善のためにサイズが急増します。スライダーを動かしてサイズタイルを見れば、最適点はたいてい明らかです。
PNG を JPEG に変換したら逆に大きくなったのはなぜ?
JPEG は写真的なグラデーション向けで、フラットな色面は苦手です。スクリーンショットや図表、UI 素材は PNG では見事に圧縮されます(同一ピクセルの長い連続)が、JPEG はすべてのシャープなエッジの周りにノイズを記録せざるを得ません — ファイルは大きくなり、リンギングも見えます。グラフィックは PNG のまま、あるいは WebP への変換を。
JPEG に変換すると透過はどうなりますか?
JPEG にはアルファチャンネルがないため、透明領域は何かで塗りつぶす必要があります — このツールでは Web 画像の慣例に従い白に合成します。透過を残したい場合は PNG か WebP を変換先に選んでください。
なぜこのツールで AVIF や HEIC に書き出せないのですか?
canvas の toBlob API は、ブラウザがエンコーダを搭載している形式しか出力できません — PNG と JPEG はどこでも、WebP は Chromium と Firefox で使えます。AVIF エンコードはまだ稀で、HEIC は特許の問題があり、ブラウザはデコードのみ対応です。書き出せない形式を選ぶと、黙って PNG を渡す代わりにその旨を表示します。
関連ツール