RGB値を入力すれば色相・彩度・明度を変化させた近似色がリアルタイムに自動生成されます。

近似色生成 カラークリエイター

ウェブデザインや各種アプリ作成でカラーを微調整したい場合に便利。RGB,HSVスライダーで色の作成も容易。

# ← ①RGB値を入力。②色を選択。③クリックボードにコピー。
R
G
B
H
S
V
基準値に設定
 コピー
コピーされました
使い方:
① RGB値を入力します。リアルタイムに反映されます。3桁または6桁。大文字小文字問いません。
例) ef46ac
例) AF4C52
例) ffe --> ffffeeとして解釈されます
例) 8A5 --> 88AA55として解釈されます

② カラーをクリックで選びます。カラーコードがボタンに表示されます。

③ ボタンクリックでカラーコードがクリップボードにコピーされます。

Safariでの注意点:
HSVスライダー操作において注意点があります。
Vがゼロの場合はHとSのスライダーはロックされます。Vをプラス方向に動かせばSのスライダーはロック解除されます。
Sがゼロの場合はHのスライダーはロックされます。Sをプラス方向に動かせばHのスライダーはロック解除されます。
RGB値の入力で、色相・彩度・明度を変化させた近似色がリアルタイムに生成されます。
ウェブデザインでアクセントカラーは決まっているがテキストだけ微妙に色を濃くしたいなどの微調整にいかがでしょうか?
その他さまざまな用途にて、もう少し濃くしたい、薄くしたい、明るくしたい、暗くしたい、派手にしたい、落ち着かせたいなど、こだわりの色調整が出来ます。
入力したオリジナル色と比較して表示されますので色の選択が容易。
テキスト見栄えの判断も出来るように、白色、黒色のテキストも配置しました。
これが有れば微妙な色調整のためだけにPhotoshopを開くなどの手間が無くなります。
ウェブデザインだけでなく、AndoroidアプリやiOSアプリ、Windowsアプリの色選定にも重宝する事でしょう。
出力される色コードは大文字と小文字の両方に対応しました。どちらでも選んでいただけます。CSS記述のこだわりや統一化でストレスなくお使いいただけます。
色相は前後範囲は360度ありますので、上限下限に達する事は有りませんが、彩度と明度は調整範囲の上限下限に達する事があり、その場合はチャートに同じ色が並びます。
オリジナル色からの変更値が数値で表示されていますので色の選択時にご留意ください。
色をゼロから生成できるようにRGB,HSVスライダーを装備しました。直感的に操作して色を作成できます。
HSVと表示していますが、HSBも基本的に同じです。
HSVは色相(Hue)・彩度(Saturation)・明度(Value)です。
HSBは色相(Hue)・彩度(Saturation)・明度(Brightness)です。
動作環境(2022-09-11時点)
・Google Chrome 105
・Microsoft Edge 105
・Mozilla Firefox 104
・Apple Safari 15.6 --- 使用できますが、スライダーが特定の位置でロックされてしまう場合があります。他のスライダーを動かせば復帰します。
2017年10月初版
このサイトについてのお問い合わせはエーオーシステムまでお願いいたします。
ご使用上の過失の有無を問わず、本プログラムの運用において発生した損害に対するいかなる請求があったとしても、その責任を負うものではありません。