@automattic/vip-design-system 0.7.1 → 0.9.1

package/build/system/theme/colors.js

@@ -1,7 +1,7 @@
 "use strict";
 
 exports.__esModule = true;
-exports["default"] = exports.colors = void 0;
+exports["default"] = exports.dark = exports.light = void 0;
 
 /** @jsxImportSource theme-ui */
 
@@ -71,100 +71,222 @@ exports["default"] = exports.colors = void 0;
 // 	return val;
 // }, {} );
 // export default huesObject;
-var colors = {
+var light = {
   black: 'rgba(19, 25, 30, 1)',
   brand: {
-    0: 'rgba(252, 250, 250, 1)',
-    3: 'rgba(245, 242, 241, 1)',
-    7: 'rgba(238, 234, 229, 1)',
-    10: 'rgba(234, 227, 218, 1)',
-    15: 'rgba(227, 208, 184, 1)',
-    20: 'rgba(223, 195, 158, 1)',
-    25: 'rgba(220, 180, 128, 1)',
-    30: 'rgba(216, 164, 95, 1)',
-    35: 'rgba(205, 155, 86, 1)',
-    40: 'rgba(191, 142, 76, 1)',
-    45: 'rgba(179, 131, 67, 1)',
-    50: 'rgba(165, 119, 59, 1)',
-    55: 'rgba(151, 106, 49, 1)',
-    60: 'rgba(136, 93, 38, 1)',
-    65: 'rgba(123, 82, 28, 1)',
-    70: 'rgba(110, 71, 16, 1)',
-    75: 'rgba(94, 57, 4, 1)',
-    80: 'rgba(82, 45, 0, 1)',
-    85: 'rgba(67, 34, 0, 1)',
-    90: 'rgba(53, 22, 1, 1)',
-    95: 'rgba(38, 8, 0, 1)',
-    100: 'rgba(30, 0, 0, 1)'
+    0: '#FEFDFB',
+    3: '#FDF9F5',
+    7: '#FAF3EA',
+    10: '#F7EBDC',
+    20: '#F2DFC8',
+    30: '#EBD1AF',
+    40: '#E0BD8F',
+    50: '#D8A45F',
+    60: '#B96B03',
+    70: '#B96B03',
+    80: '#AB6200',
+    90: '#915300',
+    100: '#2B1C08'
   },
   grey: {
-    0: 'rgba(250, 250, 250, 1)',
-    5: 'rgba(238, 238, 238, 1)',
-    10: 'rgba(225, 225, 225, 1)',
-    15: 'rgba(213, 213, 213, 1)',
-    20: 'rgba(201, 201, 201, 1)',
-    25: 'rgba(189, 189, 189, 1)',
-    30: 'rgba(176, 176, 176, 1)',
-    35: 'rgba(164, 164, 164, 1)',
-    40: 'rgba(152, 152, 152, 1)',
-    45: 'rgba(140, 140, 140, 1)',
-    50: 'rgba(128, 128, 128, 1)',
-    55: 'rgba(115, 115, 115, 1)',
-    60: 'rgba(103, 103, 103, 1)',
-    65: 'rgba(91, 91, 91, 1)',
-    70: 'rgba(79, 79, 79, 1)',
-    75: 'rgba(66, 66, 66, 1)',
-    80: 'rgba(54, 54, 54, 1)',
-    85: 'rgba(42, 42, 42, 1)',
-    90: 'rgba(30, 30, 30, 1)',
-    95: 'rgba(17, 17, 17, 1)',
-    100: 'rgba(5, 5, 5, 1)'
+    0: '#FDFDFC',
+    5: '#F9F9F8',
+    10: '#F3F3F2',
+    20: '#EEEEEC',
+    30: '#EAE8E7',
+    40: '#E4E2E1',
+    50: '#DCDAD8',
+    60: '#C9C6C2',
+    70: '#918F8D',
+    80: '#706F6C',
+    90: '#4E4D4B',
+    100: '#1C1A19'
+  },
+  blue: {
+    0: '#FAFEFE',
+    5: '#F3FCFD',
+    10: '#E9F9FB',
+    20: '#DAF5F8',
+    30: '#C3EEF3',
+    40: '#A9E3EA',
+    50: '#82D5DE',
+    60: '#41C4D2',
+    70: '#009FB1',
+    80: '#0090A0',
+    90: '#007A87',
+    100: '#002B2F'
   },
   green: {
-    0: 'rgba(245, 251, 247, 1)',
-    5: 'rgba(225, 243, 231, 1)',
-    10: 'rgba(198, 234, 208, 1)',
-    15: 'rgba(170, 225, 183, 1)',
-    20: 'rgba(137, 218, 160, 1)',
-    25: 'rgba(109, 209, 139, 1)',
-    30: 'rgba(77, 198, 121, 1)',
-    35: 'rgba(64, 186, 111, 1)',
-    40: 'rgba(48, 172, 99, 1)',
-    45: 'rgba(29, 161, 88, 1)',
-    50: 'rgba(1, 148, 77, 1)',
-    55: 'rgba(0, 136, 64, 1)',
-    60: 'rgba(0, 121, 52, 1)',
-    65: 'rgba(0, 109, 41, 1)',
-    70: 'rgba(0, 97, 30, 1)',
-    75: 'rgba(0, 81, 15, 1)',
-    80: 'rgba(0, 69, 2, 1)',
-    85: 'rgba(0, 55, 0, 1)',
-    90: 'rgba(1, 44, 0, 1)',
-    95: 'rgba(1, 27, 0, 1)',
-    100: 'rgba(1, 8, 0, 1)'
+    0: '#FBFEFC',
+    5: '#F2FCF7',
+    10: '#E9F9F1',
+    20: '#DDF2E8',
+    30: '#CBEADB',
+    40: '#B3DEC9',
+    50: '#91CDB0',
+    60: '#5BB98C',
+    70: '#30A46C',
+    80: '#299762',
+    90: '#18794B',
+    100: '#153224'
+  },
+  pink: {
+    0: 'rgba(255, 248, 246, 1)',
+    5: 'rgba(255, 232, 230, 1)',
+    10: 'rgba(255, 214, 210, 1)',
+    15: 'rgba(255, 197, 193, 1)',
+    20: 'rgba(251, 183, 180, 1)',
+    25: 'rgba(239, 171, 168, 1)',
+    30: 'rgba(226, 158, 157, 1)',
+    35: 'rgba(212, 146, 148, 1)',
+    40: 'rgba(202, 133, 136, 1)',
+    45: 'rgba(188, 122, 126, 1)',
+    50: 'rgba(176, 109, 116, 1)',
+    55: 'rgba(163, 95, 106, 1)',
+    60: 'rgba(149, 83, 93, 1)',
+    65: 'rgba(137, 71, 85, 1)',
+    70: 'rgba(124, 57, 74, 1)',
+    75: 'rgba(109, 41, 62, 1)',
+    80: 'rgba(95, 30, 52, 1)',
+    85: 'rgba(83, 14, 43, 1)',
+    90: 'rgba(69, 0, 31, 1)',
+    95: 'rgba(53, 0, 18, 1)',
+    100: 'rgba(46, 0, 3, 1)'
+  },
+  salmon: {
+    0: 'rgba(254, 248, 248, 1)',
+    5: 'rgba(254, 233, 228, 1)',
+    10: 'rgba(254, 214, 206, 1)',
+    15: 'rgba(254, 195, 177, 1)',
+    20: 'rgba(255, 178, 150, 1)',
+    25: 'rgba(255, 163, 120, 1)',
+    30: 'rgba(249, 148, 94, 1)',
+    35: 'rgba(237, 137, 85, 1)',
+    40: 'rgba(224, 123, 77, 1)',
+    45: 'rgba(210, 113, 70, 1)',
+    50: 'rgba(197, 101, 63, 1)',
+    55: 'rgba(181, 86, 56, 1)',
+    60: 'rgba(167, 73, 48, 1)',
+    65: 'rgba(153, 60, 43, 1)',
+    70: 'rgba(137, 47, 38, 1)',
+    75: 'rgba(124, 30, 30, 1)',
+    80: 'rgba(108, 15, 23, 1)',
+    85: 'rgba(94, 0, 16, 1)',
+    90: 'rgba(78, 0, 0, 1)',
+    95: 'rgba(62, 0, 1, 1)',
+    100: 'rgba(52, 0, 2, 1)'
+  },
+  orange: {
+    0: 'rgba(255, 249, 241, 1)',
+    5: 'rgba(255, 233, 219, 1)',
+    10: 'rgba(255, 215, 189, 1)',
+    15: 'rgba(255, 195, 159, 1)',
+    20: 'rgba(255, 178, 126, 1)',
+    25: 'rgba(254, 159, 95, 1)',
+    30: 'rgba(255, 139, 64, 1)',
+    35: 'rgba(255, 123, 40, 1)',
+    40: 'rgba(244, 110, 21, 1)',
+    45: 'rgba(231, 98, 5, 1)',
+    50: 'rgba(215, 80, 1, 1)',
+    55: 'rgba(197, 73, 0, 1)',
+    60: 'rgba(180, 60, 0, 1)',
+    65: 'rgba(165, 49, 0, 1)',
+    70: 'rgba(148, 38, 1, 1)',
+    75: 'rgba(129, 23, 1, 1)',
+    80: 'rgba(111, 8, 1, 1)',
+    85: 'rgba(95, 0, 0, 1)',
+    90: 'rgba(78, 0, 0, 1)',
+    95: 'rgba(60, 0, 0, 1)',
+    100: 'rgba(50, 0, 3, 1)'
+  },
+  yellow: {
+    0: '#FEFDFB',
+    5: '#FFF9EF',
+    10: '#FFF2DE',
+    20: '#FFEAC8',
+    30: '#FFE0B0',
+    40: '#FFD28B',
+    50: '#F2BB62',
+    60: '#EA9F28',
+    70: '#FFB031',
+    80: '#FBA318',
+    90: '#9C6000',
+    100: '#412800'
+  },
+  red: {
+    0: '#FFFCFC',
+    5: '#FFF8F7',
+    10: '#FFF0EF',
+    20: '#FFE6E4',
+    30: '#FED7D4',
+    40: '#FDC5C1',
+    50: '#F8ACA7',
+    60: '#F08D86',
+    70: '#F04539',
+    80: '#E63B2F',
+    90: '#D42B1E',
+    100: '#361513'
+  }
+};
+exports.light = light;
+var dark = {
+  black: 'rgba(19, 25, 30, 1)',
+  brand: {
+    0: '#1A160F',
+    3: '#231809',
+    7: '#301F08',
+    10: '#301F08',
+    20: '#3A2406',
+    30: '#432804',
+    40: '#502E01',
+    50: '#603700',
+    60: '#774400',
+    70: '#B96B03',
+    80: '#C37A19',
+    90: '#CA8529',
+    100: '#FAF2E7'
+  },
+  grey: {
+    0: '#161615',
+    5: '#1C1C1B',
+    10: '#242221',
+    20: '#282827',
+    30: '#2F2D2C',
+    40: '#353431',
+    50: '#3F3D3B',
+    60: '#524F4C',
+    70: '#726F6A',
+    80: '#807D78',
+    90: '#A29F9B',
+    100: '#EDEDEC'
   },
   blue: {
-    0: 'rgba(250, 251, 255, 1)',
-    5: 'rgba(229, 240, 246, 1)',
-    10: 'rgba(205, 230, 235, 1)',
-    15: 'rgba(178, 221, 230, 1)',
-    20: 'rgba(148, 212, 222, 1)',
-    25: 'rgba(119, 202, 216, 1)',
-    30: 'rgba(84, 192, 205, 1)',
-    35: 'rgba(48, 181, 196, 1)',
-    40: 'rgba(25, 168, 184, 1)',
-    45: 'rgba(0, 155, 173, 1)',
-    50: 'rgba(1, 144, 160, 1)',
-    55: 'rgba(0, 130, 146, 1)',
-    60: 'rgba(0, 117, 134, 1)',
-    65: 'rgba(0, 105, 121, 1)',
-    70: 'rgba(0, 91, 109, 1)',
-    75: 'rgba(0, 77, 95, 1)',
-    80: 'rgba(0, 66, 82, 1)',
-    85: 'rgba(0, 51, 68, 1)',
-    90: 'rgba(1, 40, 57, 1)',
-    95: 'rgba(0, 28, 42, 1)',
-    100: 'rgba(0, 10, 35, 1)'
+    0: '#0B1A1C',
+    5: '#062124',
+    10: '#032D31',
+    20: '#00353B',
+    30: '#003C42',
+    40: '#00444C',
+    50: '#005059',
+    60: '#00636E',
+    70: '#009FB1',
+    80: '#09BDD2',
+    90: '#2AC5D7',
+    100: '#E6F9FB'
+  },
+  green: {
+    0: '#0D1913',
+    5: '#0C1F16',
+    10: '#0F291D',
+    20: '#113122',
+    30: '#133927',
+    40: '#16442E',
+    50: '#1B5439',
+    60: '#236E4A',
+    70: '#30A46C',
+    80: '#3CB179',
+    90: '#4CC389',
+    100: '#E4FAF0'
   },
   pink: {
     0: 'rgba(255, 248, 246, 1)',
@@ -236,52 +358,34 @@ var colors = {
     100: 'rgba(50, 0, 3, 1)'
   },
   yellow: {
-    0: 'rgba(255, 249, 241, 1)',
-    5: 'rgba(255, 233, 209, 1)',
-    10: 'rgba(255, 216, 165, 1)',
-    15: 'rgba(255, 200, 118, 1)',
-    20: 'rgba(255, 184, 74, 1)',
-    25: 'rgba(255, 169, 32, 1)',
-    30: 'rgba(240, 157, 1, 1)',
-    35: 'rgba(226, 145, 1, 1)',
-    40: 'rgba(211, 133, 0, 1)',
-    45: 'rgba(198, 122, 0, 1)',
-    50: 'rgba(184, 110, 1, 1)',
-    55: 'rgba(169, 97, 0, 1)',
-    60: 'rgba(152, 86, 0, 1)',
-    65: 'rgba(137, 75, 0, 1)',
-    70: 'rgba(123, 63, 1, 1)',
-    75: 'rgba(104, 51, 1, 1)',
-    80: 'rgba(89, 40, 0, 1)',
-    85: 'rgba(73, 29, 0, 1)',
-    90: 'rgba(59, 18, 0, 1)',
-    95: 'rgba(43, 4, 0, 1)',
-    100: 'rgba(35, 0, 0, 1)'
+    0: '#1F1300',
+    5: '#261700',
+    10: '#301E00',
+    20: '#3B2400',
+    30: '#462B00',
+    40: '#553400',
+    50: '#674003',
+    60: '#804F00',
+    70: '#FFB031',
+    80: '#FFC568',
+    90: '#F69E12',
+    100: '#FFF2DE'
   },
   red: {
-    0: 'rgba(255, 246, 249, 1)',
-    5: 'rgba(255, 231, 229, 1)',
-    10: 'rgba(255, 213, 206, 1)',
-    15: 'rgba(255, 195, 185, 1)',
-    20: 'rgba(255, 176, 161, 1)',
-    25: 'rgba(254, 157, 140, 1)',
-    30: 'rgba(255, 136, 114, 1)',
-    35: 'rgba(255, 116, 95, 1)',
-    40: 'rgba(255, 95, 77, 1)',
-    45: 'rgba(248, 77, 60, 1)',
-    50: 'rgba(231, 65, 53, 1)',
-    55: 'rgba(211, 55, 43, 1)',
-    60: 'rgba(191, 42, 35, 1)',
-    65: 'rgba(173, 34, 31, 1)',
-    70: 'rgba(154, 26, 25, 1)',
-    75: 'rgba(132, 11, 16, 1)',
-    80: 'rgba(113, 2, 8, 1)',
-    85: 'rgba(94, 0, 0, 1)',
-    90: 'rgba(74, 0, 1, 1)',
-    95: 'rgba(56, 0, 1, 1)',
-    100: 'rgba(46, 0, 2, 1)'
+    0: '#1E1313',
+    5: '#2B1311',
+    10: '#3C1714',
+    20: '#491915',
+    30: '#561B17',
+    40: '#681E19',
+    50: '#832019',
+    60: '#AC241A',
+    70: '#F04539',
+    80: '#F6574B',
+    90: '#FA6459',
+    100: '#FFEEED'
   }
 };
-exports.colors = colors;
-var _default = colors;
+exports.dark = dark;
+var _default = light;
 exports["default"] = _default;