影色・明色の色見本
基準色に白・黒を混ぜた5段階の色見本とカラーコードを作ります。
使い方
- 基準色を選び、両端の色へどの程度の白・黒を混ぜるか指定します。
- 左から濃い2色・元の色・明るい2色を確認し、コードをコピーします。
- 文字や線の色に使う場合は、実際の背景とのコントラストを確認します。
このツールが向いている作業
同じ基準色から、背景に使う薄い色や線に使う濃い色を作ります。別の色相を探す配色パレットと違い、白と黒を混ぜる量を変えて5段階を比較します。
入力と設定
結果
入力例と実際の出力
- 基準色: #808080
- 最大の混合率（%）: 100
出力例: #000000 #404040 #808080 #c0c0c0 #ffffff
例の左端は黒、中央は元のグレー、右端は白です。内側の2色は最大混合率の半分で計算します。sRGBの値を混ぜる方式なので、知覚上の明るさが等間隔になる配色ではありません。
仕様と注意点
sRGBの各成分を直線的に混ぜます。物理的な光や絵の具の混色を再現するものではありません。
次の作業・使い分け
基準色から配色づくり — 明暗ではなく、色相の違う候補を探したい場合に使えます。
よくある質問
混合率0%ではどうなりますか？
白も黒も混ぜないため、5色とも基準色と同じになります。
絵の具や光の混色と同じですか？
同じではありません。画面上のsRGB成分を数値で混ぜた色見本です。印刷用のCMYK変換も行いません。
内側の2色にはどの混合率を使いますか？
指定した最大混合率の半分を使います。中央は基準色、両端は指定した最大混合率で白・黒を混ぜた色です。
関連ツール
ツールを紹介
ツール名と公開URLだけを共有します。入力した内容や処理結果は含まれません。