- ドラッグ移動
- クリック設定へジャンプ
- Shift + ドラッグ水平移動 / 垂直移動
- Alt + ドラッグガイドを無視して移動
- 赤い十字をドラッグ動きの中心 (Shift で端か真ん中に合わせる)
- Shift / Ctrl + クリック複数選択
- Ctrl + Aすべて選択
- ↑ ↓ ← →1px 移動 (Shift で 10px)
- Ctrl + C / V自由配置の要素をコピー / 貼り付け
- Delete自由配置の要素を削除
表示タイプ
時刻の形式
動きを確かめるときは、「秒の表示」を一時的に ON にすると毎秒動くので確かめやすくなります。
タイマー設定
開いたときに終了日時を過ぎていたら、1 日ずつ先に送ります (毎日同じ時刻に配信するときに使えます)
配信に音を入れるには、OBS のブラウザソースのプロパティで、音声を OBS で制御する設定を ON にします。音声ファイルは 2MB までです (書き出す HTML に入ります)。
カウントアップ設定
数字 (時・分・秒)
時刻と日付の区切り線
コロン
タイムゾーン表示
副時計 (別タイムゾーン)
プリセットにないタイムゾーンは「カスタム…」を選び、すぐ下の入力欄に Europe/Madrid のような IANA 形式の名前を入れます。
使える記号
| 記号 | 意味 | 例 (ja) | 例 (en) |
|---|---|---|---|
YYYY | 年 4 桁 | 2026 | |
YY | 年 2 桁 | 26 | |
MM | 月 (0 埋め) | 05 | |
M | 月 | 5 | |
DD | 日 (0 埋め) | 28 | |
D | 日 | 28 | |
MMMM | 月名 (長) | 5月 | May |
MMM | 月名 (短) | 5月 | May |
Do | 序数 | 28日 | 28th |
dddd | 曜日 (長) | 木曜日 | Thursday |
ddd | 曜日 (短) | 木 | Thu |
曜日を表示したい場合は ddd / dddd を形式に入れてください (例: YYYY-MM-DD ddd)。
M / D / Y など、記号と同じ文字をそのまま表示したいときは [...] で囲みます (例: [Mar] D ❤ [Birthday] → Mar 28 ❤ Birthday)。
スタイル
アイコン
プリセットにないアイコンは「カスタム…」を選び、すぐ下の入力欄に Material Symbols の名前を入れます (例: crown, sword_rose, favorite)。
アニメーション
テキスト・画像・アイコン・図形を、カードのどこへでも置けます。カードの外にはみ出して置くこともできます。プレビューの右下の「編集」(編集モード) で、ドラッグで動かせます。画像・アイコン・図形は四隅の四角いハンドルで大きさを変えられ、どれも下の丸いハンドルで回転できます。時計の文字より手前か奥かは、配置タブのレイヤーで決めます。
ブラウザソース内での位置
時計を画面のどこに表示するか。OBS で位置調整しやすい四隅などを選べます。
並び順
上下の並びを ↑↓ で入れ替えできます。
レイヤー
上にあるものほど前面に重なります。▲▼ かつまみのドラッグで並べ替えます。「時計」より下に置いた要素は時計の文字の後ろに、「カード」より下に置いた要素はカードの背景・フレームの後ろに重なります。行をクリックすると選択されます。
テキスト配置
余白 (カード内側)
塗り
背景画像
塗り (単色やグラデーション)の上に重なります。複数枚重ねることもできます (一覧の上にある画像ほど手前に重なります)。
枠線
アニメーション
プリセット
クリックすると現在の設定が上書きされます (元に戻すには Ctrl+Z)。
設定をすべて埋め込んだ単一HTMLを書き出します。OBSの「ブラウザ」ソースで、「ローカルファイル」にチェックを入れて、書き出した HTML を選びます。
※ プレビュー内で手動で拡大・縮小・移動しても書き出される HTML には反映されません。出力時の表示位置は「ブラウザソース内での位置」で調整してください。
複数の時計を使い分けるときは、時計に名前を付けてください。書き出すファイル名 (toki-maker-名前.html)、OBS のホットキーの項目、ドックの一番上の行 (TOKI×Maker コントローラー（名前）) に入ります。名前を変えると別の時計として扱うので、HTML とスクリプトを書き出し直して、OBS のソースとドックも入れ直してください。
OBS のブラウザソースの大きさの目安:
今の時計が収まる大きさです。OBS のソースのプロパティの「幅」と「高さ」に入れます。終了時のテキストなどで幅が広がるときは、大きめにしてください。
OBS で操作する (ドック・ホットキー)
タイマーとカウントアップは、OBS のドックとホットキーで開始・一時停止・リセットできます。
設定の共有・移行
他の人と同じ時計を共有したり、別の端末に設定を移したりするときは、次のボタンを使います。
画像を含む設定など、JSONが長くなるときは、ファイルで書き出して読み込みます (書き出した時計の HTML からも読み込めます)。