ローカルで作るキャプション積層コラージュ

引用コラージュ

ブラウザで写真を引用コラージュに。フォントや色、サイズを指定したキャプションを重ね、ブロックの間隔を調整して PNG として書き出せます。

1 枚の写真を縦長の引用コラージュに

リッチテキストエディターでキャプションを書き、写真の上に重ねます。2 行ごとに 1 つのブロックになり、ブロックごとに写真のコピーが下へ積み重なるため、文章が長いほど縦長のコラージュになります。仕上がりはブラウザ内で合成され PNG として保存され、アップロードは不要です。

引用画像の作り方

  1. 1.写真をドロップするか、ファイルを選ぶか、サンプル画像を開きます。
  2. 2.キャプションを入力します。Enter で改行し、2 行ごとに 1 つのブロックになります。
  3. 3.文字を選択し、ツールバーで太字・斜体・下線・文字色・背景色・フォント・文字サイズを設定します。
  4. 4.「キャプションの間隔」スライダーで、各ブロックを前のブロックよりどれだけ下に置くかを決めます。
  5. 5.1× / 1.5× / 2× の画質を選び、完成したコラージュを PNG で保存します。

対応している機能

太字・斜体・下線・取り消し線・文字色・背景色・フォント・10 段階の文字サイズに対応しています。

キャプションは 2 行ごとに 1 つのブロックになり、ブロックごとに写真がもう 1 枚重なって定番の引用コラージュになります。

間隔は写真自身のピクセルで指定し、30 px から写真の高さまで選べます。同じ値ならウィンドウ幅に関係なく同じコラージュが出力されます。

画質は元画像の幅に対する倍率です。1× は写真自身のピクセル、1.5× / 2× はより大きく描画します。コラージュ全体がまとめて拡大されるので、写真の縦横比は保たれます。

スタイル用フォントは必要なときだけ読み込み、日本語などの CJK テキストには端末に入っているシステムフォントを使います。

写真のデコード・合成・書き出しはすべてブラウザ内で行い、アップロード先はありません。

引用コラージュの FAQ

写真はどこかにアップロードされますか?

いいえ。画像はローカルで読み込まれ、ページ内で合成され、お使いのブラウザが書き出します。アップロードの工程も、共有リンクの生成もありません。

入力するほど画像が縦長になるのはなぜ?

2 つの段落で 1 つのブロックになります。各ブロックは写真のコピーをもう 1 枚描画し、間隔の値だけ前のブロックから下にずれるため、行が増えるほどコラージュが下に伸びます。

「キャプションの間隔」スライダーは何を変えますか?

重なった写真同士の距離を、写真自身のピクセル単位(30 px 〜 写真の高さ)で決めます。値が小さいほど密に重なり、同じ値ならウィンドウ幅に関係なく同じコラージュが出力されます。

1× / 1.5× / 2× の画質はどういう仕組みですか?

画質は固定のキャンバスサイズではなく、元画像の幅に対する倍率です。1× は写真自身のピクセル、1.5× は 1.5 倍の幅、2× は 2 倍の幅になります。高さは写真の比率とブロック数で決まり、縦長・巨大すぎるコラージュはブラウザのキャンバス上限に収まるよう自動で縮小されます。

自分のフォントは使えますか?

フォント一覧には一般的なシステムフォントや定番の Web フォント、Microsoft YaHei・SimSun・SimHei・KaiTi・FangSong などの CJK システムフォントが含まれます。フォントはインラインスタイルとして適用されるため、ダウンロード結果はプレビューと一致します。

読み込める形式と出力形式は?

ブラウザがデコードできる画像(PNG、JPEG、WebP、AVIF、GIF など)を最大 10 MB まで読み込めます。出力は常に白背景の PNG です。