カラーホイール でできること
始める前に、主な機能を確認してください。
- 補色や類似の配色を検討する
- 三和音、四和音、二乗和音を見つける
- 一致するすべての色の 16 進数コードをコピーします
- 彩度と明度をライブで微調整
- デザインパレットのベースカラーを選択してください
設定リファレンス
5 設定
カラーホイール で使用可能なコントロール。
オプション
- ベースカラー(色相と彩度)カラーピッカー
- 操作できるカラーホイールの好きな場所をドラッグして、起点となる色を選びます。角度で色相が、中心からの距離で彩度が決まります。
- HEX / CSSカラーテキスト入力
- HEXコード、rgb()、hsl()、CSSの色名を入力または貼り付けると、すでに決まっている色にカラーホイールを直接合わせられます。
- 彩度スライダーレンジ: 0–100% · デフォルト: 91%
- ベースカラーの鮮やかさを調整します。0% では完全なグレー、100% ではその色相のもっとも純粋で鮮烈な色になります。
- 明度スライダーレンジ: 0–100% · デフォルト: 60%
- ベースカラーの明るさを調整します。0%の黒から純色を経て100%の白まで変化し、すべてのカラーハーモニーがそれに合わせて更新されます。
- ハーモニープリセット
- 色相環上で強調する古典的な配色関係を選びます。関連する色の位置にマーカーが表示され、配色の成り立ちがひと目で分かります。オプション: 補色スプリットコンプリメンタリー類似色トライアド(三色配色)テトラード(矩形)正方形
無料で利用可能 · 登録不要 · 透かしなしアップロードは転送中に暗号化されます保持ポリシーに基づいて削除されました
カラーホイール の関連ツール
カラーホイール の後の一般的な次のステップのためのツール。
よくある質問
カラーホイールでできること
ビジネス、クリエイター、日常業務など、実際の問題を毎日解決します。自分に合ったユースケースを見つけて始めましょう。
学歴
色彩理論を学ぶ
選んだ基準色から、定番の配色パターンをすべてリアルタイムで確認できます。それぞれの配色がいつ・なぜ効果的なのか、わかりやすい説明付きです。
クリエイター向け
ウェブサイトのアクセントカラーを選ぶ
ブランドカラーのHEXコードをカラーホイールに入力し、スプリットコンプリメンタリーやトライアド配色を使って、ぶつかり合わずに引き立つアクセントカラーを見つけましょう。
クリエイター向け
実際のUIでカラースキームをプレビュー
各配色パターンは、ヘッダー・本文・ボタン・ドットで構成された小さなサンプルカードに適用されるので、単なる色見本としてではなく、実際の使用イメージに近い形で組み合わせを確認できます。
クリエイター向け
アート・イラスト向けパレット
自然で落ち着いた雰囲気にはアナロガス配色を、印象的な焦点を作りたい場合は補色を使い、正確なHEXコードをそのままお絵描きアプリにコピーしましょう。
変換結果を一つずつ確認
すべての写真はスラッシュをそのまま通過し、反対側が完成して出てきます。


























