すべての配色

それぞれの配色は、色相環で隣り合う色、向かい合う色、等間隔に並ぶ色など、異なるルールに基づいています。プロジェクトに合う配色を選んで、登録不要・無料でパレットを生成しましょう。

伝統的な配色から現代的な配色まで14種類を紹介。各ページで具体例、適した用途、注意点を解説します。

• モノクロマティックのカラーパレット

  1つの色相をもとに、彩度と明度を変えて作る配色です。色同士がぶつかりにくく、まとまりのある印象をすぐに作れます。

• 類似色のカラーパレット

  類似色は、色相環で隣り合う色を組み合わせる配色で、一般に30〜60度の範囲に収まります。夕焼けや森の地面のように、自然でやわらかな連続性が生まれます。

• 補色のカラーパレット

  補色は色相環の正反対、180度離れた位置にある2色です。青とオレンジ、赤と緑、紫と黄のように、強いコントラストを生みます。

• 分裂補色のカラーパレット

  ベースの色と、その補色の両隣にある2色を使う配色です。補色そのものを使う場合の強さをやわらげながら、コントラストを保てます。

• トライアドのカラーパレット

  色相環を3等分し、120度ずつ離れた3色を組み合わせる配色です。鮮やかでバランスがよく、明るい印象が生まれるため、存在感を出したいブランドに向いています。

• テトラードのカラーパレット

  長方形配色とも呼ばれるテトラードは、2組の補色を組み合わせます。伝統的な配色の中でも特に表現が豊かな一方、扱いには工夫が必要です。

• 二重補色のカラーパレット

  色相環で近接する色から、向かい合う2組を選ぶ配色です。温かみがあり、段階的に変化するパレットになり、多色グラデーションの土台として使えます。

• グラデーションのカラーパレット

  最も暗い色から最も明るい色まで、均等な段階で変化するパレットです。CSSの`linear-gradient`やデザインシステムのカラースケールを作る出発点になります。

• 自然のカラーパレット

  植物の緑、土、砂、樹皮など、屋外で目にする色から作るパレットです。毎日見慣れているため、自然に親しみを感じられます。

• 暖色・寒色のカラーパレット

  暖色と寒色を両側に、中間色を中央に置き、色の温度感で整理するパレットです。配色のルールとしてだけでなく、画面構成の道具として役立ちます。

• 感情のカラーパレット

  色相環の形ではなく、与えたい印象から考えるパレットです。信頼、緊急性、穏やかさ、高級感など、伝えたい感情に合わせて色の系統を選びます。

• Material Designのカラーパレット

  GoogleのMaterial Designの考え方に沿ったパレットです。主役のプライマリーカラー、アクセント用のセカンダリーカラー、中間色の面、文字や高さの表現に使うグレースケールで構成します。

• ヴィンテージのカラーパレット

  彩度を落とし、ベージュ、セピア、茶色に寄せたパレットです。古びた紙、1970年代のポスター、フィルム写真を思わせます。

• 季節のカラーパレット

  春のパステル、夏の鮮やかな色、秋の黄土色、冬の寒色など、季節の一場面から色を選ぶパレットです。