配色の作成(補色・類似色・トライアド・テトラード・単色)
ローカル処理基準色から補色・類似色・トライアド・テトラード・単色の配色、またはランダムパレットを作ります。
使い方と処理基準
基準色から補色・類似色・トライアド・テトラード・単色の配色、またはランダムパレットを作ります。
ツールの処理はブラウザ内で行われます。計算・変換の共有リンクを作成すると値がURLに含まれます。アカウント・アクセス解析・広告の情報はプライバシーポリシーをご確認ください。
処理制限
- 最大入力文字数: 100,000文字
「作業」で配色方法を選ぶと、色相環で角度を回して合う色を計算します。彩度・明度は基準色と同じにするので、トーンの揃ったパレットになります。
ランダムパレットは作るたびに結果が変わります。
できること
- 補色
- 色相環の反対側(180°)の色です。
- 類似色・トライアド・テトラード
- ±角度、120°間隔、90°間隔で色を選びます。
- 単色の明度段階
- 同じ色の明度だけを変えた段階を作ります。
- ランダムパレット
- 規則(均等・類似・補色)とパステルかどうかを決めてランダムに作ります。
配色の作成(補色・類似色・トライアド・テトラード・単色)の使い方
- 1作業を選ぶ配色方法を選びます。
- 2基準色を入力色を選び、必要なら角度・段階数を決めます。
- 3コピーパレットの色コードをコピーします。
活用例
補色
入力: #3366cc
結果: #cc9933
トライアド
入力: #ff0000
結果: #ff0000、#00ff00、#0000ff
類似色 ±30°
入力: #3366cc
結果: #33b3cc、#3366cc、#4d33cc
明度5段階
入力: #3366cc、5段階
結果: #0a1429、#1f3d7a、#3366cc、#85a3e0、#d6e0f5
主な利用シーン
- Webサイトやスライドのアクセントカラーを決めるとき
- グラフの複数系列に合う色を選ぶとき
- ブランドカラーの明るい・暗い段階を作るとき
よくある質問 (FAQ)
補色を使えばいつも合いますか?
コントラストが強く目立ちますが、広い面積に両方を使うと重く感じます。片方をアクセントとして少しだけ使うのが一般的です。
