RGB→CMYK


動作ブラウザ 【 IE:3.0  NN:2.0
Internet Explorer Netscape Navigator DreamPassport iCab
3.0x 4.0x 4.5 5.0x 5.5 2.0x 3.0x 4.0x 4.x 6.0 2 3 2.x
Windows - - -
Macintosh - - -
UNIX - - - - - - - -
Dreamcast - - - - - - - - - - -

ポイント max = 1; c0= max - r; m0= max - g; y0= max - b; k0= min3(c0,m0,y0); c = min2(max,max2(0,c0-UCR(k0))); m = min2(max,max2(0,m0-UCR(k0))); y = min2(max,max2(0,y0-UCR(k0))); k = min2(max,max2(0,BG(k0)));
説  明 RGB(赤緑青)からCMYK(シアン、マゼンタ、イエロー、ブラック)への変換方法はいくつかあります。代表的なものとしては「下色除去(UCR:Under Color Removal)」「グレー置き換え(Gray-Component Replacement)」があります。サンプルでは下色除去法を使っています。原理としてはRGBからCMYへ変換し、最小値をKとします。このKの部分を各色から減算します。
サンプル <html> <head> <title>RGB→CMYK</title> <script Language="JavaScript"><!-- function RGBtoCMYK() { max = 1; // 最大輝度 r = eval(document.myFORM.red.value); g = eval(document.myFORM.green.value); b = eval(document.myFORM.blue.value); c0= max - r; m0= max - g; y0= max - b; k0= min3(c0,m0,y0); c = min2(max,max2(0,c0-UCR(k0))); m = min2(max,max2(0,m0-UCR(k0))); y = min2(max,max2(0,y0-UCR(k0))); k = min2(max,max2(0,BG(k0))); document.myFORM.cyan.value = c; document.myFORM.magenta.value = m; document.myFORM.yellow.value = y; document.myFORM.black.value = k; } function min3(cc,mm,yy) { if ((cc < mm) && (cc < yy)) return cc; if ((mm < cc) && (mm < yy)) return mm; return yy; } function min2(a,b) { if (a < b) return a; else return b; // 2値の小さい方を返す } function max2(a,b) { if (a > b) return a; else return b; // 2値の大きい方を返す } function UCR(n) { return n; // 下色除去。0〜Kの範囲を返す(0:スミなし、K:スミ量) } function BG(n) { return n; // スミ版合成処理 } // --></script> </head> <body> CMYKの範囲は0〜1<br> <form name="myFORM"> 赤:<input type="text" name="red"><br> 緑:<input type="text" name="green"><br> 青:<input type="text" name="blue"><br> <input type="button" onClick="RGBtoCMYK()" value="CMYKに変換"><br>  シアン(C):<input type="text" name="cyan"><br> マゼンタ(M):<input type="text" name="magenta"><br> イエロー(Y):<input type="text" name="yellow"><br> ブラック(K):<input type="text" name="black"><br> </form> </body> </html>
補足説明 なし

■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!

写真素材 PIXTA