WordPressテーマ「THE THOR」で使用できるカラー91種類の『6桁のカラーコード』と『THE THOR専用カラーコード』を紹介していきます。
今回はナオログでも使用しているWordPressテーマ「THE THOR」のカラーコードを紹介していきます。
専用のカラーコードと6桁のカラーコードもあわせて紹介していくのでブログのデザインを統一するときなどにつかってください。
記事の前半で「THE THOR専用のカラーコードの使い方」と「6桁のカラーコードの使い方」を紹介し、後半で「THE THORで使用できるカラーコード一覧」を紹介していきます。
THE THOR（ザ・トール）専用のカラーコードの使い方
まずはTHE THOR専用のカラーコードをどのように使っていくのかを紹介していきますね。
下のボックスを例に説明していきます。
コードはこんな感じです。
<div class="ep-box bgc-VPsky ftc-Vred brc-DGblue es-borderSolidM es-radius es-Bicon icon-new">NEWボックス</div>
このボックスをつくるためには3色のカラーコードを使っています。
| 位置を表すコード | カラーコード | |
|---|---|---|
| 外枠色 | brc | DGblue |
| 背景色 | bgc | VPsky |
| 文字色 | ftc | Vred |
THE THORのボックスは位置を指定するコードとカラーコードを組み合わせることで作成できます。
6桁のカラーコードの使い方
6桁のカラーコードは、カスタマイズ画面で設定するブログ全体の背景色や見出しカラーなどに使うことができます。
【 例 】
外観
▼
カスタマイズ
▼
基本設定
▼
基本スタイル設定
「見出し」や「背景」と「ボックス」の色を合わせておくとブログに統一感が出るのでいろいろ組み合わせてみましょう！
THE THOR（ザ・トール）のカラー一覧
ここからはTHE THOR（ザ・トール）で使用できるカラーコードをまとめていきますね。
イエロー系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vyellow | #fff100 | ヴィヴィッド | |
| Byellow | #fff338 | ブライト | |
| DPyellow | #cbbd00 | ディープ | |
| Lyellow | #fff89a | ライト | |
| DLyellow | #cac04e | ダル | |
| VPyellow | #fffded | ベリーペール | |
| DGyellow | #675f00 | ダークグレイッシュ |
オレンジ系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vorange | #f49801 | ヴィヴィッド | |
| Borange | #f6ad3a | ブライト | |
| DPorange | #bf7601 | ディープ | |
| Lorange | #fbce8a | ライト | |
| DLorange | #c39043 | ダル | |
| VPorange | #fef5e8 | ベリーペール | |
| DGorange | #633c00 | ダークグレイッシュ |
レッド系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vred | #e60112 | ヴィヴィッド | |
| Bred | #ea5532 | ブライト | |
| DPred | #b60105 | ディープ | |
| Lred | #f39c76 | ライト | |
| DLred | #ba5536 | ダル | |
| VPred | #feede3 | ベリーペール | |
| DGred | #5f0100 | ダークグレイッシュ |
マゼンタ系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vmagenta | #e5004f | ヴィヴィッド | |
| Bmagenta | #e9536b | ブライト | |
| DPmagenta | #b5003c | ディープ | |
| Lmagenta | #f29c9f | ライト | |
| DLmagenta | #ba5460 | ダル | |
| VPmagenta | #fdedec | ベリーペール | |
| DGmagenta | #5f0017 | ダークグレイッシュ |
ピンク系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vpink | #e4017f | ヴィヴィッド | |
| Bpink | #e95098 | ブライト | |
| DPpink | #b50165 | ディープ | |
| Lpink | #f29fc3 | ライト | |
| DLpink | #ba5584 | ダル | |
| VPpink | #fdeff5 | ベリーペール | |
| DGpink | #600033 | ダークグレイッシュ |
パープル系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vpurple | #920883 | ヴィヴィッド | |
| Bpurple | #a54a98 | ブライト | |
| DPpurple | #740169 | ディープ | |
| Lpurple | #c490bf | ライト | |
| DLpurple | #8c4b82 | ダル | |
| VPpurple | #f3eaf4 | ベリーペール | |
| DGpurple | #3e0036 | ダークグレイッシュ |
ネイビー系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vnavy | #1c1e84 | ヴィヴィッド | |
| Bnavy | #4c4398 | ブライト | |
| DPnavy | #14116e | ディープ | |
| Lnavy | #8f82bc | ライト | |
| DLnavy | #4e4282 | ダル | |
| VPyellow | #e8e6f3 | ベリーペール | |
| DGnavy | #08003a | ダークグレイッシュ |
ブルー系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vblue | #0068b7 | ヴィヴィッド | |
| Bblue | #2b71b8 | ブライト | |
| DPblue | #005293 | ディープ | |
| Lblue | #87abda | ライト | |
| DLblue | #3970a2 | ダル | |
| VPblue | #e9eef9 | ベリーペール | |
| DGblue | #00274f | ダークグレイッシュ |
スカイ系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vsky | #00a0e9 | ヴィヴィッド | |
| Bsky | #00b0ec | ブライト | |
| DPsky | #0081ba | ディープ | |
| Lsky | #7ecff5 | ライト | |
| DLsky | #1894be | ダル | |
| VPsky | #eaf6fe | ベリーペール | |
| DGsky | #004462 | ダークグレイッシュ |
ターコイズ系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vturquoise | #009e96 | ヴィヴィッド | |
| Bturquoise | #00ada9 | ブライト | |
| DPturquoise | #007f78 | ディープ | |
| Lturquoise | #83ccc9 | ライト | |
| DLturquoise | #1d928f | ダル | |
| VPturquoise | #eaf5f4 | ベリーペール | |
| DGturquoise | #004340 | ダークグレイッシュ |
グリーン系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vgreen | #009944 | ヴィヴィッド | |
| Bgreen | #0ba95f | ブライト | |
| DPgreen | #007c36 | ディープ | |
| Lgreen | #88c997 | ライト | |
| DLgreen | #218f59 | ダル | |
| VPgreen | #ebf5eb | ベリーペール | |
| DGgreen | #004215 | ダークグレイッシュ |
ライム系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| Vlime | #8ec31f | ヴィヴィッド | |
| Blime | #a9cf52 | ブライト | |
| Dlime | #6f9b12 | ディープ | |
| Llime | #cce199 | ライト | |
| DLlime | #8ea953 | ダル | |
| VPlime | #ebf5eb | ベリーペール | |
| DGlime | #395104 | ダークグレイッシュ |
モノトーン系
| THOR | 6桁 | トーン | |
|---|---|---|---|
| white | #ffffff | ホワイト | |
| VLgray | #d8d8d8 | ベリーライトグレー | |
| Lgray | #b2b2b2 | ライトグレー | |
| gray | #8c8c8c | グレー | |
| Dgray | #656565 | ダークグレー | |
| VDgray | #3f3f3f | ベリーダークグレー | |
| black | #191919 | ブラック |
THE THOR（ザトール）のカラー：まとめ
当ブログでも使用しているWordPressテーマ「THE THOR（ザ・トール）」のボタンやボックス、ラベルで使用できるカラー一覧をまとめてみました。
91種類もあるのでいろいろ組み合わせることで他のブログと差別化するデザインも作れます。時間のあるときに遊びながら配色をいじるのは楽しいですよ！
