透明なレンズの中で、時刻が静かに呼吸する。 Liquid Lens Clock は、OBS / Streamlabs のブラウザソースで使える配信用アニメーション時計ウィジェットです。 ただのデジタル時計ではなく、透明なレンズ状の本体「Liquid Lens」と、右外縁に吸着する秒の雫「Edge Droplet」を組み合わせた、配信画面に自然に溶け込む時計素材です。 秒が切り替わるたびに、雫がほんの少し横に伸びて戻る表面張力モーションが入ります。数字は可変フォント風のモーフィングで、フェードやスライドとは違うなめらかな印象に仕上げています。 ## 内容物 - index.html - styles.css - config.js - clock.js - README.md - fonts/README.md ## 主な機能 - OBS / Streamlabs のブラウザソース対応 - ローカルファイルとして読み込み可能 - 24時間 / 12時間表示の切り替え - 秒表示のON/OFF - 曜日・日付表示のON/OFF - 日本語 / 英語表示 - 透明背景 / 単色背景 - 16色カラーバリエーション - Webフォント / ローカルフォント切り替え - 初心者向け導入README付き ## Lite版とFull版の違い Lite版（無料） - 2色 - Webフォントのみ - 基本表示 Full版（980円） - 16色 - 秒・日付・言語・背景の切り替え - ローカルフォント対応 - 収益化配信OK ## 推奨サイズ 600 x 300 px 大きめに使う場合: 720 x 360 px コンパクトに使う場合: 460 x 240 px ## 使い方 1. OBSまたはStreamlabsでブラウザソースを追加 2. ローカルファイルとして index.html を選択 3. 幅 600 / 高さ 300 に設定 設定を変えたい場合は、config.js をテキストエディタで開いて編集してください。 ## 注意事項 - 本素材はHTML / CSS / JavaScriptで動作します。 - OBS内蔵ブラウザはChromiumベースのため、通常はそのまま動作します。 - Webフォント使用時はインターネット接続が必要です。 - オフライン運用したい場合は、README.mdを参考に fontSource を local に変更し、fonts/ フォルダへフォントを配置してください。 - ご利用環境によって、フォントやエフェクトの見え方が少し変わる場合があります。 ## 利用規約 OK: - 個人配信での使用 - 収益化済み配信での使用（有料版のみ） - 動画、配信アーカイブ、SNS告知画像への映り込み - 色や表示設定の変更 NG: - 素材データの再配布、再販売 - 改変データの配布、販売 - 自作発言 - 公序良俗に反する用途での使用 クレジット表記は任意です。 していただける場合は商品ページやショップ名を記載していただけると嬉しいです。