方式2.色相H0～1 ／ CSS Color Module Level 3

計算手順

2-1.RGB最小値m1、RGB最大値m2 を求める

2-2.RGB値 を求める

---

手動計算例

RGB最小値m1
RGB最大値m2

function hsl2rgb(h_deg, s_percent, l_percent){

    var h_norm = h_deg / 360;

    var s_norm = s_percent / 100;

    var l_norm = l_percent / 100;



    var m2;

    if (l_norm < 0.5) {

      m2 = l_norm * (s_norm + 1);

    } else {

      m2 = l_norm + s_norm - l_norm * s_norm;

    }



    var m1 = l_norm * 2 - m2;



    var r_norm = this._hsl2rgb(m1, m2, h_norm + 1 / 3);

    var g_norm = this._hsl2rgb(m1, m2, h_norm);

    var b_norm = this._hsl2rgb(m1, m2, h_norm - 1 / 3);



    this.r_ = parseInt(Math.round(r_norm * 255));

    this.g_ = parseInt(Math.round(g_norm * 255));

    this.b_ = parseInt(Math.round(b_norm * 255));

    console.log('hsl2rgb; ' + this.r_ +' '+ this.g_  + ' '+ this.b_);

  }



function  _hsl2rgb(m1, m2, h) {

    var _h = h;

    if (_h < 0) {

      _h = _h + 1;

    }

    if (_h > 1) {

      _h = _h - 1;

    }



    if (_h * 6 < 1) {

      return m1 + (m2 - m1) * _h * 6;

    }

    if (_h * 2 < 1) {

      return m2;

    }

    if (_h * 3 < 2) {

      return m1 + (m2 - m1) * (2 / 3 - _h) * 6;

    }

    return m1;

  }





hsl2rgb(206.6, 89.7, 54.1);



//m2; 0.9527230000000001

//m1; 0.12927699999999998

//hsl2rgb; 33 150 243

---

検証

RGB最小値
・255 × m1 = 255 × 0.12927699999999998 = 32.965635 ≒ 33

RGB最大値
・255 × m2 = 255 × 0.9527230000000001 = 242.944365 ≒ 243