HEXから正規化RGBへの変換ツール
WebGL、GLSLシェーダー、3Dグラフィックスで使うために、HEXカラーを正規化RGB浮動小数点値(0.0–1.0)に変換します。
このツールは役に立ちましたか？
ありがとうございます。ツールの改善に役立てます。
このツールの使い方
- HEXカラーを入力してください(例:#3a86ff)。
- 各チャンネルを255で割ることで[0.0, 1.0]の浮動小数点数になります。
- vec3()の出力をそのままGLSLシェーダーコードに貼り付けてください。
WebGL、GLSLシェーダー、多くの3D APIは、RGBを[0, 1]範囲の浮動小数点数として扱います。HEXカラーを入力すると、正規化されたvec3表現が瞬時に得られます。
計算式
Given a hex color #RRGGBB, each normalized float channel is:
Rn = parseInt(RR, 16) / 255
Gn = parseInt(GG, 16) / 255
Bn = parseInt(BB, 16) / 255
Each result is rounded to 4 decimal places. The GLSL vec3 form is: vec3(Rn, Gn, Bn).
よくある質問
- なぜWebGLは0–1の範囲を使うのですか?
- OpenGLとWebGLは全体を通して正規化デバイス座標で動作します。カラー成分に0–1を使うことはこの設計と一貫しており、整数オーバーフローを避けられます。
- GLSLのvec3とは何ですか?
- GLSLのvec3は三成分の浮動小数点ベクトルです。シェーダーでは、vec3(r,g,b)がRGBカラーを表します。