Merge pull request #126 from nih-sparc/update-cmyk-color-values

Updated documentation CMYK color values

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nih-sparc/sparc-design-system-components",
-  "version": "0.26.26",
+  "version": "0.26.27",
   "private": false,
   "scripts": {
     "serve": "vue-cli-service serve",

src/stories/colors/colors.js

@@ -3,23 +3,23 @@ export const primary = [
     name: 'Purple',
     hex: '#8300bf',
     rbg: '131-0-191',
-    cmyk: '24, 75, 0, 25',
+    cmyk: '67, 93, 0, 0',
     usage: 'Repeating major elements across the site like links and buttons',
     variable: '$purple'
   },
   {
     name: 'Dark Blue',
     hex: '#24245b',
     rbg: '36-36-91',
-    cmyk: '22, 22, 0, 64',
+    cmyk: '100, 97, 34, 28',
     usage: 'Repeating major elements across the site like heros, icons and header text',
     variable: '$darkBlue'
   },
   {
     name: 'Grey',
     hex: '#303133',
     rbg: '48-49-31',
-    cmyk: '6, 4, 0, 80',
+    cmyk: '71. 64, 61, 59',
     usage: 'Typography and icons',
     variable: '$grey'
   }
@@ -30,15 +30,15 @@ export const secondary = [
     name: 'Light Purple',
     hex: '#bc00fc',
     rbg: '188-0-252',
-    cmyk: '25, 99, 0, 1',
+    cmyk: '52, 83, 0, 0',
     usage: 'Decorative elements such as illustrations',
     variable: '$lightPurple'
   },
   {
     name: 'Blue',
     hex: '#0026ff',
     rbg: '0-38-255',
-    cmyk: '25, 99, 0, 1',
+    cmyk: '89, 78, 0, 0',
     usage: 'Decorative elements such as illustrations',
     variable: '$blue'
   }
@@ -49,23 +49,23 @@ export const status = [
     name: 'Success',
     hex: '#5e9f69',
     rbg: '94-159-105',
-    cmyk: '90, 0, 48, 10',
+    cmyk: '67, 20, 74, 3',
     usage: 'Confirmation messages',
     variable: '$success'
   },
   {
     name: 'Warning',
     hex: '#ff8400',
     rbg: '221-117-51',
-    cmyk: '0, 41, 67, 13',
+    cmyk: '1, 59, 100, 0',
     usage: 'To warn users of potentially harmful situation',
     variable: '$warning'
   },
   {
     name: 'Danger',
     hex: '#b51d09',
     rbg: '181-29-9',
-    cmyk: '0, 60, 67, 29',
+    cmyk: '22, 98, 100, 15',
     usage: 'Error messages and confirmation for deletion',
     variable: '$danger'
   }
@@ -75,24 +75,24 @@ export const text = [
   {
     name: '',
     hex: '#303133',
-    rbg: '220-6-20',
-    cmyk: '1, 1, 0, 80',
+    rbg: '48-49-51',
+    cmyk: '71, 64, 61, 59',
     usage: 'For body text',
     variable: '$grey'
   },
   {
     name: '',
     hex: '#606266',
     rbg: '96-98-102',
-    cmyk: '2, 2, 0, 60',
+    cmyk: '63, 53, 49, 21',
     usage: 'For footer text',
     variable: '$mediumGrey'
   },
   {
     name: '',
     hex: '#909399',
     rbg: '144-147-153',
-    cmyk: '4, 2, 0, 60',
+    cmyk: '47, 37, 33, 1',
     usage: 'For labels and ghost text',
     variable: '$lightGrey'
   }
@@ -103,15 +103,15 @@ export const line = [
     name: '',
     hex: '#dcdfe6',
     rbg: '220-223-230',
-    cmyk: '4, 3, 0, 10',
+    cmyk: '12, 8, 5, 0',
     usage: 'For cards',
     variable: '$lineColor1'
   },
   {
     name: '',
     hex: '#e4e7ed',
     rbg: '228-231-237',
-    cmyk: '4, 2, 0, 7',
+    cmyk: '9, 6, 3, 0',
     usage: 'For table/dividers/breadcrumb backgrounds',
     variable: '$lineColor2'
   }
@@ -122,7 +122,7 @@ export const background = [
     name: '',
     hex: '#f5f7fa',
     rbg: '245, 247, 250',
-    cmyk: '2, 1, 0, 2',
+    cmyk: '3, 1, 0, 0',
     usage: 'For page backgrounds',
     variable: '$background'
   }