RGB ⇒ HSV
HSV ⇒ RGB
HSV（色相・彩度・明度）を入力
°
%
%
RGB / HEX 変換結果
Preview
SAMPLE TEXT
HEX (カラーコード)
#FFFFFF
R
255
G
255
B
255
CSS / プログラム用書式
このツールは、色相（H）・彩度（S）・明度（V）の数値を入力するだけで、WEB制作やプログラムで必要なRGB値やカラーコード（HEX）へ瞬時に変換できる無料ツールです。
このツールでできること
- HSVからRGB・HEXへの即時変換: スライダーや数値入力を用いて、HSV値をWEB標準のRGBおよびHEX形式へリアルタイムに変換します。
- カラーコードの同時取得: デザインツールで多用される「#」から始まる6桁のHEXコード（16進数カラーコード）も同時に出力します。
- プレビューと視認性の確認: 変換後の色を大きなプレビュー画面で確認できます。背景色に合わせて文字色が自動調整されるため、実際の視認性をシミュレーション可能です。
- コピー機能で作業を効率化: 変換されたHEXコードやRGBのCSS書式（rgb(255, 255, 255)など）をボタン一つでコピーし、そのままコードに貼り付けられます。
このツールで取得する情報の基礎知識
- HSV（色相・彩度・明度）: 人間の感覚に近い色の表現方法です。
- H（Hue/色相）: 赤・黄・緑・青といった「色の種類」を0～360度の角度で表します。
- S（Saturation/彩度）: 「色の鮮やかさ」を0～100%で表します。数値が低いと無彩色（灰色）に近づきます。
- V（Value/明度）: 「色の明るさ」を0～100%で表します。数値が低いと黒色に近づきます。
- RGB（赤・緑・青）: 光の三原色であるRed、Green、Blueを組み合わせた表現方法です。各色は0～255の数値で指定され、ディスプレイ等の電子機器で色が合成される際の基準となります。
- HEX（カラーコード）: RGBの数値を16進数に変換し、「#FFFFFF」のように6桁の英数字で表記したものです。WEBデザインにおける最も一般的な色指定方法です。
このツールが役立つときはどんなとき？
- デザイン案をWEBコードに落とし込むとき: デザインソフト（PhotoshopやFigmaなど）で調整したHSV値を、コーディングに必要なRGBやHEX値に変換したい場合に最適です。
- 色のバリエーションを作成するとき: 「同じ色相で明るさだけを変えた色（トーン）」をHSVで作成し、その正確なRGB値をプログラムで使用したいときに便利です。
- プログラムでの動的な色指定: ゲーム開発や動的なWEBグラフィックスなどで、数式的に色の変化（虹色のループなど）を計算し、最終的な出力値としてRGBを取得したい際に役立ちます。
HSVをRGBに変換するメリット
HSVは「鮮やかさを半分にする」「明るさを少し上げる」といった直感的な操作に適していますが、ブラウザやディスプレイが色を出力するためには、最終的にRGB形式のデータが必要になります。
このツールを使用することで、人間が考えた理想の色（HSV）を、システムが理解できる正確な形式（RGB/HEX）へとスムーズに橋渡しすることができます。
