🖼️
image collage,
画像コラージュメーカー
複数画像をグリッドで1枚に結合。
🖼️
テンプレート豊富
グリッド&フリー配置
📸
複数画像対応
最大9枚まで結合
🔒
サーバー送信なし
ブラウザ完結で安全
画像を選択してください
🔒
画像はサーバーに送信されません。すべてブラウザ内で処理されます。
about,
概要
複数の画像をグリッドレイアウトで1枚にまとめるブラウザ完結型コラージュメーカー。SNS投稿やフォトブック用に最適。テンプレートを選んで画像を配置するだけの簡単操作。
背景色・間隔・角丸も自由にカスタマイズ可能。Canvas APIのみで動作し、画像はサーバーに一切送信されません。
how to,
使い方
STEP 1
画像を選択
コラージュに使いたい画像を複数選択します
STEP 2
テンプレートを選択
2枚〜9枚のグリッドテンプレートから選びます。画像の並び順はドラッグで変更できます
STEP 3
保存
背景色や間隔を調整し、PNG/JPEGで保存します
glossary,
用語集
- コラージュ
- 複数の画像を1枚の画像にまとめる手法です。写真を組み合わせることでビジュアル的な物語を作ることができ、SNS投稿やフォトブックなどに広く使われています。
- グリッドレイアウト
- 格子状に画像を配置するデザイン手法です。均等なセルに画像をはめ込むことで、整列感と視覚的バランスが生まれます。2×2や3×3などのパターンが一般的です。
- テンプレート
- あらかじめ用意されたレイアウトの型です。本ツールでは2枚〜9枚の6種類のテンプレートを提供しており、画像枚数や目的に合わせて選択できます。
- カバーフィット
- 画像をセル全体に隙間なく表示する配置方法です。画像とセルのアスペクト比を比較し、短辺を基準に拡大・クロップすることで、余白なく美しく表示します。はみ出した部分は自動でトリミングされます。
- アスペクト比
- 画像の横幅と縦幅の比率です。例えば16:9は横長、1:1は正方形、4:3は一般的な写真サイズです。本ツールではセルのアスペクト比に合わせてカバーフィット描画を行います。
- 背景色
- 画像の間や余白部分に表示される色です。デフォルトは白ですが、カラーピッカーで任意の色に変更できます。黒にするとスタイリッシュな印象になります。
- 間隔(Gap)
- 画像と画像の間の余白サイズです。0にすると隙間なしで画像が密接し、大きくするほど各画像の間に広い余白が生まれます。背景色と組み合わせることでデザイン性が高まります。
- 角丸(Border Radius)
- 画像セルの角を丸くする装飾です。CSSのborder-radiusと同様の概念で、Canvas APIのroundRect()を使って実装しています。0で直角、値を大きくするほど丸みが増します。
- PNG形式
- 透過対応の可逆圧縮画像フォーマットです。画質が劣化しないためロゴやイラストに最適ですが、写真などは容量が大きくなる場合があります。背景色を透明にしたい場合はPNGを選択してください。
- JPEG形式
- 写真向けの非可逆圧縮画像フォーマットです。品質を調整することでファイルサイズを大幅に削減できます。SNSへの投稿や印刷用途にはJPEGが適しています。
faq,
FAQ
- Q.最大何枚まで使えますか?
- 9枚までのテンプレートを用意しています。9枚グリッド(3×3)が最大で、それぞれのテンプレートに合わせて画像を選択してください。
- Q.画像の順番を変えられますか?
- 画像一覧でドラッグ&ドロップにより並べ替えが可能です。並び順はリアルタイムでキャンバスプレビューに反映されます。
- Q.画像がサーバーに送信されますか?
- 一切ありません。Canvas APIを使ってブラウザ内だけで処理しており、画像データが外部に出ることはありません。
- Q.出力サイズを変更できますか?
- 幅と高さをピクセル単位で自由に指定できます。最大4096×4096pxまで設定可能です。
- Q.背景色を変えられますか?
- カラーピッカーで自由に設定できます。デフォルトは白(#ffffff)です。
- Q.画像がセルに収まらない場合は?
- カバーフィットで自動的にトリミング・拡大されます。画像の中央部分が優先して表示されます。
- Q.画像を個別に差し替えられますか?
- 各画像の差替えボタンで個別に変更できます。他の画像の配置はそのまま維持されます。
- Q.スマートフォンでも使えますか?
- レスポンシブ対応でタッチ操作にも対応しています。iOS Safari・Android Chromeで動作確認済みです。
- Q.画像同士の間隔を調整できますか?
- スライダーで0〜40pxの範囲で調整できます。0にすると隙間なし、値を大きくするほど余白が広がります。
- Q.角丸にできますか?
- 各セルの角丸をスライダーで0〜30pxまで調整できます。0で直角、30で大きく丸みがつきます。
use cases,
活用シーン
📱
SNS投稿
Instagram・Xのフィードに複数写真をまとめた1枚画像を投稿
📷
旅行の思い出まとめ
旅先の写真をグリッドにまとめてシェア
🛍️
EC商品画像
複数アングルの商品写真を1枚にまとめて商品ページに掲載
🎨
ポートフォリオ
作品を一覧で見せるコラージュ画像を作成
フィードバックを送信
ツールをより良くするためのご意見をお聞かせください。
フィードバックを送信しました。ご協力ありがとうございます!
エラーが発生しました。しばらく経ってから再度お試しください。
現在、フィードバックの受付を一時停止しています
サーバーが混み合っているか、スパム防止のための安全装置が作動しています。しばらく経ってから再度アクセスしてください。