スクリーンショット切り抜き
スクリーンショットや写真を、見せたい範囲だけにぴったり切り抜けます。
- ブラウザ内で動作
- アップロード不要
- アカウント不要
ブラウザツールを読み込んでいます…
スクリーンショット切り抜きでできること
スクリーンショットには、Dock、2 台目のモニター、ブラウザのタブ、半分だけ映ったサイドバーなど、余計なものが写りがちです。必要な部分を枠で囲むようにドラッグするか、別の画像とぴったり合わせたい場合は「その他のオプション」を開いて X、Y、幅、高さをピクセル単位で入力します。
アスペクト比を固定すれば、スライドや動画のサムネイル用に 16:9、SNS の投稿用に 1:1 や 4:5、縦型動画用に 9:16 の枠を保てます。スクリーンショットだけでなく、PNG、JPG、WebP、GIF、BMP、AVIF のどの画像にも使えます。一部を切り取るのではなく画像全体のピクセルサイズを変えたい場合は、スクリーンショットのリサイズを使ってください。
例
選ぶもの
組み込みの 1440 × 900 の請求ページのサンプル(「例を使う」)
ダウンロード
example-billing-settings-cropped.png 592 × 252 px、位置 X 840, Y 152 で切り抜き
サンプルでは、支払いカードの周りに 16 px の余白を取って切り抜き枠が置かれます。自分で描いたり入力したりした枠で置き換えられます。
スクリーンショット切り抜きの使い方
- 「ファイルを選択」をクリックするか、スクリーンショットを貼り付けるか、画像をページにドロップします。
- プレビュー上をドラッグして切り抜き枠を描きます。先に「アスペクト比」を選ぶと、枠がその形に保たれます。枠の内側をドラッグすると移動、角をドラッグするとサイズを変更できます。
- 「.png をダウンロード」をクリックします。JPG や WebP で保存するには、「その他のオプション」で「ファイル形式」を変更します。
知っておきたいこと
- 切り抜き枠は常に長方形です。角丸や円形にするには、先に切り抜いてからスクリーンショット角丸ツールにかけてください。
- アスペクト比を切り替えると、枠の左上の位置と幅を保ったまま、画像からはみ出す場合は縮小されます。切り替えた後は枠を確認してください。
- 切り抜きはピクセルを取り除くだけです。小さな範囲を鮮明にすることはできず、幅 300 px で切り抜いた画像は 300 px のままです。
スクリーンショット切り抜きについてよくある質問
スクリーンショットを正確なピクセルサイズで切り抜くには?
「その他のオプション」を開き、左上の X と Y、幅と高さを入力します。値は元の画像のピクセル単位なので、Retina のスクリーンショットでも 1280 × 720 で切り抜けば 1280 × 720 でダウンロードされます。
スライドや動画用には、どのアスペクト比で切り抜けばよいですか?
プレゼンのスライド、YouTube のサムネイル、多くのチュートリアル動画には 16:9 を使います。LinkedIn や Instagram のフィード投稿には 4:5 か 1:1、ショート、リール、TikTok には 9:16 です。ドキュメントやヘルプ記事には「自由」が最適です。
切り抜くと画質は落ちますか?
既定の PNG のままなら落ちません。枠の中のピクセルはそのままコピーされます。JPG や WebP で保存すると圧縮がかかり、写真なら通常問題ありませんが、小さな文字はぼやけることがあります。
写真やスマートフォンのスクリーンショットも切り抜けますか?
はい。JPG の写真や縦長のスマートフォンのスクリーンショットなど、ブラウザで開ける画像ならどれでも切り抜けます。とても縦長の画像では、プレビューの上のズームボタンを使って枠を正確に置いてください。