【縦型配信用】縦型 配信画面オーバーレイ 全8テーマ32画面|1080×1920・まもなく開始/配信中/休憩中/配信終了・わんコメ連動【OBS・商用可】
- Digital1,000 JPY






縦画面のライブ配信のために、最初から1080×1920で作った「配信画面」のセットです📱 「まもなく開始」「配信中」「休憩中」「配信終了」の4画面が、8とおりの配色でそろっています。全部で32画面です。 ■ 横型の素材を縦画面に置くと、文字が読めません 横1920×縦1080の素材を縦画面に置くと、OBSが横幅1080に合わせて縮めるため、文字が3分の1くらいの大きさになります。 このセットは最初から1080×1920で組んであるので、縮みません。 さらに、縦画面はスマホで見られます。スマホのライブ画面は下のほう3割くらいがコメント欄とボタンで隠れます。 そこで、文字は画面の上〜中央に寄せて、下は意図的に空けてあります。 ■ 4つの画面 ・まもなく開始 … 開始予定時刻までのカウントダウン ・配信中 … 配信タイトル・経過時間・SNS(真ん中は映像用に大きく空けてあります) ・休憩中 … 戻るまでのカウントダウン ・配信終了 … 今日の記録と次回の告知 ■ 全8テーマ✨ ・コバルト(濃紺×水色・夜の配信やゲーム配信に) ・エンバー(黒×朱色・熱のあるゲーム配信に) ・抹茶(深緑×若草・作業配信やのんびり枠に) ・グレープ(濃紫×藤色・歌枠や雑談に) ・サンド(生成り×こげ茶/明るい画面・朝配信やASMRに) ・フロスト(白×アイスブルー/明るい画面・清潔感を出したいときに) ・ローズ(ボルドー×桃色・かわいい系に) ・カーボン(黒×山吹・硬派な配信や企画枠に) ※明るい画面が2色入っています。暗い配色ばかりのセットが多いので用意しました。 ■ 書き換えるのは config.js だけ 配信者名・開始予定時刻・配信タイトル・休憩の長さ・SNS名などは、config.js を1回直すだけで 8テーマ32画面すべてに反映されます。テーマごとに直す必要はありません。 ■ わんコメ連動(任意の機能です) わんコメを起動していれば自動でつながります(設定不要・ポート11180)。 つながっていなくても画面はそのまま使えます。数字が0のままになるだけです。 ・まもなく開始/休憩中 … 「いま N人が待っています」 ・配信中 … 「コメント N件」+コメントが届くたびに画面のふちが光ります ・配信終了 … 「今日の記録」コメント数と参加した人数 数字はその日ぶんを数え、日付が変わると自動でリセットされます。 配信中に数えた数を、そのまま配信終了の画面に出せます。 Twitchをお使いの方は config.js にチャンネル名を入れると、わんコメ無しでも直接つながります (アカウント連携もAPIキーも要りません)。 ■ 導入(3ステップ・2分) 1. zipを展開して、フォルダごと好きな場所に置きます 2. config.js を開いて、配信者名・開始予定時刻・SNS名を書き換えます 3. OBSで「ソース」→「+」→「ブラウザ」を追加し、「ローカルファイル」にチェックを入れて 使いたい html を選びます(幅1080・高さ1920) 例:まもなく開始の画面 → 01-cobalt/starting.html ■ わんコメの対応配信サイトについて(正直に書きます) YouTube / Twitch / ツイキャス / SHOWROOM / bilibili / ミクチャ / ニコ生 / Kick / ふわっち などに対応しています。 ※ TikTok LIVE はわんコメが対応していません。TikTok LIVEでも画面はそのまま使えますが、 コメント連動の数字だけは動きません(TikFinity や Streamer.bot など別のツールを経由すれば取り込めます)。 ■ 動作確認 わんコメ 5.x / OBS 30.x(Windows・macOS)。 実際にわんコメへコメントを流して、数字が増えることを配布zipの状態で確認しています。 画像ファイルは使っておらず、すべてHTML/CSS/JSで描いています。 外部サーバーへの通信もわんコメ/Twitch以外にありません。 ■ ライセンス 個人・法人を問わず配信での使用は自由です(商用可)。改変も自由です。 ファイルそのものの再配布・販売はご遠慮ください。 ■ うまく動かないとき OBSのブラウザソースが真っ白になるときの確認手順をまとめています。 https://panda-hq-7af784ab.pages.dev/guide/standalone-widget-not-showing ■ 更新履歴 v1.0(2026-09-02)初版。8テーマ×4画面=32画面。わんコメ/Twitch連動つき。 同じ縦型シリーズもあります(縦型コメント欄テーマ/縦型インフォメーションバー/縦型配信の目標達成ゲージ/縦型配信のアラート)。 ほかの商品はこちら https://panda-kaihatsu.booth.pm/





