<!doctype html>
<html>
<head>
<title>CMYK to or from RGB 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, k1=0.0000, first=true;
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));
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) + ")";
}

function frgb_cmyk() { // http://www.rapidtables.com/convert/color/rgb-to-cmyk.htm
var cinp='';
if (first) {
first=false;
if (document.URL.indexOf('?') != -1) {
document.getElementById('to').value=location.search.split('to=')[1] ? decodeURIComponent(location.search.split('to=')[1].split('&')[0]) : '';
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;
if (document.URL.indexOf('bcmyk_rgbx=') != -1) {
fcmyk_rgb();
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;
if (eval('' + g) > eval('' + mx)) mx=g;
if (eval('' + b) > eval('' + mx)) mx=b;
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;
}
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) + ")";
}

function undata() {
document.getElementById('htmlis').innerHTML='<body>' + document.body.innerHTML.replace(/\ data\-/g, ' ').replace(/\'\/\//g, "'ht' + 'tp://").replace(/\"\/\//g, '"ht' + 'tp://').replace('/emai' + 'lhtml.php', '/cmy' + 'k_rgb.html').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>', '') + '</body>';
if (document.getElementById('to').value.indexOf('@') != -1) {
var zhr = new XMLHttpRequest();
var zform=new FormData();
zform.append('inline', '');
zform.append('to', document.getElementById('to').value);
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 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 Colour Systems"></input>
<table border=10 style="width:80%;">
<tr><th>CMYK (for printing)</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'>
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'></input></td><td align='center'><input name='brgb_cmykx' id='rgb_cmyk' type="button" onclick='frgb_cmyk();' value='RGB to CMYK'></input></td></tr>
<tr><td align='center' colspan=2><input style='display:inline-block;' id='emailb' type='submit' value='Email to ...'></input>  <input onblur="if (this.value.indexOf('@') != -1) { document.getElementById('emailb').style.backgroundColor='yellow'; }" style='display:INLINE-BLOCK;width:50%;' type="email" id="to" name="to" 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='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>