TOKI×Table

コンセプト

配信の週間スケジュール告知は「毎週おなじ体裁で作り直す」作業です。画像編集ソフトでテンプレートを開き、日付を打ち直し、曜日をずらし、内容を差し替える — この繰り返しをなくすのが TOKI×Table の目的です。

起点日は開くたびに今日を含む週へ自動更新されます (起点の曜日は維持され、各曜日の内容はそのまま引き継がれます)。翌週送りのボタンを押す必要はなく、開いて内容を書き換えたら書き出すだけです。

タイムゾーンの併記もできます。海外の視聴者に「21:00 JST / 12:00 UTC」を同時に見せられます。各行の実日付で変換するので、夏時間の切り替わりも正しく出ます。

成果物は告知にそのまま使える画像 (PNG) です。TOKI×Maker の姉妹ツールで、Peraravatar 同様、外部サーバ不要のクライアント完結型です。

主な機能

• 選べるレイアウト: テーブル (曜日を縦に並べるリスト) / カード (曜日をカードで並べるグリッド)
• スケジュール表: 非表示にして自由配置要素だけでもレイアウト作成可能
• 24種のプリセット: テーブル 10種 / カード 12種 / その他 2種 (一覧は プリセット)
• サイズ: 横長 16:9 (1920×1080) / 横長 16:9 (1200×675) / 縦長 4:5 (1080×1350) / 正方形 1:1 (1080×1080) / スマホ縦 9:16 (1080×1920) / カスタム
• タイムゾーン併記: 行内併記 / 2段表示 / フッター注記のみ の3スタイル。主タイムゾーンは IANA 名で検索・直接入力、併記は最大2つ
• 起点日: 開くたびに今日を含む週へ自動更新 (起点の曜日は維持、各曜日の内容はそのまま)
• 1日に複数枠: 枠ごとに開始 / 終了時刻・内容・配信媒体・ゲスト・背景色・枠線色
• 配信媒体: Twitch / YouTube / X / ニコ生 / Kick / REALITY / カスタム (アイコン画像と名称)。表示は アイコン＋文字 / アイコンだけ / 文字だけ
• 内容はリッチテキスト: 選択した範囲のフォント・色・サイズ・太字・斜体・下線の変更と改行が可能。翻訳 (2段目・任意) と ルビ表示 (ラベルの上) にも対応
• 自由配置: テキスト / 画像 / アイコン / 図形 を X・Y (px)・回転・反転・不透明度で配置
• 切り抜き: 立ち絵などを 円 / 四角 / 角丸 / 星 / ハート / ひし形 / 六角形 / 三角 / カスタムアイコン の形に切り抜き。単一 / 複数 を選択可能
• 図形: 円 / 楕円 / 四角 / 角丸 / 吹き出し / 三角 / ひし形 / 星 / 六角形。吹き出しの尻尾は辺に沿って可動
• 背景: 単色 / 線形グラデーション / 放射グラデーション / 画像。その上にパターン37種を重ね掛け可能 (塗り分け・透過つき)
• フォント 100種以上: 日本語 / 韓国語 / 中国語 / タイ語 / ロシア語 / 等幅 / Sans / Display / Script
• 文字スタイル: 太字 / 斜体 / 下線 / ネオン光彩 / 縁取り / 影 (ぼかし) / レトロ影
• レイヤー: スケジュール表・タイトル・期間・注記・アイコン＋名前の5ブロックと自由配置の要素をひとつの並びで管理。並べ替えとグループ化が可能
• 編集モード: プレビュー上でドラッグ移動・四隅サイズ変更・回転・切り抜き位置の調整。クリックでその要素の設定へジャンプ
• 書き出し: PNG画像 / クリップボードコピー / SNSシェア / JSON
• 自動保存: localStorageに常時保存、Undo / Redo (Ctrl+Z / Ctrl+Y)
• 多言語: 日本語 / 英語
• UIカスタム: テーマ (ダーク / ライト / ファンシー / 手芸) / メニュー位置 (右・左) / 文字サイズ (90-150%) / UI 表示/非表示の切替
• モバイル対応: スマホでは縦並びレイアウト (プレビュー上 / メニュー下)

選べるレイアウト

「レイアウト」タブの先頭で テーブル / カード を切り替えます。入力した予定はそのまま残りますが、切り替え時にはそれぞれ調整が必要です。

‹ ›

プリセット

「プリセット」タブから1クリックで適用。ベースとして読み込み → 各タブで微調整するのが最速の使い方です。「スケジュール内容 (文言・時刻・日付) を保持」にチェックを入れておくと、入力済みの予定を残したまま見た目だけ入れ替えられます (※文字の色やサイズなどの装飾は引き継がれず、プリセットの基準スタイルになります)。

テーブル (10) カード (12) その他 (2)

自作プリセット: 現在の設定に名前を付けて保存できます (保存先はブラウザの localStorage)。同じ一覧に「自作」として並びます。

基本タブ

画像全体に関わる設定と、タイトル / 期間 / 名前の文字まわりを置いたタブです。

基本情報

• 起点日: ここから各行の日付・曜日・期間を自動算出。開くたびに今日を含む週へ自動更新されます (起点の曜日は維持)
• サイズ: 書き出す画像の大きさ (＝キャンバス)
  • 横長 16:9 (1920×1080) — X告知向け
  • 横長 16:9 (1200×675) — X告知・軽量
  • 縦長 4:5 (1080×1350) — モバイルで縦に大きく
  • 正方形 1:1 (1080×1080) — 汎用
  • スマホ縦 9:16 (1080×1920) — ストーリーズ向け
  • カスタム — 幅 × 高さ (px) を直接指定
• 全体の拡大縮小 (%): スケジュール全体をまとめて拡大縮小

全般のメインスタイル

画像全体の基準となる文字スタイル。フォント / 色 / 太字・斜体・下線 / テキスト装飾 (ネオン光彩・縁取り・影・レトロ影) / 装飾色 / 装飾の強さ (px)。各要素で個別に指定するとそちらが優先されます。

タイトル・アイコン・期間・名前

• タイトル: フォント / サイズ (px) / 色 / 字間 (px) / 文字スタイル / テキスト装飾
• アイコン: タイトルの左右に Material Symbols のアイコンを添えられます。プリセットにないアイコンは「カスタム」を選んで名前を入力
• 期間: 起点日から自動生成される「6/22 - 6/28」の表示。フォント / 色 / 文字スタイル / 装飾 / 不透明度
• 名前: ハンドル名とアイコン画像。フォント / 色 / 文字スタイル / 装飾 / 不透明度

予定タブ

各曜日の配信予定を入れるタブです。1日に複数の枠を追加できます。

曜日ごと

• 配信: チェックを外すと「お休み」の表示になります (お休みの表示文字は曜日ごとに指定できます)
• 枠: 開始時刻 / 終了時刻 / 内容 / 配信媒体。＋ 枠を追加 で増やせます
• 内容: リッチテキストで、選択した範囲にフォント / 色 / サイズ (px) / B / I / U / 左・中央・右揃えを指定できます
• 翻訳 (2段目・任意): 内容の下にもう1行。フォント / 色 / サイズ / 装飾を独立指定でき、ルビ表示 (ラベルの上) に切り替えると内容の中央上に小さく載ります
• 配信媒体: Twitch / YouTube / X / ニコ生 / Kick / REALITY / カスタム。複数選択で同時配信も表せます。カスタムは ＋ カスタムを追加 でアイコン画像と名称を登録
• ゲストあり: ＋ ゲストを追加 でアイコン画像と名前を並べます (コラボ配信向け)
• 背景色 / 枠線の色: 枠ごとに指定できる
• サムネ: カード型のときに使う、その日の画像

時刻

• 形式: 24時間 (21:00) / 12時間 (9:00 PM)
• AM/PM表記: AM / PM / a.m. / p.m. / 午前 / 午後
• 時刻の並び: 横並び / 縦並び (開始と終了を縦に並べる)
• 時刻の区切り / 縦並びの区切り: 区切りの文字とサイズ

タイムゾーン

主タイムゾーンは一覧から選ぶか、検索欄に都市名 (例: Tokyo, New_York, London) を入れて絞り込みます。一覧にない IANA 名も直接入力できます。併記タイムゾーンは最大2つまで追加できます。

併記スタイルは3種類:

「フッター注記のみ」を選ぶと、注記そのものの設定も出ます。

• 注記の文字: 空欄なら「全時刻 (主タイムゾーン)」
• フォント / サイズ (px) / 色

レイアウトタブ

表とカードの並べ方、要素の重なり順・位置をまとめたタブです。

スケジュール表

• レイアウト: テーブル / カード (スケジュール表を非表示にして自由配置要素だけでもレイアウト作成可能)
• カード型: カードの列数 / カードの間隔 (px) / 背景パネル (分割 = カードごと / まとめる = 全体を1枚で包む) / カード間の区切り線 / 配信媒体の位置 (下部 / 上部 / 右上 / 左上) と揃え (左寄せ / 中央 / 右寄せ)
• 日付と曜日: 重ねる / 並べる、並び (日付 → 曜日 / 曜日 → 日付)、間隔 (px)
• 時刻と内容: 重ねる / 並べる、並び (時刻 → 内容 / 内容 → 時刻)、時刻の上下位置 (上 / 中央 / 下)、間隔 (px)
• 列幅: 表の幅 (px)、日付・曜日 / 時刻 / 配信媒体 の各列を「自動」か px 固定で
• 行と行のすき間 (px)
• 列見出し: 内容の見出し / 時刻の見出しの文言・色・太字
• 行頭チェックボックス: 色 / サイズ (px) / 当日まで自動チェック (今日までの行に自動で付く)。今週どこまで終わったかを示す欄で、毎日スケジュールを更新して出し直す人向け
• カードの形状: 矩形 / 角丸 / 上だけ角丸 / 下だけ角丸 / 円形 / 上半円 / 下半円 / 画像 (画像そのものをカードの形にする。画像のアス比を保つ・背景の縮小・アンチエイリアスも指定できます)
• 日付・曜日の帯 / サムネ: カード上部に敷く帯の背景色・余白、サムネの高さ・配置・位置
• テーブルの枠・背景: 枠線 (実線 / 破線 / ドット / 二重線) / 背景色 / 角丸 / 内側余白 / 影
• 行間の区切り線: スタイル・太さ・色に加えて カスタム を選ぶと、アイコンや画像を繰り返す素材として線に使えます
• 行のバー: なし / 行全体に1本 / 内容・時刻で分ける から選び、色・グラデーション・枠線・四隅個別の角丸・余白・影を指定。背景と同じパターンにするで背景の柄をバーの中に透かせます

レイヤー

スケジュール表・タイトル・期間・注記・アイコン＋名前の5ブロックと、自由配置の要素をひとつの並びで管理します。上にあるものほど前面。▲▼ かつまみのドラッグで並べ替え、2つ以上を選んでグループ化すると、まとめて動かせます。見出し横の open_in_full ボタンを押すと、同じ一覧が広い画面で開きます。各行のスイッチで表示する / 非表示も切り替えられます (各タブのスイッチと同じもので、非表示の行は薄く出ますが重なり順は変えられます)。

要素の位置

タイトル / 期間 / アイコン＋名前 / テーブル / 注記 の X・Y・回転を数値で指定します。全体の位置でスケジュール全体をまとめて平行移動でき、リセットで戻せます。

スタイルタブ

文字の種別ごとにフォント・色・サイズ・装飾を指定するタブです。空欄にすると基準 (基本タブの「全般のメインスタイル」) を継承します。

• 日付: 形式 (8/30 / 08.30 / 8月30日 / 八月三十日 / Aug 30 / 30th August など19種 + カスタム書式) / フォント / 色。日付の見せ方を「月・日を分けて個別装飾」にすると、月の数字・日の数字・区切りをそれぞれ別のサイズ・色・装飾にできます
• 区切り: スラッシュ (/) / ドット (.) / ハイフン (-) / 中黒 (・) / 長い斜め線 / アイコン / なし
• 曜日: フォント (「日付と同じ」ボタンあり) / 表記の形式 (日 月 火 … / 日曜 月曜 … / Sun Mon Tue … / Sunday Monday … など + カスタム) / 曜日の色 (一括 / 個別 / グラデ) / 曜日の背景 (円形 / 角丸 / 四角の背景バッジ。塗りは色かアイコンを選べます)
• 時刻の文字: フォント / 色 / 太さ / 斜体・下線 / テキスト装飾
• 内容: 文字揃え / フォント / 色 / 文字スタイル / テキスト装飾 / 不透明度
• お休みテキスト: お休みの表示文字 / 文字揃え / 内容の位置に合わせる (時刻列を空ける) / 上下位置 (px) / 不透明度 (%)。配信OFF の日に出る文言とそのスタイル
• 配信媒体バッジ: フォント / 色 / 文字スタイル / 装飾 / 不透明度 / バッジ背景 (形状・角丸・背景色・余白) / カスタムの文字サイズ (px)
• ゲスト: 名前の文字スタイルとアイコンのサイズ

自由配置タブ

＋ テキスト / ＋ 画像 / ＋ アイコン / ＋ 図形 で要素を追加し、X / Y (px)・回転 (°)・左右反転 / 上下反転・不透明度を数値で指定します。プレビュー上のドラッグでも動かせます。各要素の見出しにある表示する / 非表示のスイッチで、消さずに一時的に隠せます。テーブルより前面か背面かは レイアウトタブのレイヤーの並びで決まります。

• テキスト: サイズ / B / I / U / 揃え / 幅 (px) / 装飾 (ネオン光彩・縁取り・影・レトロ影) / 背景色と角丸。日付プレースホルダを書くと起点日から自動で埋まります
• 画像: 幅 (%) と不透明度。切り抜きで 円 / 四角 / 角丸 / 星 / ハート / ひし形 / 六角形 / 三角 / カスタムアイコン の形に切り抜けます。「複数」にすると、同じ画像から切り抜きをいくつも作って別々に置けます
• アイコン: Material Symbols を1文字として配置 (サイズ・色)
• 図形: 円 / 楕円 / 四角 / 角丸 / 吹き出し / 三角 / ひし形 / 星 / 六角形。幅・高さ・角丸・枠線 (実線 / 破線 / ドット / 二重線)・不透明度。吹き出しは尻尾の向き (下 / 上 / 左 / 右)・位置 (%)・サイズ (px) を指定でき、角丸の円弧に沿わせて傾きます

日付や内容を差し込む

自由配置のテキストに {1:day} のように書くと、予定の中身がそこに入ります。表を使わずに組むときは、この書き方で日付や内容を置きます。

数字は起点日から数えた日で 1〜42。内容と時刻は予定の入力がある 1〜7 まで (それ以降は書いたまま残ります)。1日に複数の枠があるときは {1.2:label} のように枠の番号を付けます。書式を直接書くと「日付」「曜日」の設定より優先されます。

背景タブ

ベース

• 形状: 矩形 / 角丸 / 円形 / 下だけ角丸 / 上だけ角丸 / 下半円 / 上半円 (＋角丸の量 px)
• 種類: 塗り / 画像
• 塗り方: 単色 / 線形グラデーション / 放射グラデーション (背景色1・背景色2・角度)
• 画像: ファイルを読み込み、配置 (全体に表示 (はみ出し可) / 全体に表示 (はみ出さない) / 並べて配置 / 引き伸ばし) と透過

パターン

ベースの上に重ねる柄です。37種から選べます。

パターン幅 (px) / 角度 (度) / パターン色に加えて、塗り分けで柄の面ごとに色を変えられます。透過は柄と塗り分け色の両方に効きます。

枠線: 画像全体を囲む枠線 (実線 / 破線 / ドット / 二重線 / 溝 / 隆起) と色。

プリセットタブ

プリセットの一覧と、自作プリセットの保存・削除を行うタブです。一覧は テーブル / カード / その他 / 自作 に分かれています。

• クリックすると現在の設定が上書きされます (Ctrl+Z で戻せます)
• スケジュール内容 (文言・時刻・日付) を保持: チェックしておくと、入力済みの予定を残したまま見た目だけ差し替えます
• ＋ ボタンで現在の設定を自作プリセットとして保存 (保存先はブラウザの localStorage)

書き出しタブ

画像の書き出し

• シェアする: 画像を作ってからシェアモーダルを開きます (X / Threads / LINE / Bluesky / Facebook / Telegram / WhatsApp / はてブ / メール / 画像・テキストのコピー)
• PNG画像だけ保存: ファイルとして保存
• はみ出した部分も含める: キャンバスの外にはみ出した画像や装飾も切らずに書き出します。はみ出した分だけ出力サイズが大きくなります (本体は指定サイズのまま)

設定の共有・移行

• JSONをコピー / JSONを貼り付けて適用: 設定をテキストでやり取りする
• JSONをファイルで書き出し / JSONファイルを読み込み: 画像を含む設定などJSONが長くなる場合

編集モード

プレビュー下部には ズーム / フィット (拡大縮小をリセットして全体表示) / 編集 / すべて選択 / UI 表示/非表示 (F・エディタUIを隠して書き出し後と同じ見た目で表示。Esc でも解除) のボタンが並びます。

編集 (ショートカット: E) を押すと、プレビュー上の要素を直接動かせます。要素をクリックすると、その要素の設定へジャンプします。

画像を切り抜いているときは中央につまみが出て、ドラッグで切り抜き位置を調整できます。

フォント

内蔵フォントは 100種以上 あり、日本語 / 等幅 / Sans / Display / Script / 韓国語 / 中国語 / タイ語 / ロシア語 / System の10カテゴリに分類されています。

多言語 / 表示設定

ヘッダ右上から切り替えます (すべてlocalStorageに永続化):

• 言語: 日本語 / English — UIラベル・ヒント・曜日や日付の表記に反映
• テーマ: ダーク / ライト / ファンシー / 手芸 — エディタUI自体の配色 (スケジュール画像には影響しません)
• 表示設定: 「エディタ表示」に 文字サイズ (90% / 100% / 110% / 125% / 150%) / メニュー位置 (右 / 左) / 背景 (チェッカー柄 / ダーク / ライト / 透明 / 単色)

データ保存

• localStorageに自動保存: 変更のたびにブラウザに保存されるので、タブを閉じても次回開くと復元されます (保存に失敗したときは通知します)
• 起点日は開くたびに今日を含む週へ: 起点の曜日は維持、各曜日の内容はそのまま引き継がれます。自由配置のテキストに 8 以上の日付プレースホルダを使っているときは、更新する前に確認します (29 以上のときは今日を含む月へ揃えます)
• Undo / Redo: Ctrl+Z / Ctrl+Y
• リセット: ヘッダの「リセット (初期化)」で初期設定に戻す
• JSON: コピー / 貼り付けて適用 / ファイルで書き出し / ファイルを読み込み

モバイル

スマートフォンではUIが自動的に縦並びになります (プレビューが上、メニューが下)。画面が狭くショートカットも使えないので、細かい調整は PC を推奨します。

クレジット表記

本ツールを配信や個人プロジェクトで使う場合、クレジット表記は必須ではありません。ですが、表記してもらえると制作の励みになります。

標準フォーマット

TOKI×Table by Ichigyun
https://gyungyun.com/works/toki-table

短縮フォーマット

スケジュール: TOKI×Table (gyungyun.com) / @zkmy_kuro

汎用ガイドは トップページのクレジット表記 を参照。