使い方
- カラーピッカーで色を選ぶか、HEXコードを入力します。
- RGB・HSL・CMYKの値と、明るさの目安が表示されます。
表示された値は、CSSにそのまま書ける形式（rgb(…)、hsl(…)）で表示されます。
各形式の特徴
| 形式 | 表し方 | 主な用途 |
|---|---|---|
| HEX | #2563EB | Webサイト・アプリの色指定 |
| RGB | rgb(37, 99, 235) | 画面表示の色、透明度付きの指定 |
| HSL | hsl(221, 83%, 53%) | 色相・彩度・明度を直感的に調整したいとき |
| CMYK | 84% 58% 0% 8% | 印刷物の色の目安 |
色選びに役立つポイント
- HSLは明度（L）の数値だけを変えると、同じ色味の濃淡を簡単に作れます
- 明るさの目安が「明るい」色の上には黒い文字、「暗い」色の上には白い文字を載せると読みやすくなります
よくある質問
HEXとRGBは何が違う？
どちらも赤・緑・青の強さで色を表しますが、書き方が違います。RGBは0〜255の数字3つ、HEXは同じ値を16進数2桁ずつで「#」の後ろに並べたものです。例えば rgb(37, 99, 235) は #2563EB になります。
表示されたCMYKで印刷すれば、画面と同じ色になりますか？
同じにはなりません。このツールのCMYKは計算式による簡易的な変換で、印刷所の用紙やインク（カラープロファイル）は考慮していません。印刷する場合は、入稿先の指定に従って確認してください。
3桁のHEXコード（#FFF など）は使えますか？
現在は6桁（#RRGGBB）の入力のみに対応しています。#FFF は #FFFFFF のように各桁を2回ずつ書いて入力してください。