カラーホイール・補色ツール
好きな色を1色選ぶと、HSL色相環上の補色・類似色・トライアドをすぐ確認できます。HEXをコピーして、配色やWeb制作にそのまま使えます。
このツールの「補色」について
ここではWebで扱いやすいHSL色相環上で180°反対の色を補色候補として表示します。PCCS・マンセル・知覚的補色など、色体系によって厳密な補色位置は異なります。
#FF0000
#00FFFF
#FF0080
#FF8000
#00FF00
#0000FF
よく調べられる色
赤・青・黄・紫・ピンク・緑の補色をすぐ確認
ここで表示する補色は、このツールと同じくHSL色相環上で180°反対の色です。PCCS・マンセル・RGB加法混色など、色体系によって補色関係は異なります。
使い方
カラーホイールの使い方
目的別
補色・類似色・3色配色の使い分け
強い色相差を作りたいときに使います。アクセントや視線誘導に向いています。
近い色相でまとめたいときに使います。穏やかで統一感のある配色になりやすいです。
色相環を3方向に分けた3色配色です。華やかさを出したいときに使えます。
FAQ
カラーホイール・補色についてよくある質問
カラーホイールとは何ですか？
色相を円状に並べ、近い色・反対側の色などの関係を視覚的に確認するための図です。日本語では色相環とも呼ばれます。
補色を調べるにはどうすればいいですか？
このツールでは基準色を選ぶと、HSL色相環上で180°反対にある色を補色候補として表示します。
補色と反対色は同じですか？
日常的には近い意味で使われますが、厳密には色体系や文脈によって扱いが異なる場合があります。
補色を組み合わせるとどうなりますか？
色相差が大きいため互いを目立たせやすくなります。面積や彩度を調整しないと刺激が強くなることもあります。
カラーホイールは無料で使えますか？
はい。色しるべのこのツールはブラウザ上で利用できます。
RESEARCHER LENS
公開研究から、このテーマを深掘りする
研究者本人の監修ではなく、公開論文・研究資料を色しるべ側で整理した研究環境です。研究条件とサイト側の分析を分けて確認できます。
COLOR SCHEME NAVI
配色を「読む・見る・作る」でつなげる
考え方を理解したら、2〜5色の実例や補色を確認し、そのまま配色ラボで試せます。