このツールについて
赤・緑・青の3成分を6桁のHEXカラーに変換するツールです。大文字・小文字を選択でき、RGB形式と実際の色も同時に確認できます。
使い方
- R・G・Bをそれぞれ0～255の整数で入力します。
- 必要に応じて「HEXを大文字で出力」を切り替えます。
- 自動更新される結果を確認するか、「変換」をクリックしてHEXをコピーします。
- 「リセット」で初期状態に戻すか、サンプルを読み込んで比較します。
使用例
- R 255、G 87、B 51 → #ff5733。大文字出力を選ぶと#FF5733になります。
- R 0、G 0、B 0 → #000000。
- R 255、G 255、B 255 → #ffffff。
計算の仕組み
各成分を2桁の16進数に変換し、1桁の場合は先頭に0を補います。これらをR・G・Bの順につなぎます。大文字・小文字によって色が変わることはありません。範囲外の値、空欄、小数はエラーとして扱い、300を自動的に255に補正することはありません。
主な用途
- 描画・画像編集ソフトのRGB値をCSSで使う。
- プロジェクト内の色コードの大文字・小文字を統一する。
- 手入力した3つの成分が有効な範囲内にあるか確認する。
プライバシーについて
入力、計算、CSSの生成、プレビューはすべてお使いのブラウザー内で完結します。入力内容をアップロードせず、バックエンド、データベース、オンラインAPI、外部CDNも使用しません。入力の自動保存も行いません。
FAQ
RGBの範囲が0～255なのはなぜですか？
一般的な8 bitのsRGB成分を使用しているためです。各成分には0～255の256段階があります。
12.5や256は入力できますか？
いいえ。各成分は0～255の整数で入力する必要があります。無効な値にはエラーを表示します。
HEXの大文字と小文字に違いはありますか？
#FF5733と#ff5733は同じ色を表します。プロジェクトのコード規約に合わせて選べます。
成分の先頭に0が付くのはなぜですか？
各成分を必ず2桁で表すためです。例えば9は09と記述し、後ろの成分の位置がずれないようにします。