HTMLのカラーコードをRGBに変換する方法


  1. カラーコードをRGBに変換する方法(16進数を使用する場合):

    • カラーコードは通常、"#RRGGBB"という形式で表されます。RRは赤の値、GGは緑の値、BBは青の値を表します。
    • 例えば、"#FF0000"は赤色を表し、RGB値に変換すると"rgb(255, 0, 0)"となります。
    • 以下は、JavaScriptを使用してカラーコードをRGB値に変換する例です。
    function convertHexToRGB(hex) {
     var r = parseInt(hex.substring(1, 3), 16);
     var g = parseInt(hex.substring(3, 5), 16);
     var b = parseInt(hex.substring(5, 7), 16);
     return "rgb(" + r + ", " + g + ", " + b + ")";
    }
    var hexCode = "#FF0000";
    var rgbValue = convertHexToRGB(hexCode);
    console.log(rgbValue); // 結果: "rgb(255, 0, 0)"
  2. カラーコードをRGBに変換する方法(RGB値を使用する場合):

    • カラーコードは、"rgb(R, G, B)"という形式でも表すことができます。Rは赤の値、Gは緑の値、Bは青の値を表します。
    • 例えば、"rgb(255, 0, 0)"は赤色を表します。
    • 以下は、JavaScriptを使用してカラーコードをRGB値に変換する例です。
    function convertRGBToHex(rgb) {
     var values = rgb.substring(4, rgb.length - 1).split(", ");
     var r = parseInt(values[0]);
     var g = parseInt(values[1]);
     var b = parseInt(values[2]);
     return "#" + r.toString(16) + g.toString(16) + b.toString(16);
    }
    var rgbValue = "rgb(255, 0, 0)";
    var hexCode = convertRGBToHex(rgbValue);
    console.log(hexCode); // 結果: "#ff0000"

このようにして、HTMLのカラーコードをRGB値に変換することができます。上記のコード例を使用することで、カラーコードとRGB値の相互変換ができます。