現在WordPressテーマとサイト設計を見直しています。サイト内に未整備箇所がありますが、ご了承ください。

『THE THOR』のカラーコード一覧(チャート型色見本)

WordPressテーマ『THE THOR(ザ・トール)』には多彩なプリセットカラーが用意されているんですが・・・

THE THOR カラー

↑これ、ちょっと使いにくくないですか?💦

リスト階層が深くてちょっとめいんどくさいのもそうなんですが
「オレンジにしたいんだけど、ヴィヴィッドトーンとブライトトーンどっちがいいかな?」
なんてときには、一度適用してみて確認しないといけないので手間がかかります。

「カラーチャートのようなもので、一覧比較できたらわかりやすいのに」
と思ったので、自分で作ってみました。

全色比較

トーンとカラーを比較しやすいよう一覧表にしました。
モノトーン(白や黒)は除外してあります。

←スクロールできます→

ヴィヴィッドトーン ブライトトーン ディープトーン ライトトーン ダルトーン ベリーペールトーン ダークグレイッシュトーン
イエロー Vyellow
#fff100
Byellow
#fff338
DPyellow
#cbbd00
Lyellow
#fff89a
DLyellow
#cac04e
VPyellow
#fffded
DGyellow
#675f00
イエロー
オレンジ Vorange
#f49801
Borange
#f6ad3a
DPorange
#bf7601
Lorange
#fbce8a
DLorange
#c39043
VPorange
#fef5e8
DGorange
#633c00
オレンジ
レッド Vred
#e60112
Bred
#ea5532
DPred
#b60105
Lred
#f39c76
DLred
#ba5536
VPred
#feede3
DGred
#5f0100
レッド
マゼンタ Vmagenta
#e5004f
Bmagenta
#e9536b
DPmagenta
#b5003c
Lmagenta
#f29c9f
DLmagenta
#ba5460
VPmagenta
#fdedec
DGmagenta
#5f0017
マゼンタ
ピンク Vpink
#e4017f
Bpink
#e95098
DPpink
#b50165
Lpink
#f29fc3
DLpink
#ba5584
VPpink
#fdeff5
DGpink
#600033
ピンク
パープル Vpurple
#920883
Bpurple
#a54a98
DPpurple
#740169
Lpurple
#c490bf
DLpurple
#8c4b82
VPpurple
#f3eaf4
DGpurple
#3e0036
パープル
ネイビー Vnavy
#1c1e84
Bnavy
#4c4398
DPnavy
#14116e
Lnavy
#8f82bc
DLnavy
#4e4282
VPnavy
#e8e6f3
DGnavy
#08003a
ネイビー
ブルー Vblue
#0068b7
Bblue
#2b71b8
DPblue
#005293
Lblue
#87abda
DLblue
#3970a2
VPblue
#e9eef9
DGblue
#00274f
ブルー
スカイ Vsky
#00a0e9
Bsky
#00b0ec
DPsky
#0081ba
Lsky
#7ecff5
DLsky
#1894be
VPsky
#eaf6fe
DGsky
#004462
スカイ
ターコイズ Vturquoise
#009e96
Bturquoise
#00ada9
DPturquoise
#007f78
Lturquoise
#83ccc9
DLturquoise
#1d928f
VPturquoise
#eaf5f4
DGturquoise
#004340
ターコイズ
グリーン Vgreen
#009944
Bgreen
#0ba95f
DPgreen
#007c36
Lgreen
#88c997
DLgreen
#218f59
VPgreen
#ebf5eb
DGgreen
#004215
グリーン
ライム Vlime
#8ec31f
Blime
#a9cf52
DPlime
#6f9b12
Llime
#cce199
DLlime
#8ea953
VPlime
#f2f7e5
DGlime
#395104
ライム
ヴィヴィッドトーン ブライトトーン ディープトーン ライトトーン ダルトーン ベリーペール ダークグレイッシュトーン

←スクロールできます→

 

カラートーンごとの比較

トーンごとのカラー一覧も掲載しておきます。

ヴィヴィッドトーン

色名 CSSクラス名 RGBカラーコード
イエロー Vyellow #fff100
オレンジ Vorange #f49801
レッド Vred #e60112
マゼンタ Vmagenta #e5004f
ピンク Vpink #e4017f
パープル Vpurple #920883
ネイビー Vnavy #1c1e84
ブルー Vblue #0068b7
スカイ Vsky #00a0e9
ターコイズ Vturquoise #009e96
グリーン Vgreen #009944
ライム Vlime #8ec31f

 

ブライトトーン

色名 CSSクラス名 RGBカラーコード
イエロー Byellow #fff338
オレンジ Borange #f6ad3a
レッド Bred #ea5532
マゼンタ Bmagenta #e9536b
ピンク Bpink #e95098
パープル Bpurple #a54a98
ネイビー Bnavy #4c4398
ブルー Bblue #2b71b8
スカイ Bsky #00b0ec
ターコイズ Bturquoise #00ada9
グリーン Bgreen #0ba95f
ライム Blime #a9cf52

 

ディープトーン

色名 CSSクラス名 RGBカラーコード
イエロー DPyellow #cbbd00
オレンジ DPorange #bf7601
レッド DPred #b60105
マゼンタ DPmagenta #b5003c
ピンク DPpink #b50165
パープル DPpurple #740169
ネイビー DPnavy #14116e
ブルー DPblue #005293
スカイ DPsky #0081ba
ターコイズ DPturquoise #007f78
グリーン DPgreen #007c36
ライム DPlime #6f9b12

 

ライトトーン

色名 CSSクラス名 RGBカラーコード
イエロー Lyellow #fff89a
オレンジ Lorange #fbce8a
レッド Lred #f39c76
マゼンタ Lmagenta #f29c9f
ピンク Lpink #f29fc3
パープル Lpurple #c490bf
ネイビー Lnavy #8f82bc
ブルー Lblue #87abda
スカイ Lsky #7ecff5
ターコイズ Lturquoise #83ccc9
グリーン Lgreen #88c997
ライム Llime #cce199

 

ダルトーン

色名 CSSクラス名 RGBカラーコード
イエロー DLyellow #cac04e
オレンジ DLorange #c39043
レッド DLred #ba5536
マゼンタ DLmagenta #ba5460
ピンク DLpink #ba5584
パープル DLpurple #8c4b82
ネイビー DLnavy #4e4282
ブルー DLblue #3970a2
スカイ DLsky #1894be
ターコイズ DLturquoise #1d928f
グリーン DLgreen #218f59
ライム DLlime #8ea953

 

ベリーペールトーン

色名 CSSクラス名 RGBカラーコード
イエロー VPyellow #fffded
オレンジ VPorange #fef5e8
レッド VPred #feede3
マゼンタ VPmagenta #fdedec
ピンク VPpink #fdeff5
パープル VPpurple #f3eaf4
ネイビー VPnavy #e8e6f3
ブルー VPblue #e9eef9
スカイ VPsky #eaf6fe
ターコイズ VPturquoise #eaf5f4
グリーン VPgreen #ebf5eb
ライム VPlime #f2f7e5

 

ダークグレイッシュトーン

色名 CSSクラス名 RGBカラーコード
イエロー DGyellow #675f00
オレンジ DGorange #633c00
レッド DGred #5f0100
マゼンタ DGmagenta #5f0017
ピンク DGpink #600033
パープル DGpurple #3e0036
ネイビー DGnavy #08003a
ブルー DGblue #00274f
スカイ DGsky #004462
ターコイズ DGturquoise #004340
グリーン DGgreen #004215
ライム DGlime #395104

 

モノトーン

色名 CSSクラス名 RGBカラーコード
イエロー white #ffffff
オレンジ VLgray #d8d8d8
レッド Lgray #b2b2b2
マゼンタ gray #8c8c8c
ピンク Dgray #656565
パープル VDgray #3f3f3f
ネイビー black #191919

 

お役に立てますと幸いです。

 

PR
THE THOR カラーコード一覧 色見本
最新情報をチェックしよう!