【OBS】フルカスタマイズ時計ウィジェット ― 色・透明度・フォント自由自在(8種プリセット付) English: OBS Analog Clock Pro [Fully Customizable & Lightweight]
- EX ver. (追加機能あり)ダウンロード商品¥ 500
- Standerd ver. (通常版)ダウンロード商品¥ 100
![【OBS】フルカスタマイズ時計ウィジェット ― 色・透明度・フォント自由自在(8種プリセット付) English: OBS Analog Clock Pro [Fully Customizable & Lightweight]](https://booth.pximg.net/3d16162a-e33c-4ff4-9b48-eed752db60c3/i/7943267/35d12b5c-b074-47ed-9157-3f41f44f1a46_base_resized.jpg)
![【OBS】フルカスタマイズ時計ウィジェット ― 色・透明度・フォント自由自在(8種プリセット付) English: OBS Analog Clock Pro [Fully Customizable & Lightweight]](https://booth.pximg.net/3d16162a-e33c-4ff4-9b48-eed752db60c3/i/7943267/927ac6d2-9aa8-4534-805d-6e8364314ca2_base_resized.jpg)
![【OBS】フルカスタマイズ時計ウィジェット ― 色・透明度・フォント自由自在(8種プリセット付) English: OBS Analog Clock Pro [Fully Customizable & Lightweight]](https://booth.pximg.net/3d16162a-e33c-4ff4-9b48-eed752db60c3/i/7943267/cc64f3d4-f3ad-41da-aa5a-fa246e5dfd07_base_resized.jpg)
![【OBS】フルカスタマイズ時計ウィジェット ― 色・透明度・フォント自由自在(8種プリセット付) English: OBS Analog Clock Pro [Fully Customizable & Lightweight]](https://booth.pximg.net/3d16162a-e33c-4ff4-9b48-eed752db60c3/i/7943267/22f8b148-5684-4a88-9b16-9d4552da324d_base_resized.jpg)
![【OBS】フルカスタマイズ時計ウィジェット ― 色・透明度・フォント自由自在(8種プリセット付) English: OBS Analog Clock Pro [Fully Customizable & Lightweight]](https://booth.pximg.net/3d16162a-e33c-4ff4-9b48-eed752db60c3/i/7943267/450f3195-15e4-4644-8259-a1caf3e505a1_base_resized.jpg)
OBSのブラウザソースで使える、カスタマイズ性の高いアナログ時計ウィジェットです。 HTMLファイルをOBSに読み込ませるだけで、すぐに使用可能です。 設定画面がウィジェットに内蔵されており、色やデザインを直感的に変更できます。 8種類のプリセットから選ぶことも、パーツごとの色や透明度を自由に編集して、あなただけのオリジナル時計を作ることも可能です。 English: A lightweight, highly customizable analog clock widget for OBS. Just load the HTML file into OBS to display a stylish clock. Includes a built-in settings panel for intuitive design customization. You can choose from presets or fully customize colors and transparency to create your own unique design.
【主な用途】
- 配信の雰囲気に合わせた、世界に一つだけのオリジナル時計として - 雑談配信・ゲーム配信の常時表示時計として - 海外視聴者向けのタイムゾーン表示(JST/UTC/ESTなど) 長時間配信でも動作が重くならないよう、軽量化・最適化済みです。
機能一覧
1. 自由自在なデザインカスタマイズ - 「フレーム」「文字盤」「針」「目盛り」の色をカラーピッカーで自由に変更可能。 - それぞれの「透明度」も調整できるため、背景に溶け込むようなデザインも作れます。 - フォントもゴシック・明朝・ドット絵など6種類から選択可能。 2. 便利な8種類のプリセット - デザインに迷った時は、8種類のテーマ(フラット、サイバー、和風、ゆめかわ等)から選ぶだけですぐに使えます。 - プリセットをベースにして、一部の色だけを変えるといった使い方も可能です。 3. タイムゾーン・多機能表示 - PCの時間はもちろん、ニューヨークやロンドンなど世界各地の時間を表示可能。 - 「日付」「デジタル時計」「秒針」の表示/非表示を切り替えられます。 - 24時間表記/12時間表記(AM/PM)にも対応。 4. 便利な内蔵設定パネル - OBS上で直接操作できる設定パネルを搭載。 - 設定内容は自動保存され、次回起動時にも維持されます。 5. 【500円(EX版)専用機能】さらにリッチな表現力 - 時計内に専用のハイクオリティなアニメーション(メカニカルギア、レーダーなど4種)を描画可能。 - 時計の背景にローカルからお好きな画像を設定可能(サイズ調整・透明度・くり抜き機能付き)。 - 「十二支(Zodiac)」などの専用の目盛り(文字盤)スタイルが使用可能。
デザイン・仕様
- カラー編集: プリセットまたはRGB指定で、パーツごとに設定可能。 - フォント変更: ゴシック、明朝、丸文字、ドット(Pixel)、サイバー(Orbitron)など6種。 - 秒針の動き: スムーズ(Sweep) / ステップ(Tick)の切り替え。 - 多言語対応: 設定画面は日本語、英語、中国語、韓国語、スペイン語に対応。
導入方法
1. ダウンロードしたZIPファイルを解凍(展開)する。 2. OBSの「ソース」にある「+」ボタンから「ブラウザ」を追加。 3. 「ローカルファイル」にチェックを入れ、解凍したフォルダ内の `clock.html` (EX版をご購入の場合は `clock_ex.html`) を指定。 ※幅(Width)と高さ(Height)に、ご自身の配信画面の解像度を入力してください。 💡【簡単導入のコツ】HTMLファイルを直接OBSの画面にドラッグ&ドロップすると、設定が自動で行われるため非常に簡単です! ⚠️【重要】プロパティ下部の「表示されていないときにソースをシャットダウンする」と「シーンがアクティブになったときにブラウザの表示を更新する」に必ずチェックを入れてください。 4. 設定を変更する際は、OBSのソースを右クリックして「対話(操作)」を開きます。 5. 対話ウィンドウ内で時計をダブルクリックするか、右上の「⚙️ 設定を開く」ボタンを押すと設定パネルが開きます。設定完了後は必ずパネルを閉じてください。
【動作確認環境】
- OBS Studio(Windows / macOS) - OBS の「ブラウザソース」機能
注意事項・できないこと
- アラーム機能やタイマー(カウントダウン)機能はありません。現在時刻を表示する時計です。 - 本ツールは Google Fonts を使用しており、表示時にフォント取得のための外部通信が発生します。 ※ 配信内容や設定データが外部に送信されることはありません。 - 長時間OBSを最小化(非表示)にした後、再表示した際に針が一瞬早送りになることがありますが、これは正常な動作(復帰処理)です。 - 本商品は現状有姿(as-is)での提供となります。 個別の環境差異による動作保証や設定代行は行っておりません。
━━━━━━━━━━━━━━━━━━━━━━━
Main Uses
- Creating a unique, original clock that matches your stream's vibe. - An always-on display clock for Just Chatting or Gaming streams. - Displaying timezones (JST, UTC, EST, etc.) for international viewers.
Feature List
1. Free Design Customization - Freely change the colors of the Frame, Face, Hands, and Markers using the color picker. - Adjust the transparency of each part to create a design that blends perfectly into your background. - Choose from 6 different fonts including Sans-serif, Serif, and Pixel. 2. 8 Convenient Presets - If you're unsure about the design, simply choose from 8 themes (Flat, Cyber, Japanese, Yumekawa, etc.) and use it right away. - You can also use a preset as a base and tweak only specific colors. 3. Timezones & Multi-Display Options - Display not only your local PC time but also times around the world, such as New York or London. - Toggle the display of Date, Digital Clock, and Second Hand. - Supports both 24-hour and 12-hour (AM/PM) formats. 4. Convenient Built-in Settings Panel - Features an intuitive settings panel that can be operated directly within OBS. - Settings are automatically saved and retained for your next stream. 5. Pro Features (EX Edition Only): Rich Expressions - Render high-quality internal animations (4 types including Mechanical Gears, Radar, etc.). - Set your favorite local image as the clock background (includes resizing, transparency, and clipping features). - Unlock exclusive marker styles such as "Zodiac".
Design & Specs
- Customization: Adjust Frame, Face, Hand, and Marker colors/opacity individually. - Customizable Fonts: Sans-serif, Serif, Rounded, Pixel, Sci-Fi, etc. - Second Hand Movement: Smooth (Sweep) or Step (Tick). - Multi-Language UI: English, Japanese, Chinese, Korean, and Spanish.
How to Use
1. Unzip the downloaded file. 2. In OBS, click "+" in Sources and select "Browser". 3. Check "Local file" and select `clock.html` (or `clock_ex.html` for Extended edition) from the unzipped folder. * Set Width and Height to match your canvas resolution. 💡[Tip] You can simply drag and drop the HTML file directly into OBS for an automatic and easy setup! ⚠️[IMPORTANT] Please check "Shutdown source when not visible" and "Refresh browser when scene becomes active" in the properties. 4. Right-click the source and select "Interact" in OBS to change settings. 5. Double-click the clock or click the "⚙️" button to open the settings panel. Please ensure you close the panel when finished.
【Tested Environment】
- OBS Studio (Windows / macOS) - Browser Source in OBS
[Important Notes & Limitations]
- This is a real-time clock. It does NOT include alarm, timer, or countdown features. - The widget uses Google Fonts, which requires network access to load fonts when displayed. * Your stream content and settings data are NEVER sent externally. - If OBS is hidden or minimized for a long time, the hands may fast-forward when shown again. This is normal behavior (time sync process). - This product is provided "as-is". We do not guarantee compatibility with every individual environment, nor do we provide setup services.
━━━━━━━━━━━━━━━━━━━━━━━
FAQ
Q. 配信画面が重くなりませんか? / Will it lag my stream? A. いいえ、動作は非常に軽量です。GPUアクセラレーションを有効化しており、低負荷でスムーズに動作するように設計されています。 (No, it is very lightweight. It is optimized with GPU acceleration to run smoothly with low load.) Q. 設定は保存されますか? / Are settings saved? A. はい。変更した設定はブラウザソースのローカルストレージに自動保存され、OBSを再起動しても維持されます。 (Yes. Settings are automatically saved to local storage and will be retained even after restarting OBS.) Q. 商用配信で使用できますか? / Can I use this for monetized streams? A. はい、個人・法人を問わず配信でご利用いただけます。 (Yes. You may use it for both personal and commercial streams.)
更新履歴 / Update Log
v2.0.0 - 価格改定: 通常版を500円から100円に大幅値下げ (Price Revision: Standard edition reduced from 500 JPY to 100 JPY) - 新バージョン: リッチな追加機能を搭載した「EX版(500円)」をリリース (New Version: Released "Extended Edition" with rich additional features) - パフォーマンス向上: 内部処理を刷新し、OBS上での動作をさらに軽量化 (Performance: Refactored internal processes for even lighter operation in OBS) - エコモード追加: OBS上でウィジェットが非表示になった際、自動でバックグラウンド描画を停止する負荷軽減処理を実装 (Eco Mode: Added an automatic background rendering suspension when the widget is hidden in OBS to reduce load) v1.0.0 - 初回リリース (Initial Release)




