SmallToolsLab
使い方ガイド

スクリーンショット結合ツール

このツールでできること

分割して撮った複数のスクリーンショットを、1枚のつながった画像にまとめるツールです。 問い合わせ対応でエラー画面を共有するとき、操作手順書を作るとき、長いページをスクロールしながら撮った画像をまとめたいときなどに使えます。

画像はサーバーに一切送信されません。 アップロードから結合、保存まですべてお使いのブラウザの中だけで処理されます。インストール・登録も不要です。

画面の見かた

開いた直後はこのような画面です。上に操作パネル、その下に画像リストと結合結果のプレビューが表示されます。

スクリーンショット結合ツールの初期画面。「+画像を追加」ボタン、縦に結合/横に結合の選択、揃え方の選択、間隔(px)の入力欄、すべて削除・結合して保存ボタンが並び、下に画像をドラッグ&ドロップできる枠がある。
  • + 画像を追加:結合したい画像を選びます(複数選択可)。下の枠に直接ドラッグ&ドロップしても追加できます。
  • 縦に結合/横に結合:画像を上下に並べるか、左右に並べるかを選びます。
  • 揃え方:幅(または高さ)が異なる画像を、どちらに寄せて並べるかを選びます。
  • 間隔(px):画像と画像の間に空けるすき間の大きさです。0でぴったりくっつきます。
  • すべて削除:追加した画像をすべて取り消します。
  • 結合して保存:結合した画像をPNGファイルとしてダウンロードします。

使い方

  1. 「+ 画像を追加」から結合したい画像をまとめて選びます(順番はあとから変更できます)。
  2. 画像を追加すると、一覧に並んで表示され、下のプレビューに結合結果がリアルタイムで反映されます。
  3. 「縦に結合/横に結合」「揃え方」「間隔」を必要に応じて調整します。
  4. 結果に問題なければ「結合して保存」でPNG画像として保存します。
幅の異なる3枚の画像(900×150、700×400、900×100)を縦に結合した状態。画像一覧にサムネイルと▲▼(並び替え)・×削除ボタンが並び、下のプレビューでは幅の狭い画像が中央揃えで表示されている。

📤 実際の結合結果はこうなります

縦結合の実際の出力結果。幅の異なる3枚の画像が中央揃えで縦に並んでいる。

並び順を変える・削除する

画像一覧の各行にあるボタンで、追加した画像を調整できます。

  • ▲/▼:その画像を1つ前・後ろへ移動します。
  • ✕ 削除:その画像だけを一覧から取り除きます。

操作するたびに、下のプレビューが自動で更新されます。

横に結合する

「横に結合」を選ぶと、画像が左から右へ順番に並びます。揃え方の選択肢も「上揃え/中央揃え/下揃え」に切り替わります。

横に結合を選んだ状態の操作パネルと画像一覧。揃え方の選択肢が上揃え・中央揃え・下揃えに変わっている。

📤 横結合の実際の結果

横結合の実際の出力結果。高さの異なる3枚の画像が中央揃えで横に並んでいる。

比較画像を並べて見せたいときや、複数の操作ステップを1枚の横長画像にまとめたいときに便利です。

こんな場面で便利です

  • スクロールしながら撮った複数の画面キャプチャを、1枚の長い画像にまとめたいとき
  • 問い合わせ・サポート対応で、手順ごとのスクリーンショットを1枚にまとめて送りたいとき
  • Before/Afterのように、2枚の画像を横に並べて比較したいとき
  • 操作マニュアルや資料に、複数の画面キャプチャを1枚にまとめて貼り付けたいとき

機密情報が写り込んだ画像を結合する場合は、先に 機密情報マスキングツール で該当箇所を隠してから結合すると安心です。

スクリーンショット結合ツール を開く