Skip to content

Instantly share code, notes, and snippets.

@teyepe
Last active May 21, 2016 19:52
Show Gist options
  • Save teyepe/5db81f7dbd6636b9ee60 to your computer and use it in GitHub Desktop.
Save teyepe/5db81f7dbd6636b9ee60 to your computer and use it in GitHub Desktop.
CMYK conversions based on Photoshop's color profiles. Based on https://github.com/at-import/color-schemer/blob/master/stylesheets/color-schemer/_cmyk.scss
// CMYK conversion function:
// [1] Coated_FOGRA27
// [2] Coated_FOGRA39
// [3] Coated_GRACoL_2006
// [4] Japan_Color_2001_Coated
// [5] Japan_Color_2001_Uncoated
// [6] Japan_Color_2002_Newspaper
// [7] Japan_Color_2003_Web_Coated
// [8] Japan_Web_Coated
// [9] US_Sheetfed_Coated_v2
// [10] US_Sheetfed_Uncoated_v2
// [11] US_Web_Coated_v2
// [12] US_Web_Uncoated_v2
// [13] Uncoated_FOGRA29
// [14] Web_Coated_FOGRA28
// [15] Web_Coated_SWOP_2006_Grade_3_Paper
// [16] Web_Coated_SWOP_2006_Grade_5_Paper
// [17] Euroscale_Coated_v2
// [18] Euroscale_Unoated_v2
// [19] Legacy_Photoshop_Default_CMYK
$profiles: (
Coated_FOGRA27: (
C: rgb(0, 158, 224),
M: rgb(226, 0, 122),
Y: rgb(255, 237, 0),
K: rgb(26, 23, 27)
),
Coated_FOGRA39: (
C: rgb(0, 159, 227),
M: rgb(230, 0, 126),
Y: rgb(255, 237, 0),
K: rgb(29, 29, 27)
),
Coated_GRACoL_2006: (
C: rgb(0, 159, 227),
M: rgb(229, 0, 120),
Y: rgb(255, 237, 0),
K: rgb(27, 27, 26)
),
Japan_Color_2001_Coated: (
C: rgb(0, 161, 233),
M: rgb(228, 0, 127),
Y: rgb(255, 241, 0),
K: rgb(35, 25, 22)
),
Japan_Color_2001_Uncoated: (
C: rgb(0, 157, 226),
M: rgb(230, 49, 131),
Y: rgb(255, 245, 15),
K: rgb(68, 63, 53)
),
Japan_Color_2002_Newspaper: (
C: rgb(0, 183, 244),
M: rgb(246, 86, 160),
Y: rgb(255, 243, 38),
K: rgb(32, 19, 0)
),
Japan_Color_2003_Web_Coated: (
C: rgb(0, 155, 228),
M: rgb(232, 0, 128),
Y: rgb(255, 240, 0),
K: rgb(25, 20, 15)
),
Japan_Web_Coated: (
C: rgb(0, 156, 222),
M: rgb(218, 0, 128),
Y: rgb(255, 239, 0),
K: rgb(31, 20, 15)
),
US_Sheetfed_Coated_v2: (
C: rgb(0, 163, 230),
M: rgb(227, 33, 126),
Y: rgb(255, 237, 0),
K: rgb(28, 27, 26)
),
US_Sheetfed_Uncoated_v2: (
C: rgb(0, 162, 227),
M: rgb(220, 23, 111),
Y: rgb(255, 236, 0),
K: rgb(32, 34, 29)
),
US_Web_Coated_v2: (
C: rgb(0, 174, 239),
M: rgb(236, 0, 140),
Y: rgb(255, 242, 0),
K: rgb(35, 31, 32)
),
US_Web_Uncoated_v2: (
C: rgb(0, 162, 227),
M: rgb(220, 23, 111),
Y: rgb(255, 236, 0),
K: rgb(32, 34, 29)
),
Uncoated_FOGRA29: (
C: rgb(0, 157, 222),
M: rgb(228, 46, 135),
Y: rgb(255, 232, 0),
K: rgb(46, 32, 20)
),
Web_Coated_FOGRA28: (
C: rgb(0, 165, 232),
M: rgb(227, 0, 124),
Y: rgb(255, 233, 0),
K: rgb(27, 24, 25)
),
Web_Coated_SWOP_2006_Grade_3_Paper: (
C: rgb(0, 170, 234),
M: rgb(233, 0, 131),
Y: rgb(255, 242, 0),
K: rgb(36, 36, 37)
),
Web_Coated_SWOP_2006_Grade_5_Paper: (
C: rgb(0, 174, 240),
M: rgb(236, 4, 140),
Y: rgb(255, 242, 0),
K: rgb(40, 37, 39)
),
Euroscale_Coated_v2: (
C: rgb(0, 166, 235),
M: rgb(229, 0, 131),
Y: rgb(255, 237, 0),
K: rgb(27, 28, 32)
),
Euroscale_Uncoated_v2: (
C: rgb(0, 185, 243),
M: rgb(232, 42, 140),
Y: rgb(255, 240, 13),
K: rgb(56, 58, 59)
),
Legacy_Photoshop_Default_CMYK: (
C: rgb(0, 168, 236),
M: rgb(227, 0, 123),
Y: rgb(248, 244, 0),
K: rgb(0, 0, 0)
)
);
@function C($profile, $Cy: 'C') {
@return map-get(map-get($profiles, $profile), $Cy);
}
@function M($profile, $Ma: 'M') {
@return map-get(map-get($profiles, $profile), $Ma);
}
@function Y($profile, $Ye: 'Y') {
@return map-get(map-get($profiles, $profile), $Ye);
}
@function K($profile, $Bl: 'K') {
@return map-get(map-get($profiles, $profile), $Bl);
}
@function cmyk($cyan, $magenta, $yellow, $black, $profile: false) {
@if map-has-key($profiles, $profile) {
$cyan : mix(C($profile, $Cy: 'C'), white, $cyan);
$magenta : mix(M($profile, $Ma: 'M'), white, $magenta);
$yellow : mix(Y($profile, $Ye: 'Y'), white, $yellow);
$black : mix(K($profile, $Bl: 'K'), white, $black);
} @else {
$cyan : mix(cyan, white, $cyan);
$magenta : mix(magenta, white, $magenta);
$yellow : mix(yellow, white, $yellow);
$black : mix(black, white, $black);
}
$color: white - invert($cyan) - invert($magenta) - invert($yellow) - invert($black);
@return $color;
}
// EXAMPLE:
// $profile: 'US_Web_Coated_v2';
// .element {
// background-color: cmyk(75, 5, 40, 0, $profile);
// .child {
// background-color: cmyk(24, 0, 5, 0);
// }
// .child-red {
// background-color: cmyk(0, 95, 100, 0, Japan_Color_2002_Newspaper);
// }
// }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment