Overlay Frame Generator

このツールは、OBSなどの配信ソフトで利用できる「動的HTMLオーバーレイ」を生成するツールです。プレビューを見ながら各種設定を行い、最終的に1つのHTMLファイルとして書き出します。

1. 上部のタブ（基本設定、枠＆チャンネル名...）を切り替えて、ご希望のデザインやテキストを設定してください。
2. 上のプレビュー画面でリアルタイムに結果を確認できます（背景を透過格子やゲーム画面に切り替えて確認可能です）。
3. 設定が完了したら、画面右上の 「OBS用HTMLを出力する」 ボタンを押してファイルをダウンロードします。

1. OBSを起動し、追加したいシーンの「ソース」エリアの左下にある 「＋」ボタン をクリックします。
2. メニューから 「ブラウザ」 を選択し、適当な名前（例: オーバーレイ枠）をつけて「OK」を押します。
3. プロパティ画面が開いたら、以下の通り設定します：
   • ローカルファイル: チェックを入れる
   • 参照: 「参照」ボタンを押し、先ほどダウンロードしたHTMLファイルを選択する
   • 幅: ジェネレーターの「基本設定」で指定した幅（例: 1920）を入力する
   • 高さ: ジェネレーターの「基本設定」で指定した高さ（例: 1080）を入力する
   • カスタムCSS: 最初から入っているテキストを すべて削除して完全に空にする（※とても重要です）
4. 「OK」を押すと、配信画面全体にオーバーレイが表示されます。