エンタメ・趣味

4コマ漫画メーカー (画像フィルタ + 吹き出し配置)

静止JPEG・PNG・WebPを重ねて4コマ漫画を作るブラウザ内エディタ。4種の画像フィルタ、線・色・尻尾を調整できる10種の吹き出し、台詞・単独テキストの欠け防止、レイヤー管理、スマホ編集、1440×4760px PNG書き出しに対応。

登録不要
0/40

キャンバスを読み込み中...

書き出しサイズ: 1440 × 4760 px (表示: 40%)

4コマ漫画メーカー (画像フィルタ + 吹き出し配置)について

4コマ漫画メーカーとは

このツールは、手元の写真やイラストを使って4コマ漫画を作成できる完全ブラウザ完結のエディタです。専用ソフトをインストールせず、スマホで撮った写真やフリー素材をドラッグ&ドロップで配置し、フィルタで漫画らしい絵柄に変換、吹き出しでセリフを加えて、PNG として保存できます。

選択した画像本体はNanTooの画像処理サーバーへ送信せず、ブラウザ内で処理します。サイト共通のアクセス計測や広告配信は、画像編集処理とは別に行われます。Konva.js (MIT ライセンス) をキャンバス基盤に採用し、レイヤー管理・変形ハンドル・エクスポートまでブラウザ内で完結します。

入力上限: 静止画のJPEG・PNG・WebP、1件20.0 MB・一辺16,384px、合計12枚・60.0 MB・40MPまで。アニメーション画像は静止画として平坦化せず、入力時に拒否します。

文字数上限: タイトル40文字、吹き出し1件200文字、単独テキスト1件100文字です。絵文字や結合文字は画面上の1文字単位で数え、上限位置や自動改行位置で分断しません。長いタイトルは実際の表示幅に合わせて48pxから12pxまで自動調整します。それでもタイトル領域へ収まらない場合や、吹き出しの台詞、縁取りを含む単独テキストが現在の大きさで収まらない場合は編集欄で警告し、文字が欠けたPNGを誤って保存しないよう書き出しを停止します。

レイヤー上限: 画像・吹き出し・単独テキストを合わせて1コマ40件までです。

画像フィルタ — 4種類

フィルタ アルゴリズム 用途
カラー元画像そのままカラー4コマ
グレースケールBT.601 輝度変換 Y = 0.299R + 0.587G + 0.114Bモノクロ雑誌風
白黒 (二値化)グレースケール + 閾値二値化 (0-255 調整可)ハイコントラスト漫画
線画Difference of Gaussians (DoG) によるエッジ抽出手描き風イラスト化

線画フィルタは小さいぼかしと大きいぼかしの差分を取る古典的手法で、写真からおおよその輪郭線を抽出します。背景がシンプルな写真ほど綺麗に線画化できます。フィルタ処理は固定PNGの出力幅と同じ最大辺1440pxで行います。

吹き出し — 10種プリセット

  • ふつう (楕円): 通常のセリフ
  • 叫び (トゲ): 怒り・驚き・大声
  • ささやき (点線): 小声・内緒話
  • ナレーション (四角): 状況説明・場面転換
  • 爆発: 衝撃・強調
  • : 柔らかいセリフ
  • 四角: シャープな説明枠
  • 思考: 心の声・モノローグ
  • 電子音: 機械・端末のセリフ
  • フラッシュ: 放射状の強調

尻尾 ▽ の方向は 0〜359° の角度と長さで自由に調整できます。ふつう・ささやき・電子音では付け根幅も変更できます。話者の位置に向けて尻尾を延ばすことで、誰のセリフか一目瞭然になります。線の太さ・線色・塗り色・文字色・太字を調整でき、塗りあり / 透過も切り替えられます。

使い方の流れ

  1. 上部にタイトルを入力
  2. 左サイドバーから編集するコマを 1〜4 で選択
  3. 「画像を追加」またはドラッグ&ドロップで画像を1回1枚ずつ読み込み
  4. フィルタ (カラー / グレー / 白黒 / 線画) を選ぶ
  5. 画像をドラッグまたは横位置・縦位置スライダーで配置し、拡大率・回転を調整
  6. 吹き出しを追加し、テキスト・位置・大きさ・回転・尻尾・線・塗り・文字色を調整
  7. PNG 書き出しボタンで 1440 × 4760 px のPNGをダウンロード

全画面モードと画面サイズ対応

  • ワイド画面 (1280px〜): 左サイドバー・中央キャンバス・レイヤー一覧を横並びで表示
  • 全画面モード: 右上のボタンで切替、画面全体をキャンバスに使える
  • タブレット・スマホ: 編集欄、キャンバス、レイヤー一覧を縦に並べ、画像追加・吹き出し・テキスト・レイヤー編集・PNG書き出しを利用可能

技術的な仕組み

本ツールは以下の Web 標準技術のみで構築されています:

  • Canvas 2D API: 画像のピクセル操作 (フィルタ処理)
  • Konva.js + react-konva: レイヤー・変形ハンドル・ドラッグ&ドロップの高レベル API
  • Blob URL / Image API: 選択画像をブラウザ内で読み込み
  • SVG Path: 吹き出しシェイプの数式記述 (解像度非依存)

画像の読み込み、フィルタ、レイヤー合成、PNG生成はクライアント側で行い、選択画像本体をNanTooの画像処理サーバーへ送信しません。

よくある質問

Q. 画像はアップロードサーバーに保存されますか?
選択した画像本体はNanTooの画像処理サーバーへ送信・保存せず、ブラウザ内で処理します。サイト共通のアクセス計測や広告配信は画像編集処理とは別に行われます。書き出したPNGは端末へ保存されます。
Q. 商用利用や SNS 投稿に使って大丈夫?
本ツール自体は作成物の商用利用・SNS投稿を制限しません。ただし、元画像・フォント・素材の著作権、ライセンス、肖像権、投稿先の規約は利用者が個別に確認してください。素材サイトの利用条件はサービスや素材ごとに異なります。
Q. 線画変換の精度がいまいちです
線画変換は写真の内容に大きく依存します。<strong>背景がシンプル</strong>・<strong>被写体の輪郭がはっきり</strong>している写真ほど綺麗に線画化できます。逆に複雑な背景、低コントラスト、暗い写真ではノイズが多く出ます。事前に他の画像編集ツールで明度・コントラストを調整するか、被写体を切り抜いてから読み込むと精度が上がります。
Q. 吹き出しの尻尾が思い通りの位置に来ません
尻尾の方向は<strong>吹き出し中心からの角度</strong>(0°=右、90°=下、180°=左、270°=上)で指定します。例えば話者が吹き出しの左下にいる場合は<strong>135°付近</strong>、右下なら<strong>45°付近</strong>です。尻尾の長さも別スライダーで調整でき、ふつう・ささやき・電子音では付け根幅も変更できます。
Q. 出力されるPNGのサイズは?
1440 × 4760ピクセルのPNGとして出力します。編集キャンバス720 × 2380ピクセルを2倍で書き出します。投稿先や印刷方法ごとの容量・縦横比・解像度条件は別途確認してください。
Q. 1コマに複数画像を重ねられますか?
はい。1コマへ複数画像を追加し、レイヤー一覧で画像・吹き出し・テキストをまとめて前後移動できます。入力全体は静止画のJPEG・PNG・WebP、1件20.0 MB・一辺16,384px、合計12枚・60.0 MB・40MPまでです。
Q. 途中保存はできますか?
現バージョンでは編集状態の保存機能はなく、ページを閉じると内容が消えます。作業が長引く場合は確認用として途中でPNGを書き出せますが、そのPNGから画像・吹き出し・テキストのレイヤー編集状態を復元することはできません。
このツールを評価
3.7(3件)