JSFiddle - React, Tailwind, and code Playground

by Nicolas PUJOL

JavaScript

var line = "(0.56,0.94,0.21,0.02)";

function hex2Rgb(h) {
    var r = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(h);
    return parseInt(r[1], 16) + "," + parseInt(r[2], 16) + "," + parseInt(r[3], 16);
}

function hsl2Rgb(h) {
    var m = /HSL\(([0-9]{1,3}),([0-9]{1,3}),([0-9]{1,3})\)/i.exec(h);
    var r, g, b;
    if (m[2] == 0) {
        r = g = b = m[3];
    } else {
        var q = m[3] < 0.5 ? m[3] * (1 + m[2]) : m[3] + m[2] - m[3] * m[2];
        var p = 2 * m[3] - q;
        r = hue2rgb(p, q, m[1] + 1 / 3);
        g = hue2rgb(p, q, m[1]);
        b = hue2rgb(p, q, m[1] - 1 / 3);
    }
    return [r * 255, g * 255, b * 255];
}

function hue2rgb(p, q, t) {
    if (t < 0) t += 1;
    if (t > 1) t -= 1;
    if (t < 1 / 6) return p + (q - p) * 6 * t;
    if (t < 1 / 2) return q;
    if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
    return p;
}

function cmyk2rgb(h) {
    var r = /\(([0-9.]+),([0-9.]+),([0-9.]+),([0-9.]+)\)/i.exec(h);
    var n = (1 - r[4]*1);
    return Math.round(255 * (1 - (r[1] * n + r[4]*1))) + "," + Math.round(255 * (1 - (r[2] * n + r[4]*1))) + "," + Math.round(255 * (1 - (r[3] * n + r[4]*1)));
}
var r = "";
switch(/(\(|HSL|HSV|#)/.exec(line)[1]) {
    case "#":
        r = hex2Rgb(line);
        break;
    case "HSL":
        r = hsl2Rgb(line);
        break;
    /*case "HSV":
        r = hsv2Rgb(line);
        break;*/
    default:
        r = cmyk2rgb(line);
}
console.log(r);
console.log("RGB(" + cmyk2rgb(line) + ")");