【無料】YouTubeライブ「リアクション噴水」画像差し替えCSSツール【OBS用】
- Digital0 JPY
こちらは無料で使用できます！ 気に入っていただけたらXフォローや共有していただけると励みになります！
【OBS用】YouTubeライブ「リアクション噴水」画像差し替えCSSツール
YouTube Live のリアクション噴水（❤ / 😄 / 😳 / 🎉 / 💯）を、 自分の画像で差し替え・重ね表示できるCSSを、かんたんに作成できるツールです。 同梱HTMLで画像を選ぶだけでCSSを生成できます。 生成したCSSの使い方もわかりやすく書いています。
【こんな方におすすめ】
・OBSで配信演出を少しだけ強化したい ・コードは苦手だけど見た目をカスタムしたい ・リアクション噴水を自分の配信デザインに合わせたい
【同梱ファイル】
・01_これを開いてCSSを作成.html 画像を選んでCSSを作る本体 ・02_使い方と補足ガイド.txt 導入手順とつまずきポイント
【できること】
・リアクションごとに画像を設定（❤ 😄 😳 🎉 💯） ・画像の重ね表示（元リアクションを残す/消す切替） ・GIF画像の使用 ・CSSをコピー / .css保存 / .txt保存
【使い方（詳細は付属テキストにあります）】
1. zipファイルを解凍する 2. 01_これを開いてCSSを作成.html を開く 3. 各リアクションに画像を入れる 4. CSSを生成 を押す 5. 生成したCSSをコピー 6. OBSのブラウザソース > YouTubeチャットのカスタムCSSに貼る
【OBS導入（詳細は付属テキストにあります）】
・YouTube Liveの「チャットをポップアウト」URLをブラウザソースに設定 ・生成CSSをカスタムCSS欄へ貼り付け ・幅/高さは目安として 500 x 1000 から調整 ・後から変更する場合は、ソースを右クリック > プロパティ
【注意事項】
・YouTube / OBS 側の仕様変更で動作が変わる可能性があります ・YouTube / OBS 側の仕様変更で動かなくなった場合は、連絡いただければ修正対応します ・画像サイズを大きくしすぎると、重くなる・表示が不安定になる場合があります ・生成CSSには画像データ（Data URI）が含まれます 生成CSSを共有すると、画像データも共有されます
【利用規約（要約）】
・本ツールの利用は自己責任です ・YouTube / OBS / 各プラットフォームの利用規約を守ってご利用ください ・修正対応は可能な範囲で行いますが、将来にわたる継続対応を保証するものではありません ・作者の状況（体調・業務・私生活など）により、対応が遅れる場合や対応できない場合があります ・本ツール本体の再配布・再販売は禁止（作者許可がある場合を除く） ・利用による損害について作者は責任を負いません ・いろいろ書きましたがまあ適当でOKです
【アップデート履歴】
・2026-02-21 v1.0.0 初版公開
【作者 / 連絡先】
・作者: Wis ・連絡先: X（旧Twitter）@wis_engi のDM / リプ / マシュマロ ・要望/不具合報告/ツール/ソフト/ゲーム制作のご相談もお気軽にどうぞ