Skip to content

Instantly share code, notes, and snippets.

@hidex7777
Last active December 24, 2022 01:31
Show Gist options
  • Star 5 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save hidex7777/5268678 to your computer and use it in GitHub Desktop.
Save hidex7777/5268678 to your computer and use it in GitHub Desktop.
use of PCCS in SCSS PCCS (Practical Color Co-ordinate System) is copyrighted by Japan Color Research Institute.
//PCCS SCSS variables
//******************************************************
//PCCS (Practical Color Co-ordinate System) is copyrighted
//by Japan Color Research Institute.
//******************************************************
//-=-=-=-=-=-=-=-=
//vivid
//-=-=-=-=-=-=-=-=
$v1: #b91f57; //rgb(185, 31, 87)
$v2: #d02f48; //rgb(208, 47, 72)
$v3: #dd443b; //rgb(221, 68, 59)
$v4: #e95b23; //rgb(233, 91, 35)
$v5: #e67800; //rgb(230, 120, 0)
$v6: #f49d00; //rgb(244, 157, 0)
$v7: #f1b500; //rgb(241, 181, 0)
$v8: #eec900; //rgb(238, 201, 0)
$v9: #d2c100; //rgb(210, 193, 0)
$v10: #a8bb00; //rgb(168, 187, 0)
$v11: #58a91d; //rgb(88, 169, 29)
$v12: #00a15a; //rgb(0, 161, 90)
$v13: #00926e; //rgb(0, 146, 110)
$v14: #00857f; //rgb(0, 133, 127)
$v15: #007488; //rgb(0, 116, 136)
$v16: #00709b; //rgb(0, 112, 155)
$v17: #00609c; //rgb(0, 96, 156)
$v18: #005ba5; //rgb(0, 91, 165)
$v19: #1a54a5; //rgb(26, 84, 165)
$v20: #534aa0; //rgb(83, 74, 160)
$v21: #703f96; //rgb(112, 63, 150)
$v22: #81378a; //rgb(129, 55, 138)
$v23: #8f2e7c; //rgb(143, 46, 124)
$v24: #ad2e6c; //rgb(173, 46, 108)
//-=-=-=-=-=-=-=-=
//bright
//-=-=-=-=-=-=-=-=
$b2: #ef6c70; //rgb(239, 108, 112)
$b4: #fa8155; //rgb(250, 129, 85)
$b6: #ffad36; //rgb(255, 173, 54)
$b8: #fad831; //rgb(250, 216, 49)
$b10: #b7c82b; //rgb(183, 200, 43)
$b12: #41b879; //rgb(65, 184, 121)
$b14: #00aa9f; //rgb(0, 170, 159)
$b16: #0098b9; //rgb(0, 152, 185)
$b18: #2981c0; //rgb(41, 129, 192)
$b20: #7574bc; //rgb(117, 116, 188)
$b22: #a165a8; //rgb(161, 101, 168)
$b24: #d0678e; //rgb(208, 103, 142)
//-=-=-=-=-=-=-=-=
//strong
//-=-=-=-=-=-=-=-=
$s2: #c53f4d; //rgb(197, 63, 77)
$s4: #cc572e; //rgb(204, 87, 46)
$s6: #e19215; //rgb(225, 146, 21)
$s8: #debc03; //rgb(222, 188, 3)
$s10: #9cad00; //rgb(156, 173, 0)
$s12: #008f56; //rgb(0, 143, 86)
$s14: #00827c; //rgb(0, 130, 124)
$s16: #006f92; //rgb(0, 111, 146)
$s18: #005b9b; //rgb(0, 91, 155)
$s20: #534c98; //rgb(83, 76, 152)
$s22: #7c3d84; //rgb(124, 61, 132)
$s24: #a33c6a; //rgb(163, 60, 106)
//-=-=-=-=-=-=-=-=
//deep
//-=-=-=-=-=-=-=-=
$dp2: #a61d39; //rgb(166, 29, 57)
$dp4: #ab3d1d; //rgb(171, 61, 29)
$dp6: #b16c00; //rgb(177, 108, 0)
$dp8: #b39300; //rgb(179, 147, 0)
$dp10: #748400; //rgb(116, 132, 0)
$dp12: #007243; //rgb(0, 114, 67)
$dp14: #006664; //rgb(0, 102, 100)
$dp16: #005476; //rgb(0, 84, 118)
$dp18: #004280; //rgb(0, 66, 128)
$dp20: #3e337b; //rgb(62, 51, 123)
$dp22: #612469; //rgb(97, 36, 105)
$dp24: #861d55; //rgb(134, 29, 85)
//-=-=-=-=-=-=-=-=
//light plus
//-=-=-=-=-=-=-=-=
$ltp2: #f19896; //rgb(241, 152, 150)
$ltp4: #ffa787; //rgb(255, 167, 135)
$ltp6: #ffbe71; //rgb(255, 190, 113)
$ltp8: #f2d96e; //rgb(242, 217, 110)
$ltp10: #c7d36d; //rgb(199, 211, 109)
$ltp12: #85ce9e; //rgb(133, 206, 158)
$ltp14: #62c0b5; //rgb(98, 192, 181)
$ltp16: #5bafc4; //rgb(91, 175, 196)
$ltp18: #6c9ac5; //rgb(108, 154, 197)
$ltp20: #9091c3; //rgb(144, 145, 195)
$ltp22: #b088b5; //rgb(176, 136, 181)
$ltp24: #d98ea5; //rgb(217, 142, 165)
//-=-=-=-=-=-=-=-=
//light
//-=-=-=-=-=-=-=-=
$lt2: #f6aba5; //rgb(246, 171, 165)
$lt4: #ffb99e; //rgb(255, 185, 158)
$lt6: #ffce90; //rgb(255, 206, 144)
$lt8: #fbe68f; //rgb(251, 230, 143)
$lt10: #d8df92; //rgb(216, 223, 146)
$lt12: #9cd9ac; //rgb(156, 217, 172)
$lt14: #7eccc1; //rgb(126, 204, 193)
$lt16: #79baca; //rgb(121, 186, 202)
$lt18: #83a7c8; //rgb(131, 167, 200)
$lt20: #a29fc7; //rgb(162, 159, 199)
$lt22: #b89ab8; //rgb(184, 154, 184)
$lt24: #daa0b3; //rgb(218, 160, 179)
//-=-=-=-=-=-=-=-=
//soft
//-=-=-=-=-=-=-=-=
$sf2: #ca8281; //rgb(202, 130, 129)
$sf4: #da927a; //rgb(218, 146, 122)
$sf6: #dba66b; //rgb(219, 166, 107)
$sf8: #d3bd6c; //rgb(211, 189, 108)
$sf10: #adb66b; //rgb(173, 182, 107)
$sf12: #76b18a; //rgb(118, 177, 138)
$sf14: #54a39b; //rgb(84, 163, 155)
$sf16: #5192a4; //rgb(81, 146, 164)
$sf18: #5d7ea0; //rgb(93, 126, 160)
$sf20: #7878a0; //rgb(120, 120, 160)
$sf22: #907194; //rgb(144, 113, 148)
$sf24: #b4788b; //rgb(180, 120, 139)
//-=-=-=-=-=-=-=-=
//dull
//-=-=-=-=-=-=-=-=
$d2: #a35a5c; //rgb(163, 90, 92)
$d4: #af6954; //rgb(175, 105, 84)
$d6: #b37f46; //rgb(179, 127, 70)
$d8: #ab9446; //rgb(171, 148, 70)
$d10: #858f46; //rgb(133, 143, 70)
$d12: #4f8766; //rgb(79, 135, 102)
$d14: #2a7b76; //rgb(42, 123, 118)
$d16: #246a7d; //rgb(36, 106, 125)
$d18: #34597d; //rgb(52, 89, 125)
$d20: #54527c; //rgb(84, 82, 124)
$d22: #6c4a71; //rgb(108, 74, 113)
$d24: #8b4f65; //rgb(139, 79, 101)
//-=-=-=-=-=-=-=-=
//dark
//-=-=-=-=-=-=-=-=
$dk2: #692934; //rgb(105, 41, 52)
$dk4: #75362a; //rgb(117, 54, 42)
$dk6: #794d1c; //rgb(121, 77, 28)
$dk8: #74601f; //rgb(116, 96, 31)
$dk10: #525b20; //rgb(82, 91, 32)
$dk12: #23523a; //rgb(35, 82, 58)
$dk14: #004746; //rgb(0, 71, 70)
$dk16: #004558; //rgb(0, 69, 88)
$dk18: #123452; //rgb(18, 52, 82)
$dk20: #322d51; //rgb(50, 45, 81)
$dk22: #432848; //rgb(67, 40, 72)
$dk24: #612d46; //rgb(97, 45, 70)
//-=-=-=-=-=-=-=-=
//pale plus
//-=-=-=-=-=-=-=-=
$pp2: #e8c2bf; //rgb(232, 194, 191)
$pp4: #ebc2b5; //rgb(235, 194, 181)
$pp6: #f4d4b0; //rgb(244, 212, 176)
$pp8: #f2e6b8; //rgb(242, 230, 184)
$pp10: #d8ddad; //rgb(216, 221, 173)
$pp12: #aed4b9; //rgb(174, 212, 185)
$pp14: #a6d4cc; //rgb(166, 212, 204)
$pp16: #add1da; //rgb(173, 209, 218)
$pp18: #afc0d1; //rgb(175, 192, 209)
$pp20: #bbbdd0; //rgb(187, 189, 208)
$pp22: #c8b9c9; //rgb(200, 185, 201)
$pp24: #dec4ca; //rgb(222, 196, 202)
//-=-=-=-=-=-=-=-=
//pale
//-=-=-=-=-=-=-=-=
$p2: #e7d5d4; //rgb(231, 213, 212)
$p4: #e9d5cf; //rgb(233, 213, 207)
$p6: #f6e3ce; //rgb(246, 227, 206)
$p8: #efe6c6; //rgb(239, 230, 198)
$p10: #e6e9c6; //rgb(230, 233, 198)
$p12: #c4e0cb; //rgb(196, 224, 203)
$p14: #bfe0d9; //rgb(191, 224, 217)
$p16: #c6dde2; //rgb(198, 221, 226)
$p18: #c2ccd5; //rgb(194, 204, 213)
$p20: #c9cad5; //rgb(201, 202, 213)
$p22: #d0c8d1; //rgb(208, 200, 209)
$p24: #e4d5d9; //rgb(228, 213, 217)
//-=-=-=-=-=-=-=-=
//light grayish
//-=-=-=-=-=-=-=-=
$ltg2: #c0abaa; //rgb(192, 171, 170)
$ltg4: #c1aba5; //rgb(193, 171, 165)
$ltg6: #cebba8; //rgb(206, 187, 168)
$ltg8: #c6bea1; //rgb(198, 190, 161)
$ltg10: #bdc1a2; //rgb(189, 193, 162)
$ltg12: #9db6a5; //rgb(157, 182, 165)
$ltg14: #98b6b1; //rgb(152, 182, 177)
$ltg16: #9eb4b9; //rgb(158, 180, 185)
$ltg18: #9ba5af; //rgb(155, 165, 175)
$ltg20: #a2a2af; //rgb(162, 162, 175)
$ltg22: #aba0ab; //rgb(171, 160, 171)
$ltg24: #bdacb0; //rgb(189, 172, 176)
//-=-=-=-=-=-=-=-=
//grayish
//-=-=-=-=-=-=-=-=
$g2: #745c5c; //rgb(116, 92, 92)
$g4: #755c57; //rgb(117, 92, 87)
$g6: #806c5c; //rgb(128, 108, 92)
$g8: #786f57; //rgb(120, 111, 87)
$g10: #6e725a; //rgb(110, 114, 90)
$g12: #53665a; //rgb(83, 102, 90)
$g14: #4e6764; //rgb(78, 103, 100)
$g16: #4f656c; //rgb(79, 101, 108)
$g18: #4c5765; //rgb(76, 87, 101)
$g20: #565566; //rgb(86, 85, 102)
$g22: #605262; //rgb(96, 82, 98)
$g24: #725c63; //rgb(114, 92, 99)
//-=-=-=-=-=-=-=-=
//dark grayish
//-=-=-=-=-=-=-=-=
$dkg2: #3e2d30; //rgb(62, 45, 48)
$dkg4: #3f2e2c; //rgb(63, 46, 44)
$dkg6: #4a3c32; //rgb(74, 60, 50)
$dkg8: #443e30; //rgb(68, 62, 48)
$dkg10: #3d4033; //rgb(61, 64, 51)
$dkg12: #2a342e; //rgb(42, 52, 46)
$dkg14: #273434; //rgb(39, 52, 52)
$dkg16: #273439; //rgb(39, 52, 57)
$dkg18: #222933; //rgb(34, 41, 51)
$dkg20: #292734; //rgb(41, 39, 52)
$dkg22: #302531; //rgb(48, 37, 49)
$dkg24: #3d2e34; //rgb(61, 46, 52)
//-=-=-=-=-=-=-=-=
//Gy
//-=-=-=-=-=-=-=-=
$W: #ffffff; //rgb(255, 255, 255)
$ltGy: #bfbfbf; //rgb(191, 191, 191)
$mGy: #7f7f7f; //rgb(127, 127, 127)
$dkGy: #3f3f3f; //rgb(63, 63, 63)/
$Bk:#000000; //rgb(0, 0, 0)
$Gy95: #f1f1f1; //rgb(241, 241, 241)//Gy-9.5
$Gy85: #d6d6d6; //rgb(214, 214, 214)//Gy-8.5
$Gy75: #bbbbbb; //rgb(187, 187, 187)//Gy-7.5
$Gy65: #a1a1a1; //rgb(161, 161, 161)//Gy-6.5
$Gy55: #878787; //rgb(135, 135, 135)//Gy-5.5
$Gy45: #6d6d6d; //rgb(109, 109, 109)//Gy-4.5
$Gy35: #545454; //rgb(84, 84, 84)//Gy-3.5
$Gy25: #3c3c3c; //rgb(60, 60, 60)//Gy-2.5
$Gy15: #272727; //rgb(39, 39, 39)//Gy-1.5
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment