カラーパレット

カラーホイール(色相環)ツール

ホイール上の点をドラッグして色を選びましょう。配色の種類ごとに、その色と相性のいい色がすぐに表示されます。

点をドラッグするか、ホイールをタップ

この配色の色

色をタップするとHEXコードをコピーできます。

カラーホイール(色相環)とは

色を色相の順に円形に並べたものです。隣り合う色は似ていて、向かい合う色はコントラストが強くなります。デザインやインテリア、ファッションで失敗しない配色を選ぶのに役立ちます。

一次色・二次色・三次色

画面上の一次色は赤・緑・青(RGB)です。一次色を2つ混ぜると二次色のイエロー・シアン・マゼンタになります。三次色は一次色と二次色の間にある色で、オレンジや紫などです。絵の具では赤・黄・青の伝統的なモデルが使われます。

暖色と寒色

暖色は赤から黄色までの色で、元気さや親しみを感じさせます。寒色は緑から紫までの色で、落ち着きや距離感を与えます。暖色1色に寒色を数色、またはその逆を組み合わせると、バランスを保ちながらメリハリが出ます。

配色の種類

補色

ホイール上で向かい合う2色。最も強いコントラストになります。例:青 #2B6CB0 とオレンジ #DD8A2B。目立たせたいボタンに最適です。

類似色

隣り合う3色。穏やかで調和のとれた印象になります。例:緑・青緑・青。風景のような配色です。

トライアド

等間隔に並ぶ3色。鮮やかでバランスがとれています。例:子ども向けイラストの赤・黄・青。

スプリット・コンプリメンタリー

1色と、その補色の両隣の2色。コントラストはありますが、補色よりも緊張感が少なめです。例:紫に黄緑とオレンジ。

テトラード

長方形または正方形を作る4色。変化に富んだ配色です。1色をメインにして、ほかの色はアクセントに使いましょう。

よくある質問

カラーホイールの使い方は?

点をドラッグするか、HEXコードを入力してベースの色を選びます。次に配色の種類を選び、下に表示された色をコピーします。

色相環で相性のいい色は?

向かい合う色(補色)はコントラストが生まれ、隣り合う色(類似色)はなじみ、三角形を作る色(トライアド)はバランスよくまとまります。

なぜ赤が一番上にあるのですか?

最も一般的な決まりだからです。色相0°が赤で、そこから黄・緑・シアン・青・マゼンタの順に一周します。

この色はCanvaやCSSで使えますか?

はい。各色のHEXコードはタップ1回でコピーできます。パレットジェネレーターで開けば、配色をエクスポートすることもできます。

ほかのガイドとツール