<!doctype html>
<html>
<head>
<title>CMYK to or from RGB to or from HSL Colour Systems</title>
<script type='text/javascript'>
var r1=0.0000, g1=0.0000, b1=0.0000, c1=0.0000, m1=0.0000, y1=0.0000, h1=0.0000, s1=0.0000, l1=0.0000, k1=0.0000, first=true, feedback='', dohsl=true, frome='';
function fcmyk_rgb() {
var c=document.getElementById('c').value;
var m=document.getElementById('m').value;
var y=document.getElementById('y').value;
var k=document.getElementById('k').value;
//alert('c=' + c + ' m=' + m + ' y=' + y + ' k=' + k);
r1=eval(255.0 * (1.0 - eval('' + eval('' + c))) * (1.0 - eval('' + eval('' + k))));
g1=eval(255.0 * (1.0 - eval('' + eval('' + m))) * (1.0 - eval('' + eval('' + k))));
b1=eval(255.0 * (1.0 - eval('' + eval('' + y))) * (1.0 - eval('' + eval('' + k))));
//alert('r=' + r1 + ' g=' + g1 + ' b=' + b1);
document.getElementById('r').value = Math.floor(eval('' + r1));
document.getElementById('g').value = Math.floor(eval('' + g1));
document.getElementById('b').value = Math.floor(eval('' + b1));
rgbtohsl();
document.getElementById('dcmyk_rgb').style.backgroundColor="rgb(" + Math.floor(r1) + "," + Math.floor(g1) + "," + Math.floor(b1) + ")";
document.getElementById('drgb_cmyk').style.backgroundColor="rgb(" + Math.floor(r1) + "," + Math.floor(g1) + "," + Math.floor(b1) + ")";
document.getElementById('dhsl_cmyk').style.backgroundColor="rgb(" + Math.floor(r1) + "," + Math.floor(g1) + "," + Math.floor(b1) + ")";
}

function fhsl_cmyk() { // https://www.rapidtables.com/convert/color/hsl-to-rgb.html
h1=eval('' + document.getElementById('h').value);
s1=eval(eval('' + document.getElementById('s').value) / 100.0);
l1=eval(eval('' + document.getElementById('l').value) / 100.0);
//alert('' + h1 + ' ' + s1 + ' ' + l1 + ' ');
var ccap=eval(eval(1 - Math.abs(eval(eval(2 * l1) - 1)) ) * s1);
//alert(ccap);
var xcap=eval(ccap * eval(1 - Math.abs( eval(eval(eval(h1 / 60) % 2) - 1) )));
//alert(xcap);
var mlow=eval(l1 - eval(ccap / 2));
//alert(mlow);
if (eval('' + h1) < 60) {
//alert('' + Math.floor(eval(eval(ccap + mlow) * 255)));
document.getElementById('r').value='' + Math.floor(eval(eval(ccap + mlow) * 255));
//alert('' + Math.floor(eval(eval(xcap + mlow) * 255)));
document.getElementById('g').value='' + Math.floor(eval(eval(xcap + mlow) * 255));
//alert('' + Math.floor(eval(eval(mlow) * 255)));
document.getElementById('b').value='' + Math.floor(eval(eval(mlow) * 255));
} else if (eval('' + h1) < 120) {
document.getElementById('g').value='' + Math.floor(eval(eval(ccap + mlow) * 255));
document.getElementById('r').value='' + Math.floor(eval(eval(xcap + mlow) * 255));
document.getElementById('b').value='' + Math.floor(eval(eval(mlow) * 255));
} else if (eval('' + h1) < 180) {
document.getElementById('g').value='' + Math.floor(eval(eval(ccap + mlow) * 255));
document.getElementById('b').value='' + Math.floor(eval(eval(xcap + mlow) * 255));
document.getElementById('r').value='' + Math.floor(eval(eval(mlow) * 255));
} else if (eval('' + h1) < 240) {
document.getElementById('b').value='' + Math.floor(eval(eval(ccap + mlow) * 255));
document.getElementById('g').value='' + Math.floor(eval(eval(xcap + mlow) * 255));
document.getElementById('r').value='' + Math.floor(eval(eval(mlow) * 255));
} else if (eval('' + h1) < 300) {
document.getElementById('b').value='' + Math.floor(eval(eval(ccap + mlow) * 255));
document.getElementById('r').value='' + Math.floor(eval(eval(xcap + mlow) * 255));
document.getElementById('g').value='' + Math.floor(eval(eval(mlow) * 255));
} else { // if (eval('' + hh) < 360) {
document.getElementById('r').value='' + Math.floor(eval(eval(ccap + mlow) * 255));
document.getElementById('b').value='' + Math.floor(eval(eval(xcap + mlow) * 255));
document.getElementById('g').value='' + Math.floor(eval(eval(mlow) * 255));
}
dohsl=false;
frgb_cmyk();
}

function rgbtohsl() {
var rr=document.getElementById('r').value;
var gg=document.getElementById('g').value;
var bb=document.getElementById('b').value;
var r=eval(eval('' + rr) / 255.0);
var g=eval(eval('' + gg) / 255.0);
var b=eval(eval('' + bb) / 255.0);
var mx=r;
var mn=r;
h1=0;
s1=0.0;
if (eval('' + g) > eval('' + mx)) mx=g;
if (eval('' + b) > eval('' + mx)) mx=b;
if (eval('' + g) < eval('' + mn)) mn=g;
if (eval('' + b) < eval('' + mn)) mn=b;
var mdiff=eval(eval('' + mx) - eval('' + mn));
l1=eval(eval(eval(eval('' + mx) + eval('' + mn)) / 2.0) * 100.0);
//alert(l1);
if (eval('' + mdiff) != 0) {
if (l1 < 100) {
s1=eval(eval(eval('' + mdiff) / eval(1 - eval(Math.abs( eval( eval(2 * eval(l1 / 100.0)) - 1) )))) * 100.0);
} else {
s1=100;
}
if (eval('' + mx) == r) {
h1=eval(60 * eval( eval( eval( eval(eval('' + g) - eval('' + b)) / mdiff) % 6) ) );
} else if (eval('' + mx) == g) {
h1=eval(60 * eval( eval( eval( eval(eval('' + b) - eval('' + r)) / mdiff) + 2) ) );
} else { //if (eval('' + mx) == b) {
h1=eval(60 * eval( eval( eval( eval(eval('' + r) - eval('' + g)) / mdiff) + 4) ) );
}
if (h1 < 0) { h1+=360; }
}


if (('' + h1 + '..').split('.')[1].length > 1) {
document.getElementById('h').value = ('' + h1 + '..').split('.')[0]; // + '.' + ('' + h1 + '..').split('.')[1].substring(0,1);
} else if (('' + h1).indexOf('.') == -1) {
document.getElementById('h').value = ('' + h1); // + '.0');
} else {
document.getElementById('h').value = h1;
}
if (('' + s1 + '..').split('.')[1].length > 1) {
document.getElementById('s').value = ('' + s1 + '..').split('.')[0] + '.' + ('' + s1 + '..').split('.')[1].substring(0,1);
} else if (('' + s1).indexOf('.') == -1) {
document.getElementById('s').value = ('' + s1 + '.0');
} else {
document.getElementById('s').value = s1;
}
if (('' + l1 + '..').split('.')[1].length > 1) {
document.getElementById('l').value = ('' + l1 + '..').split('.')[0] + '.' + ('' + l1 + '..').split('.')[1].substring(0,1);
} else if (('' + l1).indexOf('.') == -1) {
document.getElementById('l').value = ('' + l1 + '.0');
} else {
document.getElementById('l').value = l1;
}
}

function dofrome(inv) {
var toval=inv;
if (toval.indexOf('@') != -1) {
if (toval.indexOf(' ') != -1 && toval.indexOf('#') != -1) {
frome=toval.split(' ')[1];
if (frome.indexOf('#') != -1) { frome=frome.split('#')[1]; }
} else if (toval.indexOf(' ') != -1) {
frome=toval.split(' ')[1];
} else if (toval.indexOf('#') != -1) {
frome=toval.split('#')[1];
}
if (frome.indexOf('@') == -1 || frome.indexOf(' ') != -1) { frome=''; } else { toval=toval.replace('#' + frome,'').replace(' ' + frome,''); document.getElementById('to').value=toval; }
}
//alert('toval=' + toval + ' frome=' + frome);
return toval;
}

function frgb_cmyk() { // http://www.rapidtables.com/convert/color/rgb-to-cmyk.htm
var cinp='', toval='';
if (first) {
first=false;
if (document.URL.indexOf('?') != -1) {
toval=location.search.split('to=')[1] ? dofrome(decodeURIComponent(location.search.split('to=')[1].split('&')[0])) : '';
if (toval != '') {
document.getElementById('to').value=toval.split(' ')[0].split('#')[0]; //location.search.split('to=')[1] ? decodeURIComponent(location.search.split('to=')[1].split('&')[0]).split(' ')[0].split('#')[0] : '';
if (toval.indexOf(' ') != -1 && toval.indexOf('#') != -1) {
frome=toval.split(' ')[1];
if (frome.indexOf('#') != -1) { frome=frome.split('#')[1]; }
} else if (toval.indexOf(' ') != -1) {
frome=toval.split(' ')[1];
} else if (toval.indexOf('#') != -1) {
frome=toval.split('#')[1];
}
if (frome.indexOf('@') == -1 || frome.indexOf(' ') != -1) { frome=''; }
}
document.getElementById('feedback').value=location.search.split('feedback=')[1] ? decodeURIComponent(location.search.split('feedback=')[1].split('&')[0]).replace(/\+/g,' ') : '';
cinp=location.search.split('cinput=')[1] ? decodeURIComponent(location.search.split('cinput=')[1].split('&')[0]) : '#000000';
if (cinp != '#000000') {
findc(cinp);
} else {
document.getElementById('r').value=location.search.split('r=')[1] ? decodeURIComponent(location.search.split('r=')[1].split('&')[0]) : document.getElementById('r').value;
document.getElementById('g').value=location.search.split('g=')[1] ? decodeURIComponent(location.search.split('g=')[1].split('&')[0]) : document.getElementById('g').value;
document.getElementById('b').value=location.search.split('b=')[1] ? decodeURIComponent(location.search.split('b=')[1].split('&')[0]) : document.getElementById('b').value;
document.getElementById('c').value=location.search.split('c=')[1] ? decodeURIComponent(location.search.split('c=')[1].split('&')[0]) : document.getElementById('c').value;
document.getElementById('m').value=location.search.split('m=')[1] ? decodeURIComponent(location.search.split('m=')[1].split('&')[0]) : document.getElementById('m').value;
document.getElementById('y').value=location.search.split('y=')[1] ? decodeURIComponent(location.search.split('y=')[1].split('&')[0]) : document.getElementById('y').value;
document.getElementById('k').value=location.search.split('k=')[1] ? decodeURIComponent(location.search.split('k=')[1].split('&')[0]) : document.getElementById('k').value;
document.getElementById('h').value=location.search.split('h=')[1] ? decodeURIComponent(location.search.split('h=')[1].split('&')[0]) : document.getElementById('h').value;
document.getElementById('s').value=location.search.split('s=')[1] ? decodeURIComponent(location.search.split('s=')[1].split('&')[0]) : document.getElementById('s').value;
document.getElementById('l').value=location.search.split('l=')[1] ? decodeURIComponent(location.search.split('l=')[1].split('&')[0]) : document.getElementById('l').value;
if (document.URL.indexOf('bcmyk_rgbx=') != -1) {
fcmyk_rgb();
if (toval.indexOf(' ') != -1 && toval.indexOf('#') != -1) { alert(feedback); }
return;
} else if (document.URL.indexOf('bhsl_cmykx=') != -1) {
fhsl_cmyk();
if (toval.indexOf(' ') != -1 && toval.indexOf('#') != -1) { alert(feedback); }
return;
}
}
}
}
var rr=document.getElementById('r').value;
var gg=document.getElementById('g').value;
var bb=document.getElementById('b').value;
var r=eval(eval('' + rr) / 255.0);
var g=eval(eval('' + gg) / 255.0);
var b=eval(eval('' + bb) / 255.0);
var mx=r;
var mn=r;
h1=0;
s1=0.0;
if (eval('' + g) > eval('' + mx)) mx=g;
if (eval('' + b) > eval('' + mx)) mx=b;
if (eval('' + g) < eval('' + mn)) mn=g;
if (eval('' + b) < eval('' + mn)) mn=b;
var mdiff=eval(eval('' + mx) - eval('' + mn));
l1=eval(eval(eval(eval('' + mx) + eval('' + mn)) / 2.0) * 100.0);
//alert(l1);
if (eval('' + mdiff) != 0) {
if (l1 < 100) {
s1=eval(eval(eval('' + mdiff) / eval(1 - eval(Math.abs( eval( eval(2 * eval(l1 / 100.0)) - 1) )))) * 100.0);
} else {
s1=100;
}
if (eval('' + mx) == r) {
h1=eval(60 * eval( eval( eval( eval(eval('' + g) - eval('' + b)) / mdiff) % 6) ) );
//alert('H1=' + h1);
} else if (eval('' + mx) == g) {
h1=eval(60 * eval( eval( eval( eval(eval('' + b) - eval('' + r)) / mdiff) + 2) ) );
//alert('h 1=' + h1);
} else { //if (eval('' + mx) == b) {
h1=eval(60 * eval( eval( eval( eval(eval('' + r) - eval('' + g)) / mdiff) + 4) ) );
//alert('h1=' + h1);
}
if (h1 < 0) { h1+=360; }
}
k1 = eval(1.0000 - eval('' + mx));
if (eval('' + k1) == 1.0000) {
c1 = 0.0000;
m1 = 0.0000;
y1 = 0.0000;
} else {
c1 = eval((1.0000 - eval('' + r) - eval('' + k1)) / (1.0000 - eval('' + k1)));
m1 = eval((1.0000 - eval('' + g) - eval('' + k1)) / (1.0000 - eval('' + k1)));
y1 = eval((1.0000 - eval('' + b) - eval('' + k1)) / (1.0000 - eval('' + k1)));
}
//alert(c1);
if (('' + c1 + '..').split('.')[1].length > 4) {
document.getElementById('c').value = ('' + c1 + '..').split('.')[0] + '.' + ('' + c1 + '..').split('.')[1].substring(0,4);
} else if (('' + c1).indexOf('.') == -1) {
document.getElementById('c').value = ('' + c1 + '.0000');
} else {
document.getElementById('c').value = c1;
}
if (('' + m1 + '..').split('.')[1].length > 4) {
document.getElementById('m').value = ('' + m1 + '..').split('.')[0] + '.' + ('' + m1 + '..').split('.')[1].substring(0,4);
} else if (('' + m1).indexOf('.') == -1) {
document.getElementById('m').value = ('' + m1 + '.0000');
} else {
document.getElementById('m').value = m1;
}
if (('' + y1 + '..').split('.')[1].length > 4) {
document.getElementById('y').value = ('' + y1 + '..').split('.')[0] + '.' + ('' + y1 + '..').split('.')[1].substring(0,4);
} else if (('' + y1).indexOf('.') == -1) {
document.getElementById('y').value = ('' + y1 + '.0000');
} else {
document.getElementById('y').value = y1;
}
if (('' + k1 + '..').split('.')[1].length > 4) {
document.getElementById('k').value = ('' + k1 + '..').split('.')[0] + '.' + ('' + k1 + '..').split('.')[1].substring(0,4);
} else if (('' + k1).indexOf('.') == -1) {
document.getElementById('k').value = ('' + k1 + '.0000');
} else {
document.getElementById('k').value = k1;
}

if (dohsl) {
if (('' + h1 + '..').split('.')[1].length > 1) {
document.getElementById('h').value = ('' + h1 + '..').split('.')[0]; // + '.' + ('' + h1 + '..').split('.')[1].substring(0,1);
} else if (('' + h1).indexOf('.') == -1) {
document.getElementById('h').value = ('' + h1); // + '.0');
} else {
document.getElementById('h').value = h1;
}
if (('' + s1 + '..').split('.')[1].length > 1) {
document.getElementById('s').value = ('' + s1 + '..').split('.')[0] + '.' + ('' + s1 + '..').split('.')[1].substring(0,1);
} else if (('' + s1).indexOf('.') == -1) {
document.getElementById('s').value = ('' + s1 + '.0');
} else {
document.getElementById('s').value = s1;
}
if (('' + l1 + '..').split('.')[1].length > 1) {
document.getElementById('l').value = ('' + l1 + '..').split('.')[0] + '.' + ('' + l1 + '..').split('.')[1].substring(0,1);
} else if (('' + l1).indexOf('.') == -1) {
document.getElementById('l').value = ('' + l1 + '.0');
} else {
document.getElementById('l').value = l1;
}
}
dohsl=true;

document.getElementById('dcmyk_rgb').style.backgroundColor="rgb(" + Math.floor(rr) + "," + Math.floor(gg) + "," + Math.floor(bb) + ")";
document.getElementById('drgb_cmyk').style.backgroundColor="rgb(" + Math.floor(rr) + "," + Math.floor(gg) + "," + Math.floor(bb) + ")";
document.getElementById('dhsl_cmyk').style.backgroundColor="rgb(" + Math.floor(rr) + "," + Math.floor(gg) + "," + Math.floor(bb) + ")";
if (toval.indexOf(' ') != -1 && toval.indexOf('#') != -1) { alert(feedback); }
}

function undata() {
if (document.getElementById('feedback').value != '') {
if (frome.indexOf('@') != -1) {
document.getElementById('htmlis').innerHTML='<body>' + document.body.innerHTML.replace(/\ data\-/g, ' ').replace(/\'\/\//g, "'ht' + 'tp://").replace(/\"\/\//g, '"ht' + 'tp://').replace('/emai' + 'lhtml.php', '/' + document.URL.split('?')[0].split('#')[0].split('/')[eval(-1 + document.URL.split('?')[0].split('#')[0].split('/').length)]).replace(' method="POST"', ' method="GET"').replace(' onsubmit=', ' data-onsubmit=').replace('Email to ...', 'Show').replace(/inline\-block/g, 'none').replace(' name="htmlis"', ' data-name="htmlis"').replace(/\ type\=\"button/g, ' type="submit').replace(/\ type\=\"email/g, ' type="text').replace(/\ type\=\"number/g, ' type="text').replace('"g" value="0"', '"g" value="' + document.getElementById('g').value + '"').replace('"r" value="0"', '"r" value="' + document.getElementById('r').value + '"').replace('"b" value="0"', '"b" value="' + document.getElementById('b').value + '"').replace('"to" value=""', '"to" value="' + frome + '#' + document.getElementById('to').value + '"').replace('<br>', '').replace('<br><br>', '').replace('<br>', '').replace('<br><br>', '<br>' + document.getElementById('feedback').value).replace(' value="' + document.getElementById('feedback').value + '"', ' value=""').replace(/\ value\=\"RGB\ to\ /g, ' style="background-color:yellow;" value="Email RGB to ').replace(/\"HSL\ to\ /g, '"Email HSL to ').replace(/\"CMYK\ to\ /g, '"Email CMYK to ').replace('"h" value="0"', '"h" value="' + document.getElementById('h').value + '"').replace('"s" value="0.0"', '"s" value="' + document.getElementById('s').value + '"').replace('"l" value="0.0"', '"l" value="' + document.getElementById('l').value + '"').replace('"c" value="0.7373"', '"c" value="' + document.getElementById('c').value + '"').replace('"m" value="0.7059"', '"m" value="' + document.getElementById('m').value + '"').replace('"y" value="0.6431"', '"y" value="' + document.getElementById('y').value + '"').replace('"k" value="0.8706"', '"k" value="' + document.getElementById('k').value + '"').replace(/\ \;/g,' ') + '</body>';
} else {
document.getElementById('htmlis').innerHTML='<body>' + document.body.innerHTML.replace(/\ data\-/g, ' ').replace(/\'\/\//g, "'ht' + 'tp://").replace(/\"\/\//g, '"ht' + 'tp://').replace('/emai' + 'lhtml.php', '/' + document.URL.split('?')[0].split('#')[0].split('/')[eval(-1 + document.URL.split('?')[0].split('#')[0].split('/').length)]).replace(' method="POST"', ' method="GET"').replace(' onsubmit=', ' data-onsubmit=').replace('Email to ...', 'Show').replace(/inline\-block/g, 'none').replace(' name="htmlis"', ' data-name="htmlis"').replace(/\ type\=\"button/g, ' type="submit').replace(/\ type\=\"email/g, ' type="text').replace(/\ type\=\"number/g, ' type="text').replace('"g" value="0"', '"g" value="' + document.getElementById('g').value + '"').replace('"r" value="0"', '"r" value="' + document.getElementById('r').value + '"').replace('"b" value="0"', '"b" value="' + document.getElementById('b').value + '"').replace('"to" value=""', '"to" value="' + document.getElementById('to').value + '"').replace('<br>', '').replace('<br><br>', '').replace('<br>', '').replace('<br><br>', '<br>' + document.getElementById('feedback').value).replace(' value="' + document.getElementById('feedback').value + '"', ' value=""').replace(/\ value\=\"RGB\ to\ /g, ' style="background-color:yellow;" value="Email RGB to ').replace(/\"HSL\ to\ /g, '"Email HSL to ').replace(/\"CMYK\ to\ /g, '"Email CMYK to ').replace('"h" value="0"', '"h" value="' + document.getElementById('h').value + '"').replace('"s" value="0.0"', '"s" value="' + document.getElementById('s').value + '"').replace('"l" value="0.0"', '"l" value="' + document.getElementById('l').value + '"').replace('"c" value="0.7373"', '"c" value="' + document.getElementById('c').value + '"').replace('"m" value="0.7059"', '"m" value="' + document.getElementById('m').value + '"').replace('"y" value="0.6431"', '"y" value="' + document.getElementById('y').value + '"').replace('"k" value="0.8706"', '"k" value="' + document.getElementById('k').value + '"').replace(/\ \;/g,' ') + '</body>';
}
} else {
if (frome.indexOf('@') != -1) {
document.getElementById('htmlis').innerHTML='<body>' + document.body.innerHTML.replace(/\ data\-/g, ' ').replace(/\'\/\//g, "'ht' + 'tp://").replace(/\"\/\//g, '"ht' + 'tp://').replace('/emai' + 'lhtml.php', '/' + document.URL.split('?')[0].split('#')[0].split('/')[eval(-1 + document.URL.split('?')[0].split('#')[0].split('/').length)]).replace(' method="POST"', ' method="GET"').replace(' onsubmit=', ' data-onsubmit=').replace('Email to ...', 'Show').replace(/inline\-block/g, 'none').replace(' name="htmlis"', ' data-name="htmlis"').replace(/\ type\=\"button/g, ' type="submit').replace(/\ type\=\"email/g, ' type="text').replace(/\ type\=\"number/g, ' type="text').replace('"g" value="0"', '"g" value="' + document.getElementById('g').value + '"').replace('"r" value="0"', '"r" value="' + document.getElementById('r').value + '"').replace('"b" value="0"', '"b" value="' + document.getElementById('b').value + '"').replace('"to" value=""', '"to" value="' + frome + '#' + document.getElementById('to').value + '"').replace('<br>', '').replace('<br><br>', '').replace('<br>', '').replace('<br><br>', '').replace(/\ value\=\"RGB\ to\ /g, ' style="background-color:yellow;" value="Email RGB to ').replace(/\"HSL\ to\ /g, '"Email HSL to ').replace(/\"CMYK\ to\ /g, '"Email CMYK to ').replace('"h" value="0"', '"h" value="' + document.getElementById('h').value + '"').replace('"s" value="0.0"', '"s" value="' + document.getElementById('s').value + '"').replace('"l" value="0.0"', '"l" value="' + document.getElementById('l').value + '"').replace('"c" value="0.7373"', '"c" value="' + document.getElementById('c').value + '"').replace('"m" value="0.7059"', '"m" value="' + document.getElementById('m').value + '"').replace('"y" value="0.6431"', '"y" value="' + document.getElementById('y').value + '"').replace('"k" value="0.8706"', '"k" value="' + document.getElementById('k').value + '"').replace(/\ \;/g,' ') + '</body>';
} else {
document.getElementById('htmlis').innerHTML='<body>' + document.body.innerHTML.replace(/\ data\-/g, ' ').replace(/\'\/\//g, "'ht' + 'tp://").replace(/\"\/\//g, '"ht' + 'tp://').replace('/emai' + 'lhtml.php', '/' + document.URL.split('?')[0].split('#')[0].split('/')[eval(-1 + document.URL.split('?')[0].split('#')[0].split('/').length)]).replace(' method="POST"', ' method="GET"').replace(' onsubmit=', ' data-onsubmit=').replace('Email to ...', 'Show').replace(/inline\-block/g, 'none').replace(' name="htmlis"', ' data-name="htmlis"').replace(/\ type\=\"button/g, ' type="submit').replace(/\ type\=\"email/g, ' type="text').replace(/\ type\=\"number/g, ' type="text').replace('"g" value="0"', '"g" value="' + document.getElementById('g').value + '"').replace('"r" value="0"', '"r" value="' + document.getElementById('r').value + '"').replace('"b" value="0"', '"b" value="' + document.getElementById('b').value + '"').replace('"to" value=""', '"to" value="' + document.getElementById('to').value + '"').replace('<br>', '').replace('<br><br>', '').replace('<br>', '').replace('<br><br>', '').replace(/\ value\=\"RGB\ to\ /g, ' style="background-color:yellow;" value="Email RGB to ').replace(/\"HSL\ to\ /g, '"Email HSL to ').replace(/\"CMYK\ to\ /g, '"Email CMYK to ').replace('"h" value="0"', '"h" value="' + document.getElementById('h').value + '"').replace('"s" value="0.0"', '"s" value="' + document.getElementById('s').value + '"').replace('"l" value="0.0"', '"l" value="' + document.getElementById('l').value + '"').replace('"c" value="0.7373"', '"c" value="' + document.getElementById('c').value + '"').replace('"m" value="0.7059"', '"m" value="' + document.getElementById('m').value + '"').replace('"y" value="0.6431"', '"y" value="' + document.getElementById('y').value + '"').replace('"k" value="0.8706"', '"k" value="' + document.getElementById('k').value + '"').replace(/\ \;/g,' ') + '</body>';
}
}
if (document.getElementById('to').value.indexOf('@') != -1) {
var zhr = new XMLHttpRequest();
var zform=new FormData();
var mydate = new Date();
//zform.append('inline', mydate.toLocaleString());
zform.append('inline', '');
//alert(mydate.toLocaleString());
zform.append('to', document.getElementById('to').value);
if (feedback != '') {
zform.append('subj', document.getElementById('subj').value + ' ... ' + feedback + ' ... ');
} else if (document.getElementById('feedback').value != '') {
zform.append('subj', document.getElementById('subj').value + ' ... ' + document.getElementById('feedback').value + ' ... ');
} else {
zform.append('subj', document.getElementById('subj').value);
}
zform.append('htmlis', document.getElementById('htmlis').value);
zhr.open('post', '//www.rjmprogramming.com.au/HTMLCSS/emailhtml.php', true);
//zhr.onreadystatechange = showStuff;
zhr.send(zform);
document.getElementById('emailb').style.backgroundColor='lightgreen';
return false;
}
return false;
}

function findc(incol) {
var alp="0123456789abcdef";
var pcol="." + ('000' + ('' + eval(alp.indexOf(incol.toLowerCase().replace('#','').substring(0,1)) * 16 + alp.indexOf(incol.toLowerCase().replace('#','').substring(1,2)) * 1))).slice(-3) + ('000' + ('' + eval(alp.indexOf(incol.toLowerCase().replace('#','').substring(2,3)) * 16 + alp.indexOf(incol.toLowerCase().replace('#','').substring(3,4)) * 1))).slice(-3) + ('000' + ('' + eval(alp.indexOf(incol.toLowerCase().replace('#','').substring(4,5)) * 16 + alp.indexOf(incol.toLowerCase().replace('#','').substring(5,6)) * 1))).slice(-3);
document.getElementById('r').value='' + pcol.substring(1, 4);
document.getElementById('g').value='' + pcol.substring(4, 7);
document.getElementById('b').value='' + pcol.substring(7, 10);
frgb_cmyk();
document.getElementById('cinput').value='#000000';
}
</script>
</head>
<body style='background-color: #f0fff0;' onload='frgb_cmyk();'>
<h1 style='color:yellow; background-color: violet;' align='center'><br>CMYK to or from RGB to or from HSL Colour Systems<br><br></h1>
<h4 style='color:yellow; background-color: violet;' align='center'><br>Read More <a target=_blank title='CMYK and RGB history information' href='//cruxcreative.com/rgb-vs-cmyk-when-to-use-which-and-why/'>Here</a><br><br></h1>
<div align='center'>
<form onsubmit="return undata();" action="//www.rjmprogramming.com.au/HTMLCSS/emailhtml.php" method="POST">
<input type=hidden name=inline value=""></input>
<textarea style='display:none;' rows=45 cols=120 name="htmlis" id="htmlis"></textarea>
<input type=hidden name=subj id=subj value="CMYK to or from RGB to or from HSL Colour Systems"></input>
<table border=10 style="width:80%;">
<tr><th>CMYK (for printing)</th><th>HSL</th><th>RGB (for web)</th></tr>
<tr><td align='right'>
C<font color=cyan>yan</font> <input style="width:50%;" data-name='c' id='c' value='0.7373' type="number" onblur='fcmyk_rgb();' onchange='fcmyk_rgb();' step=0.0001 min=0.0000 max=1.0000></input><br><br>
M<font color=magenta>agenta</font> <input style="width:50%;" data-name='m' id='m' value='0.7059' type="number" onblur='fcmyk_rgb();' onchange='fcmyk_rgb();' step=0.0001 min=0.0000 max=1.0000></input><br><br>
Y<font color=yellow>ellow</font> <input style="width:50%;" data-name='y' id='y' value='0.6431' type="number" onblur='fcmyk_rgb();' onchange='fcmyk_rgb();' step=0.0001 min=0.0000 max=1.0000></input><br><br>
K<font color=black>ey</font> <input style="width:50%;" data-name='k' id='k' value='0.8706' type="number" onblur='fcmyk_rgb();' onchange='fcmyk_rgb();' step=0.0001 min=0.0000 max=1.0000></input><br><br>
</td><td align='right'>
H<font color=olive>ue</font> <input style="width:50%;" data-name='h' id='h' value='0' type="number" onblur='fhsl_cmyk();' onchange='fhsl_cmyk();' step=1 min=0 max=360></input> ° <br><br>
S<font color=fuchsia>aturation</font> <input style="width:50%;" data-name='s' id='s' value='0.0' type="number" onblur='fhsl_cmyk();' onchange='fhsl_cmyk();' step=0.1 min=0 max=100></input> % <br><br>
L<font color=purple>ightness</font> <input style="width:50%;" data-name='l' id='l' value='0.0' type="number" onblur='fhsl_cmyk();' onchange='fhsl_cmyk();' step=0.1 min=0 max=100></input> % <br><br>
</td><td align='right'>
R<font color=red>ed</font> <input style="width:50%;" data-name='r' id='r' value='0' type="number" onblur='frgb_cmyk();' onchange='frgb_cmyk();' step=1 min=0 max=255></input><br><br>
G<font color=green>reen</font> <input style="width:50%;" data-name='g' id='g' value='0' type="number" onblur='frgb_cmyk();' onchange='frgb_cmyk();' step=1 min=0 max=255></input><br><br>
B<font color=blue>lue</font> <input style="width:50%;" data-name='b' id='b' value='0' type="number" onblur='frgb_cmyk();' onchange='frgb_cmyk();' step=1 min=0 max=255></input><br><br>
</td></tr>
<tr><td align='center'><input name='bcmyk_rgbx' id='cmyk_rgb' type="button" onclick='fcmyk_rgb();' value="CMYK to RGB and HSL"></input></td><td align='center'><input name='bhsl_cmykx' id='hsl_cmyk' type="button" onclick='fhsl_cmyk();' value="HSL to CMYK and RGB"></input></td><td align='center'><input name='brgb_cmykx' id='rgb_cmyk' type="button" onclick='frgb_cmyk();' value="RGB to CMYK and HSL"></input></td></tr>
<tr><td align='center' colspan=3><input style='display:inline-block;' id='emailb' type='submit' value='Email to ...'></input>  <input title="Optional Email To[#From] address" placeholder="Optional Email To[#From] address" onblur="if (dofrome(this.value).indexOf('@') != -1) { document.getElementById('emailb').style.backgroundColor='yellow'; }" style='display:INLINE-BLOCK;width:40%;' type="text" id="to" name="to" value=""></input> <input style='display:INLINE-BLOCK;width:35%;' type="text" title="Optional Comment or Feedback" placeholder="Optional Comment or Feedback" id="feedback" name="feedback" value=""></input>  <input onchange="findc(this.value);" style='display:INLINE-BLOCK;' type="color" name="cinput" id="cinput" value="#000000"></input></td></tr>
</table><table>
<tr><td align='center'><div id='dcmyk_rgb' style='width:80%; height: 100px;'><br><br><br>                                </div></td><td align='center'><div id='dhsl_cmyk' style='width:80%; height: 100px;'><br><br><br>                                </div></td><td align='center'><div id='drgb_cmyk' style='width:80%; height: 100px;'><br><br><br>                                </div></td></tr>
</table>
</form>
<input type=text style='position:absolute;top:-200px;left:-200px;display:inline-block;' value=''></input>
</div>
</body>
</html>