使い方（How to use）
1. ベースカラーを選ぶ
画面下の 「Base Color」（カラーピッカー）から、好きな色を選びます。
選んだ色をもとに、相性の良い 3色パレットが自動で表示されます。
2. 目的に合う配色パターンを選ぶ
表示されるパレットは、色の組み合わせ方（配色理論）ごとに分かれています。
「どれを使えばいい？」の目安は以下です。
- Analogous（類似色）
迷ったらまずこれ。まとまりやすく、サイト全体が上品に整います。
例：背景・カード・見出し色など - Complementary（補色 + α）
強調したい場所がある時に。ボタンや重要ポイントが目立ちます。
例：CTAボタン、価格、重要ラベル - Triad（トライアド）
ポップで元気な印象にしたい時に。イベントやサムネ向き。
例：タイトル・アイコン・装飾の3点使い - Split Complementary（分裂補色）
メリハリは欲しいけど、補色ほど強くしたくない時に。
例：ボタン色＋補助色（タグ/通知） - Monochromatic（同一色相）
資料やUIを「きれいに整える」鉄板。落ち着いた印象になります。
例：背景（薄）→面（中）→文字/強調（濃）
3. 色コードをコピーして使う
各色の HEX / RGB / CMYK を、コピーボタンからコピーしてそのまま使えます。
使うときのコツ（3色がきれいに見える使い方）
- 3色を同じ割合で使うより、
背景：70% / サブ：25% / アクセント：5% くらいが一番きれいにまとまります。 - 「派手に感じる」場合は、アクセント色の面積を小さくするのがコツです。
類似色（Analogous Colors）とは？
類似色（Analogous Colors）とは、色相環で隣り合う、または近い位置にある色の組み合わせのことで、赤とオレンジ、緑と青など、互いに似た要素を持つため、統一感と安定感、調和の取れた穏やかな印象を与える配色です。自然界にも多く見られ（紅葉、海と空など）、落ち着いた雰囲気や優しい雰囲気を出したい場合、ウェブデザインやブランドイメージなどで効果的に使われます。
さらに詳しく
補色（complementary color）とは？
補色（complementary color）とは、色相環（カラーサークル）で正反対に位置する色の組み合わせのことで、互いに引き立て合い、強い対比効果を生み出します。赤と緑、青とオレンジ、黄色と紫などが代表例で、これらを組み合わせることで視覚的なインパクトや調和、強調の効果が得られますが、使いすぎると目に刺激が強くなることもあります。
さらに詳しく
トライアド（Triad）配色とは？
トライアド（Triad）配色は、色相環上で正三角形を描くように配置された3色（120度間隔）を使った配色のことで、赤・青・黄色や緑・紫・オレンジのように、バランスが取れていて鮮やかで視覚的に豊か、ダイナミックな印象を与え、デザインに活用されています。
さらに詳しく
Split Complementary (分裂補色)とは？
分裂補色（スプリットコンプリメンタリー）とは、基準となる色と、その補色（色相環で正反対の色）の両隣にある2色を組み合わせる3色の配色方法です。補色配色（対照的な強いインパクト）の持つコントラストを保ちつつ、補色同士のちらつき（ハレーション）を抑え、より柔らかく調和の取れた印象を与えることができるのが特徴で、デザイン初心者にも扱いやすい配色とされます。
さらに詳しく
Monochromatic（同一色相）とは？
分裂補色（スプリットコンプリメンタリー）とは、基準となる色と、その補色（色相環で正反対の色）の両隣にある2色を組み合わせる3色の配色方法です。補色配色（対照的な強いインパクト）の持つコントラストを保ちつつ、補色同士のちらつき（ハレーション）を抑え、より柔らかく調和の取れた印象を与えることができるのが特徴で、デザイン初心者にも扱いやすい配色とされます。