配色とは？
配色の黄金比率：「70 : 25 : 5」の法則
Webデザインにおいて、色を美しくかつ効果的に配置するための世界共通のルールです。
ベースカラー（Base Color）
約70%全体の大部分を占める背景や土台となる色です。
部屋で例えると：壁・天井・床など
メインカラー（Main Color）
約25%デザインの「主役」となるブランドやテーマを表現する色です。
部屋で例えると：ソファやカーテンなど
アクセントカラー（Accent Color）
約5%視線を集めたり、強調したい部分に使う一刺しの色です。
部屋で例えると：クッションや小物など
| 種類 | 割合 | 役割 |
|---|---|---|
| ベースカラー | 約70% | 土台・背景の落ち着かせ |
| メインカラー | 約25% | 主役・テーマ・世界観の表現 |
| アクセントカラー | 約5% | 強調・視線誘導・お問合せボタン |
カラーパレット
自由な色調整に加え、ランダム提案（黄金比）も試せるシミュレーター
カラーコントロール
ベースカラー (70%)
背景や余白など、サイトの大部分を占める色
#F4F1DE
メインカラー (25%)
ロゴや見出し、文章などブランドを象徴する色
#3A4D39
アクセントカラー (5%)
お問合せボタンなど、1番目立たせたい部分の色
#E07A5F
※ 各カラー枠内のコードをクリックするとコピーできます
プロの配色プリセット
リアルタイム・サイトプレビュー
SALON NAME
ホームサービスお問合せ
RECOMMEND
愛おしい今を、
愛おしい今を、
もっと心地よく。
自由なピッカー操作と、右上のランダム提案を組み合わせて使えます。
アクセシビリティ（コントラスト比）
コピーしました！