web-dev-qa-db-ja.com

RGBAをHEXに変換

次のようなCSSカラー値が与えられた場合：

 rgba(0, 0, 0, 0.86)

白い背景を想定して、アルファ成分を考慮に入れたRGB 16進値に変換するにはどうすればよいですか？

htmlcsscolorshexrgba
24
Michael Böckling

アルファ値は背景色と色値の両方を減衰させるため、次のような方法でトリックを実行できます。

function rgba2rgb(RGB_background, RGBA_color)
{
    var alpha = RGBA_color.a;

    return new Color(
        (1 - alpha) * RGB_background.r + alpha * RGBA_color.r,
        (1 - alpha) * RGB_background.g + alpha * RGBA_color.g,
        (1 - alpha) * RGB_background.b + alpha * RGBA_color.b
    );
}

（インタラクティブに試してください： http://marcodiiga.github.io/rgba-to-rgb-conversion ）

44
Marco A.

rgbを16進数に変換するだけの場合は、.toString(16)を使用して赤、緑、青を個別に変換し、結果をケースに結合できます...次の Fiddle で行ったように、rgbaをrgbに変換してから16進数に変換すると、parentdivの_background-color_も考慮されます。

0
Green Wizard

値がチャネルごとに0 ... 1であると仮定します。そして、質問のメソッド/関数呼び出しの略語が引数に対応すると仮定すると、次のように動作するはずです。

A = 255 * 0.86
R = 255 * 0
G = 255 * 0
B = 255 * 0

色が不正確になる可能性があるため、ここでの丸め方法を変更する必要がある場合があります。

この時点では、値は実際にはまだ浮動小数点値ですが、理論的にはバイトまたは文字（言語に応じて）にキャストする必要があります。

var _A = (byte)219.3
var _R = (byte)0
var _G = (byte)0
var _B = (byte)0

今やらなければならないのは、それらをそれぞれ16進文字列に変換し、それらを連結して（ARGB）、ニースの小さなハッシュタグを前に置くことです（＃）

C＃では、次のようなことができます。

var hexString = string.Format("#{0:X2}{1:X2}{2:X2}{3:X2}", _A, _R, _G, _B);

次のような最終結果が得られます。

#DB000000
0
t0yk4t