パース下書きグリッド画像ジェネレーター｜1〜3 点透視を PNG で出力

1 点・2 点・3 点透視それぞれの放射状ガイド線を SVG で生成し、16:9 / 4:3 / 1:1 / A4 横長 / A4 縦長の 5 プリセットに対応する PNG として書き出すツールです。グリッドの密度 (10〜100)、消失点の距離 (0.5x〜3.0x)、線色 (HEX) をスライダーとカラーピッカーから調整できます。

サーバーへのアップロードは一切行わず、ブラウザ内で SVG → PNG 変換まで完結します。出力 PNG はそのまま漫画原稿の下敷きにしたり、Clip Studio Paint や Photoshop の最下層レイヤーに敷いてアタリ線として使ったりできます。

💡 こんな場面で使えます

• 漫画・コミックの背景下書き: 街並みコマや建築物の見開きで、1 点・2 点透視の補助線を最初に置く。線色を薄いシアン (#00F0FF) にすれば、ペン入れ後に消去せずアタリのまま残せます。
• イラストの空間設計: 3 点透視を選んで、見上げ / 見下ろし構図の補助線を引いてから人物配置を決める。アスペクト比を 1:1 にすれば SNS 投稿用キャンバスにそのまま使えます。
• デジタル作画の最下層ガイド: A4 横長 (1414 × 1000) または A4 縦長 (1000 × 1414) で出力した PNG を Clip Studio Paint や Procreate の最下層に敷き、その上のレイヤーで本描きする。
• 紙の下書き用印刷物: A4 プリセットを 300 dpi 相当で印刷し、ライトボックスやトレース台越しに下敷きとして使う。
• パース学習・授業教材: 1 点 → 2 点 → 3 点の順で消失点の距離を変えながら、どこに点を置くと画面がどう歪むかを視覚的に確認する。

🧐 なぜ独立した PNG 出力ツールが必要か

Clip Studio Paint・Procreate・Krita などのプロ向けアプリにはパース定規が内蔵されていますが、課題は 3 つあります。1 つ目は 無料・モバイル系アプリ (ibisPaint Paint 無料版 / MediBang Paint 無料版 / MediBang Paint for iPad) のパース機能が限定的 なこと。2 つ目は 紙の作画やライトボックス用途では PNG 画像のほうが扱いやすい こと。3 つ目は 学習目的では消失点をスライダーで動かして変化を見たい ことです。

本ツールは「パース定規を持っていない / そのアプリに無い人」「紙の下敷きにしたい人」「学習で点の位置を試したい人」の 3 層をブラウザだけで満たすことを目的にしています。生成済みの PNG を一旦保存しておけば、レイヤー対応のアプリに読み込んで何度でも再利用できます。

📚 1 点 / 2 点 / 3 点透視の使い分け

1 点透視 は消失点が画面中央付近 1 つ。廊下・道路・室内など「奥行きを真正面から見る」構図に向きます。本ツールでは消失点距離スライダーは効かず、放射状の補助線と水平・垂直のグリッドが同時に出ます。

2 点透視 は左右に 1 つずつの消失点 (合計 2 点) を持ち、建物の角を斜めから見る・街並みコマ・部屋を斜めから見るような構図で使います。本ツールの消失点距離スライダー 1.5x は「画像の幅 × 1.5 だけ左右に消失点を伸ばす」設定で、数値を上げると遠方の建物のように歪みが弱くなり、下げると魚眼レンズのような誇張表現になります。

3 点透視 は左右の消失点に加えて、画面下方 (またはユーザー視点から見て下) に 3 つ目の消失点を置きます。高層ビルを見上げる / ドローン視点で見下ろす構図で活躍します。本ツールでは 3 つ目の消失点は画面下に固定されますが、距離スライダーで「どれだけ垂直方向の歪みを強くするか」を調整できます。

線色は無彩色 (グレー) か淡いシアン (#00F0FF) のような彩度高めの色を選ぶと、後で本描き線と区別しやすくなります。漫画の場合は彩度低めの水色やライラックがアタリ用途で扱いやすい色です。