シルギア

画像の結合(連結)の使い方|スクショや写真を縦・横に1枚へまとめる

公開日:2026年8月11日 対象ツール:画像の連結(縦・横に結合)

スマホのスクリーンショットを何枚も撮ったけれど、SNSやチャットに1枚ずつ貼るとバラバラで見づらい。そんなときに便利なのが画像の連結です。画像の連結(縦・横に結合)は、複数の画像を縦または横につなげて1枚の画像にまとめられる無料ツールです。すき間・背景色・サイズの揃え方まで指定でき、処理はすべてブラウザ内(Canvas)で完結するため、選んだ画像がサーバーに送信されることはありません。

こんな場面で役立ちます

  • スクショを縦に連結してSNSやチャットへ:縦長のスクリーンショットを上から順につないで、1枚の長い画像として投稿できます。
  • ビフォーアフターを横並びで比較:加工前後や施工前後の写真を左右に並べ、違いをひと目で見せられます。
  • 商品写真をまとめて一覧画像に:複数カットを1枚にまとめれば、フリマ出品やカタログ用の画像づくりが楽になります。
  • 長い会話のつなぎ目をなくす:分割して撮ったトーク画面のスクショを縦につなぎ、途切れずに読める1枚にできます。

縦連結と横連結の使い分け

連結方向は「縦(上から下へ)」と「横(左から右へ)」の2通りです。縦連結は、縦長のスクリーンショットや手順の流れを上から順に見せたいとき、Before/Afterを上下に並べたいときに向いています。スマホの画面はもともと縦長なので、スクショ同士は縦につなぐと自然にまとまります。横連結は、複数のカットを横一列に並べて比較したいときや、パノラマ風に横へ広げて見せたいときに便利です。読み込んだ画像は一覧の並び順どおりに連結されるので、作りたい見せ方に合わせて方向と順番を決めてください。

サイズがバラバラの画像を並べるときの注意

幅も高さも違う画像をそのままつなぐと、端に段差が出て不格好になります。このツールでは、縦連結なら各画像のを、横連結なら各画像の高さを、最小・最大・指定値のいずれかにそろえてから連結します。そろえる際は縦横比を保ったまま拡大・縮小するので画像がゆがむことはありません。基準を「最大」にすると小さい画像が引き伸ばされて粗くなることがあるため、粗さが気になるときは「最小」を選ぶのがおすすめです。

そろえた結果できる余白や、画像と画像の間のすき間(px)には背景色が入ります。背景色は白・黒・透過・カスタム(HEX)から選べ、カスタムなら #f5f5f5 のような値で好きな色を指定できます。すき間を0にすると画像同士がぴったり密着し、値を大きくするほど間隔があきます。透過を選ぶと余白部分が透明になり他の背景に重ねやすくなりますが、透過に対応しない JPEG では透過部分が白などで塗りつぶされるため、透明を残したいときは PNG か WebP で書き出してください。

使い方

  1. 「画像ファイルを選択(複数可)」から2枚以上の画像を選ぶか、点線の枠内にまとめてドラッグ&ドロップします。読み込むと一覧にサムネイルと順番が表示されます。
  2. 一覧の「↑」「↓」で並び順を入れ替え、不要な画像は「削除」で外します。並んだ順に上から(縦)/左から(横)連結されます。
  3. 連結方向(縦/横)を選び、サイズの揃え方(最小/最大/指定)・すき間(px)・背景色(白/黒/透過/カスタムHEX)を設定します。
  4. 出力形式(PNG/JPEG/WebP)を選びます。JPEG・WebP のときは品質スライダーで画質とファイルサイズのバランスを調整できます。
  5. 「この設定で連結する」を押すと連結後の寸法・ファイルサイズ・プレビューが表示され、「ダウンロード」で1枚の画像として保存できます(ファイル名は combined)。

よくある質問

縦と横のどちらで連結すればいいですか

見せ方で選びます。縦連結は縦長のスクリーンショットや手順の流れ、Before/Afterを上下に並べたいときに、横連結は複数のカットを横一列で比較したいときや横に広く見せたいときに向きます。読み込んだ画像は一覧の並び順どおりに連結されるので、↑↓ボタンで順番を整えてから連結してください。

サイズがバラバラの画像でもきれいにそろいますか

はい。縦連結なら各画像の幅を、横連結なら各画像の高さを、最小・最大・指定値のいずれかに自動でそろえてから連結します。そろえる際は縦横比を保つのでゆがみません。「最大」にすると小さい画像が引き伸ばされて粗くなることがあるため、粗さが気になるときは「最小」を選ぶとよいでしょう。

背景を透明にしたり、間に色を付けたりできますか

できます。すき間(px)を指定すると画像の間に余白があき、その余白の色を背景色(白/黒/透過/カスタムHEX)で選べます。「透過」を選ぶと余白が透明になりますが、JPEG で書き出すと透過部分は塗りつぶされるため、透明を残したい場合は PNG または WebP を選んでください。

選んだ画像はどこかにアップロードされますか

いいえ。読み込み・連結・書き出しはすべてお使いのブラウザ内(Canvas)で行われ、画像データがサーバーへ送信されることはありません。オフラインでも動作するので、プライバシーが気になる写真や社内資料のスクリーンショットでも安心して使えます。もちろん無料で、枚数の制限もありません。

スクショの整理から比較画像、商品写真のまとめまで、画像を1枚につなぐ作業はこれひとつで完結します。すべてブラウザ内で処理され画像は外部に送られないので、まずは手元の数枚で縦・横の連結を試してみてください。

「画像の連結(縦・横に結合)」を使ってみる →

ほかの記事

インスタやXで使えるおしゃれ文字の作り方|特殊文字をコピペで無料変換 文章を音声で読み上げる方法|無料・アプリ不要でブラウザ完結(非送信) 画像をPDFにまとめる方法|複数の写真を1つのPDFにブラウザで無料変換 PDFを結合・分割・回転する方法|アプリ不要・ブラウザで無料・非送信 画像を丸く切り抜く方法|SNSアイコンを透過PNGでブラウザ作成 バーコードの作り方|JAN・EAN-13やCode128をブラウザで無料生成

記事一覧をすべて見る →