字幕スタイル

設定の動画字幕 → 字幕スタイルを開きます。変更するとプレビューが更新されます。

基本設定

• 表示モード：バイリンガル、原文のみ、訳文のみ。
• 翻訳の位置：原文の上か下。
• メイン字幕と翻訳字幕：行ごとのフォント、文字の倍率、色、太さ。
• 背景の透明度：字幕の後ろの箱の濃さ。

デフォルトにリセットですべて元に戻ります。

プリセットテンプレート

カスタム CSS → プリセットテンプレートで：

テンプレート	効果
訳文をぼかす	ホバーするまで訳文をぼかし、先に耳で聞けるようにする
訳文に破線	訳文に破線の下線を引く
原文を弱める	原文の行を薄くして、訳文を目立たせる

自分の CSS

書いた CSS は上の設定の上から適用されます。使えるセレクターは次のとおりです。

セレクター	対象
.read-frog-subtitles-box	2 行を入れている箱
.subtitles-main	原文の行
.subtitles-translation	訳文の行

訳文をぼかして、ホバーで表示する：

.subtitles-translation {
  filter: blur(6px);
}

.subtitles-translation:hover {
  filter: none;
}

箱の代わりに影を付けた黄色の訳文：

.read-frog-subtitles-box {
  background: transparent;
}

.subtitles-translation {
  color: #ffd84d;
  text-shadow: 0 1px 3px rgb(0 0 0 / 0.9);
}

エディターは入力中に CSS をチェックします。保存をクリックすると適用されます。