【配信】カレンダー 第2弾 12デザイン｜配信予定日に印と名前を付けられる｜今日だけ/今週/今月を切替・来月も出せる・背景透過・OBS用・設定ボタン(⚙)つき

配信画面に日付を出すためのカレンダーの第2弾です。「今日だけ」「今週」「今月」の3通りを1枚のHTMLの中で切り替えられます。同じ機能のまま、見た目だけ違うものを12デザインそろえました。題材は第1弾の12種と1つも重ねていません。

PCの時計を見ているので、日付は自動で変わります。つけっぱなしにしていても、日が変われば勝手に進みます。

第2弾で増えたのは2つです。ひとつは、印を付けた日に名前を書けること（9/20:生放送 のように書くと、マスの下に小さく出ます）。もうひとつは、来月を出せること。月末に「来月の予定はこちら」と見せるのに使えます。

動画ファイルではありません。その場で描いているので、容量はごくわずかです。文字も枠もHTMLなので、どんな大きさでもにじみません。

単一HTML・インストール不要・アカウント不要・オフライン動作。OBSのブラウザソースに入れるだけ。背景は初期状態で透過です。日本語／English 切替対応。

━━━━━━━━━━━━━━━━━━

◆ できること

━━━━━━━━━━━━━━━━━━

・「今日だけ」「今週」「今月」の3通りを切り替えられる

・配信予定日などに丸い印を付けられる

・印に名前を書ける（9/20:生放送）。マスの下に小さく出る

・来月・再来月・先月を出せる（「今週」の表示では週がずれます）

・土曜・日曜に色を付けられる

・週の始まりを日曜／月曜で選べる

・日付の書きかたを6通りから選べる（8 / 31・8.31・2026-08-31・31 AUG・8月31日・八月三十一日）

━━━━━━━━━━━━━━━━━━

◆ 収録している12デザイン

━━━━━━━━━━━━━━━━━━

・woodblock.html … 木の万年カレンダー（木目の台に、数字を彫った木片）

・advent.html … 小窓のカレンダー（マスが扉。今日の扉だけ開く）

・fridge.html … 冷蔵庫のマグネット（金属の扉に数字のマグネット）

・datestamp.html … 日付印（丸いゴム印を押した跡。今日には朱の丸が重なる）

・filmstrip.html … フィルムのコマ（上下にパーフォレーション）

・postcard.html … ポストカード（切手と消印、宛名の罫線）

・eink.html … 電子ペーパー（低いコントラストと細い枠）

・tag.html … 荷札（上が尖った札。紐を通す穴つき）

・enamel.html … ホーローの看板（濃い面に白い縁とビス）

・sketch.html … スケッチブック（リング綴じと手描きの枠）

・stone.html … 石に彫った暦（文字が沈んで見える）

・cardboard.html … ダンボールの刷り（段の線とステンシルの字）

配色はデザインごとに3色。⚙から切り替えるだけで、文字も板も差し色も一緒に変わります。

━━━━━━━━━━━━━━━━━━

◆ 印の書きかた

━━━━━━━━━━━━━━━━━━

⚙の「印を付ける日」に、コンマで区切って書きます。

　9/20:生放送,9/28:記念日,10/1

「:」のうしろが名前です。名前を書かなければ丸い印だけが付きます。年を書かなければ（9/20）毎年その日に、年を書けば（2026-09-20）その年だけに付きます。名前はマスの幅で切れるので、3〜5文字くらいが読みやすいです。

━━━━━━━━━━━━━━━━━━

◆ 設定ボタン（⚙）

━━━━━━━━━━━━━━━━━━

OBSでソースを右クリック →「対話」→ 画面にマウスを乗せると右上に ⚙ が出ます。出しかたも色も印も、そこから変えて「保存して閉じる」だけです。普段 ⚙ は見えないので配信画面には映りません。歯車が見つからないときは、対話ウィンドウ内で S キーでも開きます。設定はOBSを再起動しても残り、「設定を初期化」でいつでも元に戻せます。

位置合わせのときは「確認用の下地を敷く」を入れると、透過している範囲が市松模様で見えます。使うときは切ってください。

━━━━━━━━━━━━━━━━━━

◆ ご注意

━━━━━━━━━━━━━━━━━━

・効果音はありません（表示のみです）

・日付の判定はPCの時計を見ています。PCの時計がずれていると同じだけずれます

・祝日は入っていません（国や年で変わるため）。印は自分で付けてください

・予定の «内容» を並べる表ではありません。日付に短い名前を添えるところまでです

・カレンダーアプリや配信サイトからの取り込みはできません

・視聴者コメントの集計や、外部アプリ・APIとの連携はありません

━━━━━━━━━━━━━━━━━━

◆ 動作環境

━━━━━━━━━━━━━━━━━━

OBSのブラウザソース（Chromium）で使うために作っています。こちらでの動作確認は Chrome / Edge で行いました。Streamlabs など、ブラウザソースがある配信ソフトでも同じ形で読み込めます。ネット接続は不要で、外部へは一切通信しません（Webフォントも広告も入っていません）。書体はお使いのPCに入っているものを使います。

━━━━━━━━━━━━━━━━━━

◆ 同梱

━━━━━━━━━━━━━━━━━━

HTML 12本 ／ はじめにお読みください.txt ／ READ ME FIRST (English).txt ／ 利用規約.txt ／ Terms of Use (English).txt