PC版YouTube Musicで歌詞の再生同期を実現する拡張機能「Better Lyrics」

サムネイル画像

入れるだけでテンション上がります。

PC版のYouTube Musicで歌詞表示の再生同期機能を実現するブラウザ拡張機能『Better Lyrics』を紹介します。

再生画面のデザインもよくなるので、歌詞はたまにしか見ないという方でもおすすめの拡張機能です。

ブラウザでYouTube Musicを開いたときだけでなく、アプリ版(ブラウザのPWA機能でインストールできるもの)でも使うことができます。

もちろん完全無料です。

Better Lyrics の機能紹介

歌詞が曲再生に合わせて同期

歌詞が曲の再生時間に合わせて自動でスクロールする機能です。

また、歌詞の行をクリックして遷移することも可能です。好きな歌詞の部分を繰り返し聴くような使い方にも対応しています。

曲によって、歌詞の同期再生に対応していない場合があります。歌詞表示自体に対応していない場合もあります。

ただ、元からYouTube Musicは歌詞表示に弱い(他のサブスクより少ない)ので、拡張機能を入れるだけで歌詞表示ができる曲が増えます

💡
Better Lyrics の歌詞データは、Better Lyrics API と LRCLIB という無料のオープンソース歌詞プロバイダーを使用しているようです。これらに登録されていない曲の歌詞は表示できません。

ちなみに歌詞の同期機能は、スマホ版のYouTube Musicアプリでは対応しています。PC版だけ公式に対応していない状況です。

PCでも歌詞を曲と同期させたい場合、現状この拡張機能を入れるのが一番です。

外国語の歌詞を自動翻訳

かなりざっくりとした翻訳

洋楽の歌詞を日本語でざっくり把握したい、というときに便利な歌詞の自動翻訳機能もついています。

機械翻訳なので文脈を無視した直訳ですが、便利な機能ではあります。

また、設定からRomanizationをオンにするとローマ字以外の言語の歌詞をローマ字で読み方を提示してくれる機能もあります。

K-Pop聴くときにすごく便利そう

ローマ字の読み方と日本語の機械翻訳を同時に表示することもできます。

アルバムアートが透ける美しい再生画面

ここまで紹介した画面の通り、拡張機能を入れる前よりも再生画面が美しいデザインになります。

before / アートワークが見切れているし、歌詞の文字も小さく味気ないです
after / かなりモダンになりました。歌詞同期に対応していない曲なので白文字で表示されています

通常のYouTube Musicではアルバムアートがはみ出る不具合がありましたが、拡張機能を入れるとそれも直ります。

背景にアルバムアートが透過されることで、まるでApple Musicのような美しいプレイヤーに様変わりします。これだけでも入れる価値があります。

※ミュージックビデオなどの動画再生時は無地の黒背景になります。

全画面表示にも対応

通常のYouTube Musicの全画面表示は、アルバムアートが画面いっぱいに映し出されるだけの機能でした。

Better Lyrics を入れると、全画面表示時に歌詞を横で再生することができます。

注意したい点が、全画面時は歌詞のスクロールやクリックには非対応です。

ただ流れる歌詞とアートワークを眺める、そんな贅沢なプレイヤーUIです。

インストール方法

Chrome と Firefox に対応しています。

↑Chrome系ブラウザはこちら(Microsoft Edge, Braveなど)

↑Firefox系ブラウザはこちら

インストール後にYouTube Musicを開くと、設定いらずですぐに使いはじめられます。

拡張機能の設定の各項目について解説

大きく分けて4つの設定項目があるので、それぞれ解説します。

まずはブラウザの拡張機能一覧から Better Lyrics を見つけて開きます。

General: 全般的な設定

設定画面を開くと一番最初に出てくるタブです。

  • Show Logs: デフォルトのままでOK
  • Auto Switch to lyrics tab: オンにすると再生画面を開いたときに自動で歌詞が表示されます
  • Default Lyrics Provider: 問題がなければデフォルトでOK
  • Cache: 歌詞のキャッシュを消去するボタンです

Display: 再生画面のUI設定

主に再生画面のUIに関する設定です。わたしはデフォルトの状態で運用しています。

  • Disable fullscreen mode: オンにすると全画面表示時の歌詞表示機能が無効になります
  • Auto-hide cursor in fullscreen mode: 全画面表示時にマウスカーソルを自動で非表示にする機能
  • Show blurred album art background: オフにするとアルバムアートが背景に透過されて表示されなくなります
  • Show stylized animations: オンにすると歌詞がふわっと表示されます

Laungage: 翻訳機能を有効にする

インストール直後はオフになっているので、必要に応じて有効にしましょう。

  • Romanization: ローマ字以外の文字で書かれた歌詞をローマ字で読み方を表示する機能
  • Translate song lyrics: オンにすることで、下の Translation Language で設定した言語以外の歌詞が自動翻訳されます
  • Translation Language は日本語に翻訳してほしい場合は日本語に設定しましょう

Themes: 歌詞表示の見た目を変える

歌詞表示のデザインやアニメーションをカスタマイズできる機能です。

いくつかテーマが用意されているので、お好みのものを選びましょう。

わたしはどのテーマも行間が広すぎて好みではなかったので、Custom CSS で以下の設定を適用しています。

そのまま使いたい!という方がいたら、以下のコードをコピペしてお使いください。(記事内の画像はすべてこの設定でスクショしています)

:root {
  --blyrics-line-height: 1.25;
  --blyrics-padding: 1.25rem;
}

どちらの項目も歌詞の行間を調整するものです。 --blyrics-line-height が行の高さを調整する項目で、 --blyrics-padding が文の行間を調整する項目です。

他にも文字サイズやアニメーションなど幅広いカスタムができます。詳しくは公式のスタイリングガイドを参照してください。

まとめ:YouTube Musicをより使いやすくしよう

PCでYouTube Musicをより快適に使えるようになるので非常におすすめの拡張機能です。

歌詞をあまり見ないという人でも、再生画面がきれいになるだけで入れる価値はあると思います。

最後まで読んでいただきありがとうございました。