ブログ運営・SEO・収益化に悩んだら「ナオログ」へ

THE THOR(ザ・トール)のカラーコード全91種類を整理整頓

  • 2020年6月24日
  • 2020年10月3日
  • THE THOR
この記事のまとめ

WordPressテーマ「THE THOR」で使用できるカラー91種類の『6桁のカラーコード』と『THE THOR専用カラーコード』を紹介していきます。

 

今回はナオログでも使用しているWordPressテーマ「THE THOR」のカラーコードを紹介していきます。

専用のカラーコードと6桁のカラーコードもあわせて紹介していくのでブログのデザインを統一するときなどにつかってください。

なお
なお
自分でデザインを設定するときにいつもカラーコードがわからなくてイライラするので自分のための記事になりそうです。

 

記事の前半で「THE THOR専用のカラーコードの使い方」「6桁のカラーコードの使い方」を紹介し、後半で「THE THORで使用できるカラーコード一覧」を紹介していきます。

THE THOR(ザ・トール)専用のカラーコードの使い方

まずはTHE THOR専用のカラーコードをどのように使っていくのかを紹介していきますね。

下のボックスを例に説明していきます。

NEWボックス

コードはこんな感じです。

<div class="ep-box bgc-VPsky ftc-Vred brc-DGblue es-borderSolidM es-radius es-Bicon icon-new">NEWボックス</div>

このボックスをつくるためには3色のカラーコードを使っています。

位置を表すコードカラーコード
外枠色brcDGblue
背景色bgcVPsky
文字色ftcVred

THE THORのボックスは位置を指定するコードとカラーコードを組み合わせることで作成できます。

6桁のカラーコードの使い方

6桁のカラーコードは、カスタマイズ画面で設定するブログ全体の背景色や見出しカラーなどに使うことができます。

6桁のカラーコード入力場所

【 例 】

外観

カスタマイズ

基本設定

基本スタイル設定

「見出し」や「背景」と「ボックス」の色を合わせておくとブログに統一感が出るのでいろいろ組み合わせてみましょう!

THE THOR(ザ・トール)のカラー一覧

ここからはTHE THOR(ザ・トール)で使用できるカラーコードをまとめていきますね。

イエロー系

 

THOR6桁トーン
Vyellow#fff100ヴィヴィッド
Byellow#fff338ブライト
DPyellow#cbbd00ディープ
Lyellow#fff89aライト
DLyellow#cac04eダル
VPyellow#fffdedベリーペール
DGyellow#675f00ダークグレイッシュ

オレンジ系

THOR6桁トーン
Vorange#f49801ヴィヴィッド
Borange#f6ad3aブライト
DPorange#bf7601ディープ
Lorange#fbce8aライト
DLorange#c39043ダル
VPorange#fef5e8ベリーペール
DGorange#633c00ダークグレイッシュ

レッド系

THOR6桁トーン
Vred#e60112ヴィヴィッド
Bred#ea5532ブライト
DPred#b60105ディープ
Lred#f39c76ライト
DLred#ba5536ダル
VPred#feede3ベリーペール
DGred#5f0100ダークグレイッシュ

マゼンタ系

THOR6桁トーン
Vmagenta#e5004fヴィヴィッド
Bmagenta#e9536bブライト
DPmagenta#b5003cディープ
Lmagenta#f29c9fライト
DLmagenta#ba5460ダル
VPmagenta#fdedecベリーペール
DGmagenta#5f0017ダークグレイッシュ

ピンク系

THOR6桁トーン
Vpink#e4017fヴィヴィッド
Bpink#e95098ブライト
DPpink#b50165ディープ
Lpink#f29fc3ライト
DLpink#ba5584ダル
VPpink#fdeff5ベリーペール
DGpink#600033ダークグレイッシュ

パープル系

THOR6桁トーン
Vpurple#920883ヴィヴィッド
Bpurple#a54a98ブライト
DPpurple#740169ディープ
Lpurple#c490bfライト
DLpurple#8c4b82ダル
VPpurple#f3eaf4ベリーペール
DGpurple#3e0036ダークグレイッシュ

ネイビー系

THOR6桁トーン
Vnavy#1c1e84ヴィヴィッド
Bnavy#4c4398ブライト
DPnavy#14116eディープ
Lnavy#8f82bcライト
DLnavy#4e4282ダル
VPyellow#e8e6f3ベリーペール
DGnavy#08003aダークグレイッシュ

ブルー系

THOR6桁トーン
Vblue#0068b7ヴィヴィッド
Bblue#2b71b8ブライト
DPblue#005293ディープ
Lblue#87abdaライト
DLblue#3970a2ダル
VPblue#e9eef9ベリーペール
DGblue#00274fダークグレイッシュ

スカイ系

THOR6桁トーン
Vsky#00a0e9ヴィヴィッド
Bsky#00b0ecブライト
DPsky#0081baディープ
Lsky#7ecff5ライト
DLsky#1894beダル
VPsky#eaf6feベリーペール
DGsky#004462ダークグレイッシュ

ターコイズ系

THOR6桁トーン
Vturquoise#009e96ヴィヴィッド
Bturquoise#00ada9ブライト
DPturquoise#007f78ディープ
Lturquoise#83ccc9ライト
DLturquoise#1d928fダル
VPturquoise#eaf5f4ベリーペール
DGturquoise#004340ダークグレイッシュ

グリーン系

THOR6桁トーン
Vgreen#009944ヴィヴィッド
Bgreen#0ba95fブライト
DPgreen#007c36ディープ
Lgreen#88c997ライト
DLgreen#218f59ダル
VPgreen#ebf5ebベリーペール
DGgreen#004215ダークグレイッシュ

ライム系

THOR6桁トーン
Vlime#8ec31fヴィヴィッド
Blime#a9cf52ブライト
Dlime#6f9b12ディープ
Llime#cce199ライト
DLlime#8ea953ダル
VPlime#ebf5ebベリーペール
DGlime#395104ダークグレイッシュ

モノトーン系

THOR6桁トーン
white#ffffffホワイト
VLgray#d8d8d8ベリーライトグレー
Lgray#b2b2b2ライトグレー
gray#8c8c8cグレー
Dgray#656565ダークグレー
VDgray#3f3f3fベリーダークグレー
black#191919ブラック

THE THOR(ザトール)のカラー:まとめ

当ブログでも使用しているWordPressテーマ「THE THOR(ザ・トール)」のボタンやボックス、ラベルで使用できるカラー一覧をまとめてみました。

91種類もあるのでいろいろ組み合わせることで他のブログと差別化するデザインも作れます。時間のあるときに遊びながら配色をいじるのは楽しいですよ!

 

THE THORのカラーコード91種類
最新情報をチェックしよう!