@new-ui/colors 0.1.0 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/README.md +41 -0
  2. package/dist/themes/dark.css +125 -125
  3. package/dist/themes/light.css +172 -124
  4. package/help/dark.png +0 -0
  5. package/help/light.png +0 -0
  6. package/package.json +1 -1
  7. package/tokens/global/global.json +126 -126
  8. package/tokens/themes/dark/dark.json +1 -1
  9. package/tokens/themes/light/light.json +192 -0
package/README.md CHANGED
@@ -1 +1,42 @@
1
1
  ![](help/dark.png)
2
+
3
+ ## Install
4
+ Install New UI Colors from your terminal via npm. Current version is 0.2.0
5
+
6
+ ```
7
+ npm i @new-ui/colors
8
+ ```
9
+
10
+ To get started quickly, you can use the CDN files.
11
+
12
+ Light theme:
13
+ ```
14
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@new-ui/colors@0.2.0/dist/themes/light.css">
15
+ ```
16
+
17
+ Dark theme:
18
+ ```
19
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@new-ui/colors@0.2.0/dist/themes/dark.css">
20
+ ```
21
+
22
+ ## Build
23
+
24
+ To build themes from tokens.
25
+
26
+ ```
27
+ npm install
28
+ ```
29
+
30
+ Light theme:
31
+ ```
32
+ npm run build:tokens -- --theme=light
33
+ ```
34
+
35
+ Dark theme:
36
+ ```
37
+ npm run build:tokens -- --theme=light
38
+ ```
39
+
40
+ ## Get a Figma copy
41
+
42
+ [New UI Colors - Light](https://www.figma.com/community/file/1179503548902179413)
package/dist/themes/dark.css CHANGED
@@ -1,136 +1,136 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 02 Dec 2022 19:43:17 GMT
3
+ * Generated on Sun, 11 Dec 2022 20:27:58 GMT
4
4
  */
5
5
 
6
6
  :root {
7
7
  --white: hsl(0, 0%, 100%);
8
8
  --black: hsl(0, 0%, 0%);
9
9
  --cold10: hsl(206, 16%, 8%);
10
- --cold09: hsl(200, 12%, 15%);
11
- --cold08: hsl(207, 10%, 23%);
12
- --cold07: hsl(207, 7%, 32%);
13
- --cold06: hsl(210, 6%, 44%);
14
- --cold05: hsl(216, 7%, 56%);
15
- --cold04: hsl(210, 8%, 66%);
16
- --cold03: hsl(210, 11%, 78%);
17
- --cold02: hsl(213, 15%, 88%);
18
- --cold01: hsl(220, 30%, 96%);
10
+ --cold9: hsl(200, 12%, 15%);
11
+ --cold8: hsl(207, 10%, 23%);
12
+ --cold7: hsl(207, 7%, 32%);
13
+ --cold6: hsl(210, 6%, 44%);
14
+ --cold5: hsl(216, 7%, 56%);
15
+ --cold4: hsl(210, 8%, 66%);
16
+ --cold3: hsl(210, 11%, 78%);
17
+ --cold2: hsl(213, 15%, 88%);
18
+ --cold1: hsl(220, 30%, 96%);
19
19
  --warm10: hsl(0, 7%, 8%);
20
- --warm09: hsl(0, 3%, 15%);
21
- --warm08: hsl(0, 3%, 23%);
22
- --warm07: hsl(0, 3%, 33%);
23
- --warm06: hsl(0, 2%, 44%);
24
- --warm05: hsl(0, 2%, 55%);
25
- --warm04: hsl(0, 3%, 67%);
26
- --warm03: hsl(10, 5%, 78%);
27
- --warm02: hsl(10, 10%, 89%);
28
- --warm01: hsl(12, 24%, 96%);
20
+ --warm9: hsl(0, 3%, 15%);
21
+ --warm8: hsl(0, 3%, 23%);
22
+ --warm7: hsl(0, 3%, 33%);
23
+ --warm6: hsl(0, 2%, 44%);
24
+ --warm5: hsl(0, 2%, 55%);
25
+ --warm4: hsl(0, 3%, 67%);
26
+ --warm3: hsl(10, 5%, 78%);
27
+ --warm2: hsl(10, 10%, 89%);
28
+ --warm1: hsl(12, 24%, 96%);
29
29
  --grey10: hsl(0, 0%, 9%);
30
- --grey09: hsl(0, 0%, 15%);
31
- --grey08: hsl(0, 0%, 22%);
32
- --grey07: hsl(0, 0%, 32%);
33
- --grey06: hsl(0, 0%, 44%);
34
- --grey05: hsl(0, 0%, 55%);
35
- --grey04: hsl(0, 0%, 66%);
36
- --grey03: hsl(0, 0%, 78%);
37
- --grey02: hsl(0, 0%, 88%);
38
- --grey01: hsl(0, 0%, 96%);
39
- --brown08: hsl(35, 27%, 14%);
40
- --brown07: hsl(34, 26%, 26%);
41
- --brown06: hsl(33, 26%, 38%);
42
- --brown05: hsl(34, 27%, 50%);
43
- --brown04: hsl(34, 26%, 54%);
44
- --brown03: hsl(34, 26%, 74%);
45
- --brown02: hsl(35, 27%, 86%);
46
- --brown01: hsl(33, 29%, 94%);
47
- --pink08: hsl(349, 69%, 16%);
48
- --pink07: hsl(349, 71%, 31%);
49
- --pink06: hsl(348, 70%, 45%);
50
- --pink05: hsl(349, 100%, 59%);
51
- --pink04: hsl(349, 100%, 62%);
52
- --pink03: hsl(349, 100%, 78%);
53
- --pink02: hsl(349, 100%, 89%);
54
- --pink01: hsl(348, 100%, 95%);
55
- --purple08: hsl(280, 46%, 17%);
56
- --purple07: hsl(279, 46%, 31%);
57
- --purple06: hsl(280, 46%, 45%);
58
- --purple05: hsl(280, 68%, 60%);
59
- --purple04: hsl(280, 68%, 63%);
60
- --purple03: hsl(279, 68%, 79%);
61
- --purple02: hsl(280, 68%, 89%);
62
- --purple01: hsl(279, 68%, 95%);
63
- --indigo08: hsl(242, 43%, 16%);
64
- --indigo07: hsl(241, 43%, 31%);
65
- --indigo06: hsl(241, 43%, 45%);
66
- --indigo05: hsl(241, 61%, 59%);
67
- --indigo04: hsl(241, 61%, 62%);
68
- --indigo03: hsl(241, 61%, 79%);
69
- --indigo02: hsl(242, 62%, 89%);
70
- --indigo01: hsl(244, 62%, 95%);
71
- --blue08: hsl(211, 100%, 14%);
72
- --blue07: hsl(211, 100%, 26%);
73
- --blue06: hsl(211, 100%, 38%);
74
- --blue05: hsl(211, 100%, 50%);
75
- --blue04: hsl(211, 100%, 54%);
76
- --blue03: hsl(211, 100%, 74%);
77
- --blue02: hsl(211, 100%, 86%);
78
- --blue01: hsl(211, 100%, 94%);
79
- --cyan08: hsl(199, 64%, 15%);
80
- --cyan07: hsl(199, 64%, 29%);
81
- --cyan06: hsl(199, 64%, 42%);
82
- --cyan05: hsl(199, 78%, 55%);
83
- --cyan04: hsl(199, 78%, 58%);
84
- --cyan03: hsl(199, 78%, 76%);
85
- --cyan02: hsl(199, 78%, 87%);
86
- --cyan01: hsl(199, 79%, 95%);
87
- --teal08: hsl(189, 62%, 13%);
88
- --teal07: hsl(189, 61%, 25%);
89
- --teal06: hsl(189, 61%, 37%);
90
- --teal05: hsl(189, 61%, 48%);
91
- --teal04: hsl(189, 57%, 52%);
92
- --teal03: hsl(189, 58%, 73%);
93
- --teal02: hsl(189, 57%, 85%);
94
- --teal01: hsl(190, 56%, 94%);
95
- --mint08: hsl(178, 100%, 11%);
96
- --mint07: hsl(177, 100%, 20%);
97
- --mint06: hsl(178, 100%, 30%);
98
- --mint05: hsl(177, 100%, 39%);
99
- --mint04: hsl(177, 82%, 44%);
100
- --mint03: hsl(177, 64%, 68%);
101
- --mint02: hsl(178, 63%, 83%);
102
- --mint01: hsl(178, 63%, 93%);
103
- --green08: hsl(136, 59%, 14%);
104
- --green07: hsl(135, 59%, 26%);
105
- --green06: hsl(135, 58%, 37%);
106
- --green05: hsl(135, 59%, 49%);
107
- --green04: hsl(135, 56%, 53%);
108
- --green03: hsl(135, 57%, 74%);
109
- --green02: hsl(136, 56%, 86%);
110
- --green01: hsl(137, 56%, 94%);
111
- --yellow08: hsl(48, 100%, 14%);
112
- --yellow07: hsl(48, 100%, 26%);
113
- --yellow06: hsl(48, 100%, 38%);
114
- --yellow05: hsl(48, 100%, 50%);
115
- --yellow04: hsl(48, 100%, 54%);
116
- --yellow03: hsl(48, 100%, 74%);
117
- --yellow02: hsl(48, 100%, 86%);
118
- --yellow01: hsl(48, 100%, 94%);
119
- --orange08: hsl(35, 100%, 14%);
120
- --orange07: hsl(35, 100%, 26%);
121
- --orange06: hsl(35, 100%, 38%);
122
- --orange05: hsl(35, 100%, 50%);
123
- --orange04: hsl(35, 100%, 54%);
124
- --orange03: hsl(35, 100%, 74%);
125
- --orange02: hsl(35, 100%, 86%);
126
- --orange01: hsl(35, 100%, 94%);
127
- --red08: hsl(2, 68%, 7%);
128
- --red07: hsl(3, 69%, 16%);
129
- --red06: hsl(3, 68%, 31%);
130
- --red05: hsl(3, 100%, 59%);
131
- --red04: hsl(3, 100%, 63%);
132
- --red03: hsl(3, 100%, 79%);
133
- --red02: hsl(3, 100%, 89%);
134
- --red01: hsl(2, 100%, 95%);
135
- --background: var(--grey10);
30
+ --grey9: hsl(0, 0%, 15%);
31
+ --grey8: hsl(0, 0%, 22%);
32
+ --grey7: hsl(0, 0%, 32%);
33
+ --grey6: hsl(0, 0%, 44%);
34
+ --grey5: hsl(0, 0%, 55%);
35
+ --grey4: hsl(0, 0%, 66%);
36
+ --grey3: hsl(0, 0%, 78%);
37
+ --grey2: hsl(0, 0%, 88%);
38
+ --grey1: hsl(0, 0%, 96%);
39
+ --brown8: hsl(35, 27%, 14%);
40
+ --brown7: hsl(34, 26%, 26%);
41
+ --brown6: hsl(33, 26%, 38%);
42
+ --brown5: hsl(34, 27%, 50%);
43
+ --brown4: hsl(34, 26%, 54%);
44
+ --brown3: hsl(34, 26%, 74%);
45
+ --brown2: hsl(35, 27%, 86%);
46
+ --brown1: hsl(33, 29%, 94%);
47
+ --pink8: hsl(349, 69%, 16%);
48
+ --pink7: hsl(349, 71%, 31%);
49
+ --pink6: hsl(348, 70%, 45%);
50
+ --pink5: hsl(349, 100%, 59%);
51
+ --pink4: hsl(349, 100%, 62%);
52
+ --pink3: hsl(349, 100%, 78%);
53
+ --pink2: hsl(349, 100%, 89%);
54
+ --pink1: hsl(348, 100%, 95%);
55
+ --purple8: hsl(280, 46%, 17%);
56
+ --purple7: hsl(279, 46%, 31%);
57
+ --purple6: hsl(280, 46%, 45%);
58
+ --purple5: hsl(280, 68%, 60%);
59
+ --purple4: hsl(280, 68%, 63%);
60
+ --purple3: hsl(279, 68%, 79%);
61
+ --purple2: hsl(280, 68%, 89%);
62
+ --purple1: hsl(279, 68%, 95%);
63
+ --indigo8: hsl(242, 43%, 16%);
64
+ --indigo7: hsl(241, 43%, 31%);
65
+ --indigo6: hsl(241, 43%, 45%);
66
+ --indigo5: hsl(241, 61%, 59%);
67
+ --indigo4: hsl(241, 61%, 62%);
68
+ --indigo3: hsl(241, 61%, 79%);
69
+ --indigo2: hsl(242, 62%, 89%);
70
+ --indigo1: hsl(244, 62%, 95%);
71
+ --blue8: hsl(211, 100%, 14%);
72
+ --blue7: hsl(211, 100%, 26%);
73
+ --blue6: hsl(211, 100%, 38%);
74
+ --blue5: hsl(211, 100%, 50%);
75
+ --blue4: hsl(211, 100%, 54%);
76
+ --blue3: hsl(211, 100%, 74%);
77
+ --blue2: hsl(211, 100%, 86%);
78
+ --blue1: hsl(211, 100%, 94%);
79
+ --cyan8: hsl(199, 64%, 15%);
80
+ --cyan7: hsl(199, 64%, 29%);
81
+ --cyan6: hsl(199, 64%, 42%);
82
+ --cyan5: hsl(199, 78%, 55%);
83
+ --cyan4: hsl(199, 78%, 58%);
84
+ --cyan3: hsl(199, 78%, 76%);
85
+ --cyan2: hsl(199, 78%, 87%);
86
+ --cyan1: hsl(199, 79%, 95%);
87
+ --teal8: hsl(189, 62%, 13%);
88
+ --teal7: hsl(189, 61%, 25%);
89
+ --teal6: hsl(189, 61%, 37%);
90
+ --teal5: hsl(189, 61%, 48%);
91
+ --teal4: hsl(189, 57%, 52%);
92
+ --teal3: hsl(189, 58%, 73%);
93
+ --teal2: hsl(189, 57%, 85%);
94
+ --teal1: hsl(190, 56%, 94%);
95
+ --mint8: hsl(178, 100%, 11%);
96
+ --mint7: hsl(177, 100%, 20%);
97
+ --mint6: hsl(178, 100%, 30%);
98
+ --mint5: hsl(177, 100%, 39%);
99
+ --mint4: hsl(177, 82%, 44%);
100
+ --mint3: hsl(177, 64%, 68%);
101
+ --mint2: hsl(178, 63%, 83%);
102
+ --mint1: hsl(178, 63%, 93%);
103
+ --green8: hsl(136, 59%, 14%);
104
+ --green7: hsl(135, 59%, 26%);
105
+ --green6: hsl(135, 58%, 37%);
106
+ --green5: hsl(135, 59%, 49%);
107
+ --green4: hsl(135, 56%, 53%);
108
+ --green3: hsl(135, 57%, 74%);
109
+ --green2: hsl(136, 56%, 86%);
110
+ --green1: hsl(137, 56%, 94%);
111
+ --yellow8: hsl(48, 100%, 14%);
112
+ --yellow7: hsl(48, 100%, 26%);
113
+ --yellow6: hsl(48, 100%, 38%);
114
+ --yellow5: hsl(48, 100%, 50%);
115
+ --yellow4: hsl(48, 100%, 54%);
116
+ --yellow3: hsl(48, 100%, 74%);
117
+ --yellow2: hsl(48, 100%, 86%);
118
+ --yellow1: hsl(48, 100%, 94%);
119
+ --orange8: hsl(35, 100%, 14%);
120
+ --orange7: hsl(35, 100%, 26%);
121
+ --orange6: hsl(35, 100%, 38%);
122
+ --orange5: hsl(35, 100%, 50%);
123
+ --orange4: hsl(35, 100%, 54%);
124
+ --orange3: hsl(35, 100%, 74%);
125
+ --orange2: hsl(35, 100%, 86%);
126
+ --orange1: hsl(35, 100%, 94%);
127
+ --red8: hsl(3, 69%, 16%);
128
+ --red7: hsl(3, 68%, 31%);
129
+ --red6: hsl(3, 68%, 45%);
130
+ --red5: hsl(3, 100%, 59%);
131
+ --red4: hsl(3, 100%, 63%);
132
+ --red3: hsl(3, 100%, 79%);
133
+ --red2: hsl(3, 100%, 89%);
134
+ --red1: hsl(2, 100%, 95%);
135
+ --background: var(--black);
136
136
  }
package/dist/themes/light.css CHANGED
@@ -1,136 +1,184 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 02 Dec 2022 19:43:03 GMT
3
+ * Generated on Sun, 11 Dec 2022 20:27:52 GMT
4
4
  */
5
5
 
6
6
  :root {
7
7
  --white: hsl(0, 0%, 100%);
8
8
  --black: hsl(0, 0%, 0%);
9
9
  --cold10: hsl(206, 16%, 8%);
10
- --cold09: hsl(200, 12%, 15%);
11
- --cold08: hsl(207, 10%, 23%);
12
- --cold07: hsl(207, 7%, 32%);
13
- --cold06: hsl(210, 6%, 44%);
14
- --cold05: hsl(216, 7%, 56%);
15
- --cold04: hsl(210, 8%, 66%);
16
- --cold03: hsl(210, 11%, 78%);
17
- --cold02: hsl(213, 15%, 88%);
18
- --cold01: hsl(220, 30%, 96%);
10
+ --cold9: hsl(200, 12%, 15%);
11
+ --cold8: hsl(207, 10%, 23%);
12
+ --cold7: hsl(207, 7%, 32%);
13
+ --cold6: hsl(210, 6%, 44%);
14
+ --cold5: hsl(216, 7%, 56%);
15
+ --cold4: hsl(210, 8%, 66%);
16
+ --cold3: hsl(210, 11%, 78%);
17
+ --cold2: hsl(213, 15%, 88%);
18
+ --cold1: hsl(220, 30%, 96%);
19
19
  --warm10: hsl(0, 7%, 8%);
20
- --warm09: hsl(0, 3%, 15%);
21
- --warm08: hsl(0, 3%, 23%);
22
- --warm07: hsl(0, 3%, 33%);
23
- --warm06: hsl(0, 2%, 44%);
24
- --warm05: hsl(0, 2%, 55%);
25
- --warm04: hsl(0, 3%, 67%);
26
- --warm03: hsl(10, 5%, 78%);
27
- --warm02: hsl(10, 10%, 89%);
28
- --warm01: hsl(12, 24%, 96%);
20
+ --warm9: hsl(0, 3%, 15%);
21
+ --warm8: hsl(0, 3%, 23%);
22
+ --warm7: hsl(0, 3%, 33%);
23
+ --warm6: hsl(0, 2%, 44%);
24
+ --warm5: hsl(0, 2%, 55%);
25
+ --warm4: hsl(0, 3%, 67%);
26
+ --warm3: hsl(10, 5%, 78%);
27
+ --warm2: hsl(10, 10%, 89%);
28
+ --warm1: hsl(12, 24%, 96%);
29
29
  --grey10: hsl(0, 0%, 9%);
30
- --grey09: hsl(0, 0%, 15%);
31
- --grey08: hsl(0, 0%, 22%);
32
- --grey07: hsl(0, 0%, 32%);
33
- --grey06: hsl(0, 0%, 44%);
34
- --grey05: hsl(0, 0%, 55%);
35
- --grey04: hsl(0, 0%, 66%);
36
- --grey03: hsl(0, 0%, 78%);
37
- --grey02: hsl(0, 0%, 88%);
38
- --grey01: hsl(0, 0%, 96%);
39
- --brown08: hsl(35, 27%, 14%);
40
- --brown07: hsl(34, 26%, 26%);
41
- --brown06: hsl(33, 26%, 38%);
42
- --brown05: hsl(34, 27%, 50%);
43
- --brown04: hsl(34, 26%, 54%);
44
- --brown03: hsl(34, 26%, 74%);
45
- --brown02: hsl(35, 27%, 86%);
46
- --brown01: hsl(33, 29%, 94%);
47
- --pink08: hsl(349, 69%, 16%);
48
- --pink07: hsl(349, 71%, 31%);
49
- --pink06: hsl(348, 70%, 45%);
50
- --pink05: hsl(349, 100%, 59%);
51
- --pink04: hsl(349, 100%, 62%);
52
- --pink03: hsl(349, 100%, 78%);
53
- --pink02: hsl(349, 100%, 89%);
54
- --pink01: hsl(348, 100%, 95%);
55
- --purple08: hsl(280, 46%, 17%);
56
- --purple07: hsl(279, 46%, 31%);
57
- --purple06: hsl(280, 46%, 45%);
58
- --purple05: hsl(280, 68%, 60%);
59
- --purple04: hsl(280, 68%, 63%);
60
- --purple03: hsl(279, 68%, 79%);
61
- --purple02: hsl(280, 68%, 89%);
62
- --purple01: hsl(279, 68%, 95%);
63
- --indigo08: hsl(242, 43%, 16%);
64
- --indigo07: hsl(241, 43%, 31%);
65
- --indigo06: hsl(241, 43%, 45%);
66
- --indigo05: hsl(241, 61%, 59%);
67
- --indigo04: hsl(241, 61%, 62%);
68
- --indigo03: hsl(241, 61%, 79%);
69
- --indigo02: hsl(242, 62%, 89%);
70
- --indigo01: hsl(244, 62%, 95%);
71
- --blue08: hsl(211, 100%, 14%);
72
- --blue07: hsl(211, 100%, 26%);
73
- --blue06: hsl(211, 100%, 38%);
74
- --blue05: hsl(211, 100%, 50%);
75
- --blue04: hsl(211, 100%, 54%);
76
- --blue03: hsl(211, 100%, 74%);
77
- --blue02: hsl(211, 100%, 86%);
78
- --blue01: hsl(211, 100%, 94%);
79
- --cyan08: hsl(199, 64%, 15%);
80
- --cyan07: hsl(199, 64%, 29%);
81
- --cyan06: hsl(199, 64%, 42%);
82
- --cyan05: hsl(199, 78%, 55%);
83
- --cyan04: hsl(199, 78%, 58%);
84
- --cyan03: hsl(199, 78%, 76%);
85
- --cyan02: hsl(199, 78%, 87%);
86
- --cyan01: hsl(199, 79%, 95%);
87
- --teal08: hsl(189, 62%, 13%);
88
- --teal07: hsl(189, 61%, 25%);
89
- --teal06: hsl(189, 61%, 37%);
90
- --teal05: hsl(189, 61%, 48%);
91
- --teal04: hsl(189, 57%, 52%);
92
- --teal03: hsl(189, 58%, 73%);
93
- --teal02: hsl(189, 57%, 85%);
94
- --teal01: hsl(190, 56%, 94%);
95
- --mint08: hsl(178, 100%, 11%);
96
- --mint07: hsl(177, 100%, 20%);
97
- --mint06: hsl(178, 100%, 30%);
98
- --mint05: hsl(177, 100%, 39%);
99
- --mint04: hsl(177, 82%, 44%);
100
- --mint03: hsl(177, 64%, 68%);
101
- --mint02: hsl(178, 63%, 83%);
102
- --mint01: hsl(178, 63%, 93%);
103
- --green08: hsl(136, 59%, 14%);
104
- --green07: hsl(135, 59%, 26%);
105
- --green06: hsl(135, 58%, 37%);
106
- --green05: hsl(135, 59%, 49%);
107
- --green04: hsl(135, 56%, 53%);
108
- --green03: hsl(135, 57%, 74%);
109
- --green02: hsl(136, 56%, 86%);
110
- --green01: hsl(137, 56%, 94%);
111
- --yellow08: hsl(48, 100%, 14%);
112
- --yellow07: hsl(48, 100%, 26%);
113
- --yellow06: hsl(48, 100%, 38%);
114
- --yellow05: hsl(48, 100%, 50%);
115
- --yellow04: hsl(48, 100%, 54%);
116
- --yellow03: hsl(48, 100%, 74%);
117
- --yellow02: hsl(48, 100%, 86%);
118
- --yellow01: hsl(48, 100%, 94%);
119
- --orange08: hsl(35, 100%, 14%);
120
- --orange07: hsl(35, 100%, 26%);
121
- --orange06: hsl(35, 100%, 38%);
122
- --orange05: hsl(35, 100%, 50%);
123
- --orange04: hsl(35, 100%, 54%);
124
- --orange03: hsl(35, 100%, 74%);
125
- --orange02: hsl(35, 100%, 86%);
126
- --orange01: hsl(35, 100%, 94%);
127
- --red08: hsl(2, 68%, 7%);
128
- --red07: hsl(3, 69%, 16%);
129
- --red06: hsl(3, 68%, 31%);
130
- --red05: hsl(3, 100%, 59%);
131
- --red04: hsl(3, 100%, 63%);
132
- --red03: hsl(3, 100%, 79%);
133
- --red02: hsl(3, 100%, 89%);
134
- --red01: hsl(2, 100%, 95%);
30
+ --grey9: hsl(0, 0%, 15%);
31
+ --grey8: hsl(0, 0%, 22%);
32
+ --grey7: hsl(0, 0%, 32%);
33
+ --grey6: hsl(0, 0%, 44%);
34
+ --grey5: hsl(0, 0%, 55%);
35
+ --grey4: hsl(0, 0%, 66%);
36
+ --grey3: hsl(0, 0%, 78%);
37
+ --grey2: hsl(0, 0%, 88%);
38
+ --grey1: hsl(0, 0%, 96%);
39
+ --brown8: hsl(35, 27%, 14%);
40
+ --brown7: hsl(34, 26%, 26%);
41
+ --brown6: hsl(33, 26%, 38%);
42
+ --brown5: hsl(34, 27%, 50%);
43
+ --brown4: hsl(34, 26%, 54%);
44
+ --brown3: hsl(34, 26%, 74%);
45
+ --brown2: hsl(35, 27%, 86%);
46
+ --brown1: hsl(33, 29%, 94%);
47
+ --pink8: hsl(349, 69%, 16%);
48
+ --pink7: hsl(349, 71%, 31%);
49
+ --pink6: hsl(348, 70%, 45%);
50
+ --pink5: hsl(349, 100%, 59%);
51
+ --pink4: hsl(349, 100%, 62%);
52
+ --pink3: hsl(349, 100%, 78%);
53
+ --pink2: hsl(349, 100%, 89%);
54
+ --pink1: hsl(348, 100%, 95%);
55
+ --purple8: hsl(280, 46%, 17%);
56
+ --purple7: hsl(279, 46%, 31%);
57
+ --purple6: hsl(280, 46%, 45%);
58
+ --purple5: hsl(280, 68%, 60%);
59
+ --purple4: hsl(280, 68%, 63%);
60
+ --purple3: hsl(279, 68%, 79%);
61
+ --purple2: hsl(280, 68%, 89%);
62
+ --purple1: hsl(279, 68%, 95%);
63
+ --indigo8: hsl(242, 43%, 16%);
64
+ --indigo7: hsl(241, 43%, 31%);
65
+ --indigo6: hsl(241, 43%, 45%);
66
+ --indigo5: hsl(241, 61%, 59%);
67
+ --indigo4: hsl(241, 61%, 62%);
68
+ --indigo3: hsl(241, 61%, 79%);
69
+ --indigo2: hsl(242, 62%, 89%);
70
+ --indigo1: hsl(244, 62%, 95%);
71
+ --blue8: hsl(211, 100%, 14%);
72
+ --blue7: hsl(211, 100%, 26%);
73
+ --blue6: hsl(211, 100%, 38%);
74
+ --blue5: hsl(211, 100%, 50%);
75
+ --blue4: hsl(211, 100%, 54%);
76
+ --blue3: hsl(211, 100%, 74%);
77
+ --blue2: hsl(211, 100%, 86%);
78
+ --blue1: hsl(211, 100%, 94%);
79
+ --cyan8: hsl(199, 64%, 15%);
80
+ --cyan7: hsl(199, 64%, 29%);
81
+ --cyan6: hsl(199, 64%, 42%);
82
+ --cyan5: hsl(199, 78%, 55%);
83
+ --cyan4: hsl(199, 78%, 58%);
84
+ --cyan3: hsl(199, 78%, 76%);
85
+ --cyan2: hsl(199, 78%, 87%);
86
+ --cyan1: hsl(199, 79%, 95%);
87
+ --teal8: hsl(189, 62%, 13%);
88
+ --teal7: hsl(189, 61%, 25%);
89
+ --teal6: hsl(189, 61%, 37%);
90
+ --teal5: hsl(189, 61%, 48%);
91
+ --teal4: hsl(189, 57%, 52%);
92
+ --teal3: hsl(189, 58%, 73%);
93
+ --teal2: hsl(189, 57%, 85%);
94
+ --teal1: hsl(190, 56%, 94%);
95
+ --mint8: hsl(178, 100%, 11%);
96
+ --mint7: hsl(177, 100%, 20%);
97
+ --mint6: hsl(178, 100%, 30%);
98
+ --mint5: hsl(177, 100%, 39%);
99
+ --mint4: hsl(177, 82%, 44%);
100
+ --mint3: hsl(177, 64%, 68%);
101
+ --mint2: hsl(178, 63%, 83%);
102
+ --mint1: hsl(178, 63%, 93%);
103
+ --green8: hsl(136, 59%, 14%);
104
+ --green7: hsl(135, 59%, 26%);
105
+ --green6: hsl(135, 58%, 37%);
106
+ --green5: hsl(135, 59%, 49%);
107
+ --green4: hsl(135, 56%, 53%);
108
+ --green3: hsl(135, 57%, 74%);
109
+ --green2: hsl(136, 56%, 86%);
110
+ --green1: hsl(137, 56%, 94%);
111
+ --yellow8: hsl(48, 100%, 14%);
112
+ --yellow7: hsl(48, 100%, 26%);
113
+ --yellow6: hsl(48, 100%, 38%);
114
+ --yellow5: hsl(48, 100%, 50%);
115
+ --yellow4: hsl(48, 100%, 54%);
116
+ --yellow3: hsl(48, 100%, 74%);
117
+ --yellow2: hsl(48, 100%, 86%);
118
+ --yellow1: hsl(48, 100%, 94%);
119
+ --orange8: hsl(35, 100%, 14%);
120
+ --orange7: hsl(35, 100%, 26%);
121
+ --orange6: hsl(35, 100%, 38%);
122
+ --orange5: hsl(35, 100%, 50%);
123
+ --orange4: hsl(35, 100%, 54%);
124
+ --orange3: hsl(35, 100%, 74%);
125
+ --orange2: hsl(35, 100%, 86%);
126
+ --orange1: hsl(35, 100%, 94%);
127
+ --red8: hsl(3, 69%, 16%);
128
+ --red7: hsl(3, 68%, 31%);
129
+ --red6: hsl(3, 68%, 45%);
130
+ --red5: hsl(3, 100%, 59%);
131
+ --red4: hsl(3, 100%, 63%);
132
+ --red3: hsl(3, 100%, 79%);
133
+ --red2: hsl(3, 100%, 89%);
134
+ --red1: hsl(2, 100%, 95%);
135
+ --text-success: var(--green6);
136
+ --text-error: var(--red6);
137
+ --text-on-color: var(--white);
138
+ --text-placeholder: var(--warm4);
139
+ --text-secondary: var(--warm7);
140
+ --text-primary-alt: var(--warm8);
141
+ --text-primary: var(--warm10);
142
+ --support-info: var(--blue5);
143
+ --support-success: var(--green5);
144
+ --support-warning: var(--yellow5);
145
+ --support-error: var(--red5);
146
+ --link-visited: var(--indigo5);
147
+ --link-subtle: var(--warm7);
148
+ --link-hover: var(--blue6);
149
+ --link: var(--blue5);
150
+ --icon-on-color: var(--white);
151
+ --icon-disabled: var(--warm7);
152
+ --icon-secondary: var(--warm8);
153
+ --icon-primary: var(--warm9);
154
+ --button-disabled: var(--warm4);
155
+ --button-danger-active: var(--red7);
156
+ --button-danger-hover: var(--red6);
157
+ --button-danger: var(--red5);
158
+ --button-secondary-active: var(--warm6);
159
+ --button-secondary-hover: var(--warm7);
160
+ --button-secondary: var(--warm8);
161
+ --button-primary-active: var(--blue7);
162
+ --button-primary-hover: var(--blue6);
163
+ --button-primary: var(--blue5);
164
+ --border-strong: var(--warm6);
165
+ --border-default: var(--warm4);
166
+ --border-muted: var(--warm2);
167
+ --background-brown: var(--brown1);
168
+ --background-pink: var(--pink1);
169
+ --background-purple: var(--purple1);
170
+ --background-indigo: var(--indigo1);
171
+ --background-blue: var(--blue1);
172
+ --background-cyan: var(--cyan1);
173
+ --background-teal: var(--teal1);
174
+ --background-mint: var(--mint1);
175
+ --background-green: var(--green1);
176
+ --background-yellow: var(--yellow1);
177
+ --background-orange: var(--orange1);
178
+ --background-red: var(--red1);
179
+ --background-selected-hover: var(--warm3);
180
+ --background-selected: var(--warm2);
181
+ --background-hover: var(--warm1);
182
+ --background-secondary: var(--warm1);
135
183
  --background: var(--white);
136
184
  }
package/help/dark.png CHANGED
Binary file
package/help/light.png ADDED
Binary file
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@new-ui/colors",
3
- "version": "0.1.0",
3
+ "version": "0.2.0",
4
4
  "description": "![](help/dark.png)",
5
5
  "main": "index.js",
6
6
  "scripts": {