【広告】

Amazonブラックフライデーが12月2日まで開催中です!

個人的には、Anker製品か、コカ・コーラがかなり安くなっているのでおすすめです!

高級キーボードで有名な東プレが最近発売した「REALFORCE R3」もセールをやっていました!詳しくはこちらの記事を確認してみてくださーい。

【Vivaldi】テーマを変更する方法・カスタマイズ方法

2021年9月6日Vivaldi

Vivaldi のアイコン

この記事は、Vivaldi のテーマを変更する方法・テーマのカスタマイズ方法について書きます。

Vivaldi では、既存のテーマがいくつか用意されていますが、自分で好きなようにカスタマイズすることも可能です。

【Vivaldi】テーマを変更する方法・カスタマイズ方法

Vivaldi は、あらかじめ用意されたテーマだけでなく、自分でカスタマイズすることも可能です。Chrome みたいに、外部サイトから有志が作成したテーマをダウンロードすることはできませんが、自分で0から色を考えて作成することができます。

初期のままの質素なテーマでもいいですが、自分が好きな色に変更することでより楽しくブラウジングすることができます。

色の専門知識は一切必要なく、僕みたいな初心者でもできるので、ぜひ自分の好きな色に変更してみましょう。

参考:【Vivaldi】おすすめのウェブブラウザ・Vivaldiのインストール方法

11月14日追記

Vivaldi 最新スナップショットにて、テーマのインポート、エクスポート機能が実装されました。それと同時にVivaldi テーマストアもオープンしました。

これにより、他の人が作成したテーマを簡単に適用できるようになりました。

テーマストアリンク:Vivaldi Themes

【Vivaldi】テーマストアから、テーマをダウンロードして適用する方法

今はまだスナップショット版でしか利用できませんが、テーマストア自体は安定版の方でも確認できるので、ぜひ興味が湧いたら見てみてください。

テーマを変更する方法

早速、テーマを変更していきます。

画面左上のVivaldiアイコン → 設定 をクリックします。(CtrlF12でも可能)

vivaldiメニュー

テーマ

「テーマ」をクリックします。

初期からあるテーマの中から好きなテーマを選択します。好みのテーマがない場合はこちらの方法でテーマを自作できます。

僕は既存からある「Dark」にしています。黒背景が目に優しくて最高です。

テーマ

テーマを変更する方法は以上です。

テーマをカスタマイズする方法

初期からあるテーマで好みのテーマがなかった場合、テーマをカスタマイズすることができます。

テーマ下の「+ボタン」をクリックして「テーマを編集」をクリックします。

テーマを自作

0からテーマを自作するのは少ししんどいという方は、既存のテーマをカスタマイズすることも可能です。

既存のテーマをクリック→「+」か「テーマの編集」をクリックします。既存テーマのコピーが作成されるので、変更したい箇所だけカスタマイズしていきます。

ダークテーマ

カスタマイズの流れとしては以下の感じです。初心者でも直感的な操作でできます。

①好きな色を選ぶ

自分で好きな色を決めます。

テキスト欄には、見慣れたことない「#半角英数字」の文字列が表示されています。カラーコードと呼ばれるインターネット上の色の情報ですので、気にしなくて大丈夫です。Vivaldi は色を見ながら決められるので便利です。

色を変更
設定項目説明
名称テーマの名前
背景背景色の変更(設定画面など)
前景文字色の変更
ハイライトアドレスバーをクリックした時の枠線や、その他、枠線などの色を変更
アクセントタブバー(画面上部)の背景色の変更

②テーマ設定

設定項目説明
アクティブページからアクセントカラーを参照開いてるタブの色を自動的に、タブバーの色に反映させる設定
閲覧するサイトごとで、タブバーの色が変わるため、頻繁に見栄えを変えたい場合、チェックをつける
ウィンドウにアクセントカラーを適用オフにすることで、タブバーの背景色が白になる
透明なタブ非アクティブタブの上にカーソルをあてた時、タブを透過させるかどうか
角を丸くするタブの枠を丸くする設定。数字が大きいほど丸くなる

「アクティブページからアクセントカラーを参照」はタブを切り替えるごとに色が変わるから正直、鬱陶しいです。僕はチェック外しています。既存テーマを利用している場合は、デフォルトでオフになっています。

僕は、角丸が大好きなので、「角を丸くする」をMAXの14にしています。ここの数値で、アドレスバーや検索バーが丸くなります。可愛いです。

③背景を設定する

スタートページに表示される背景色を設定することができます。好きなものを選んで、右の中から色を選ぶことができます。

背景を選択

これだけでもかなりのバリエーションがあるのですが、自分の好きな色や壁紙にしたい場合、個人設定から設定できます。試しに、デスクトップの壁紙を設定してみます。

個人設定

デスクトップの壁紙をスタートページに設定することができました。デスクトップの延長線のように、ブラウザを利用できるってなんかいいですね。

デスクトップの壁紙をvivaldiに設定

Vivaldi 好きなら、こちらのサイトからVivaldi 関連の壁紙をダウンロードすることができます。

僕が作成したカスタムテーマの色を書いておきます。僕は青が好きなので青を基調としたテーマです。

項目カスタマイズ内容
背景f3f3f3
前景020202
ハイライト5977e3
アクセント3979ef
アクティブページからアクセントカラーを参照オフ
ウィンドウにアクセントカラーを適用オン
透明なタブオフ
角を丸くする14px

青を基調としたテーマです。当サイトを見ても分かる通り、青がとにかく大好きです。

青を基調としたカスタムテーマ
僕が作成した青を基調としたカスタムテーマ

まとめ

以上、Vivaldi のテーマを変更する方法でした。

パッと見のデザインが自分好みだと、気分も上がって楽しくウェブサイトを閲覧することができます。

決められた中から選ぶのではなく、自分の好きなように設定ができ、カスタマイズの過程も楽しめてよかったです。ぜひ、Vivaldi をインストールしている方は、テーマを変更して好きなデザインにしてみてください。

Posted by ナポリタン寿司