Skip to content

Commit d12b1aa

Browse files
wpkelsowpkelso
committed
pin extended colors to rgb values
1 parent 38df2a2 commit d12b1aa

File tree

1 file changed

+103
-52
lines changed

1 file changed

+103
-52
lines changed

‎lib/Styles/Common/_palette.scss‎

Lines changed: 103 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,209 +1,260 @@
11
// Internal Palette
22
$STRAWBERRY_100: #ff8c82;
3+
$STRAWBERRY_200: #f6706a;
34
$STRAWBERRY_300: #ed5353;
5+
$STRAWBERRY_400: #da3c40;
46
$STRAWBERRY_500: #c6262e;
7+
$STRAWBERRY_600: #b4161a;
58
$STRAWBERRY_700: #a10705;
9+
$STRAWBERRY_800: #8e0402;
610
$STRAWBERRY_900: #7a0000;
7-
$STRAWBERRY_200: mix($STRAWBERRY_100, $STRAWBERRY_300, 50%);
8-
$STRAWBERRY_400: mix($STRAWBERRY_300, $STRAWBERRY_500, 50%);
9-
$STRAWBERRY_600: mix($STRAWBERRY_500, $STRAWBERRY_700, 50%);
10-
$STRAWBERRY_800: mix($STRAWBERRY_700, $STRAWBERRY_900, 50%);
1111

1212
$ORANGE_100: #ffc27d;
13+
$ORANGE_200: #ffb268;
1314
$ORANGE_300: #ffa154;
15+
$ORANGE_400: #f98a3e;
1416
$ORANGE_500: #f37329;
17+
$ORANGE_600: #e05716;
1518
$ORANGE_700: #cc3b02;
19+
$ORANGE_800: #b92e01;
1620
$ORANGE_900: #a62100;
17-
$ORANGE_200: mix($ORANGE_100, $ORANGE_300, 50%);
18-
$ORANGE_400: mix($ORANGE_300, $ORANGE_500, 50%);
19-
$ORANGE_600: mix($ORANGE_500, $ORANGE_700, 50%);
20-
$ORANGE_800: mix($ORANGE_700, $ORANGE_900, 50%);
2121

2222
$BANANA_100: #fff394;
23+
$BANANA_200: #ffea80;
2324
$BANANA_300: #ffe16b;
25+
$BANANA_400: #fcd256;
2426
$BANANA_500: #f9c440;
27+
$BANANA_600: #e6a92a;
2528
$BANANA_700: #d48e15;
29+
$BANANA_800: #c0760a;
2630
$BANANA_900: #ad5f00;
27-
$BANANA_200: mix($BANANA_100, $BANANA_300, 50%);
28-
$BANANA_400: mix($BANANA_300, $BANANA_500, 50%);
29-
$BANANA_600: mix($BANANA_500, $BANANA_700, 50%);
30-
$BANANA_800: mix($BANANA_700, $BANANA_900, 50%);
3131

3232
$LIME_100: #d1ff82;
33+
$LIME_200: #b6ed68;
3334
$LIME_300: #9bdb4d;
35+
$LIME_400: #82c938;
3436
$LIME_500: #68b723;
37+
$LIME_600: #51a414;
3538
$LIME_700: #3a9104;
39+
$LIME_800: #2d7e02;
3640
$LIME_900: #206b00;
37-
$LIME_200: mix($LIME_100, $LIME_300, 50%);
38-
$LIME_400: mix($LIME_300, $LIME_500, 50%);
39-
$LIME_600: mix($LIME_500, $LIME_700, 50%);
40-
$LIME_800: mix($LIME_700, $LIME_900, 50%);
4141

4242
$MINT_100: #89ffdd;
43+
$MINT_200: #66eac9;
4344
$MINT_300: #43d6b5;
45+
$MINT_400: #36c9ac;
4446
$MINT_500: #28bca3;
47+
$MINT_600: #1bab93;
4548
$MINT_700: #0e9a83;
49+
$MINT_800: #078675;
4650
$MINT_900: #007367;
47-
$MINT_200: mix($MINT_100, $MINT_300, 50%);
48-
$MINT_400: mix($MINT_300, $MINT_500, 50%);
49-
$MINT_600: mix($MINT_500, $MINT_700, 50%);
50-
$MINT_800: mix($MINT_700, $MINT_900, 50%);
5151

5252
$BLUEBERRY_100: #8cd5ff;
53+
$BLUEBERRY_200: #78c8ff;
5354
$BLUEBERRY_300: #64baff;
55+
$BLUEBERRY_400: #4da2f2;
5456
$BLUEBERRY_500: #3689e6;
57+
$BLUEBERRY_600: #226ed2;
5558
$BLUEBERRY_700: #0d52bf;
59+
$BLUEBERRY_800: #0640ac;
5660
$BLUEBERRY_900: #002e99;
57-
$BLUEBERRY_200: mix($BLUEBERRY_100, $BLUEBERRY_300, 50%);
58-
$BLUEBERRY_400: mix($BLUEBERRY_300, $BLUEBERRY_500, 50%);
59-
$BLUEBERRY_600: mix($BLUEBERRY_500, $BLUEBERRY_700, 50%);
60-
$BLUEBERRY_800: mix($BLUEBERRY_700, $BLUEBERRY_900, 50%);
6161

6262
$GRAPE_100: #e4c6fa;
63+
$GRAPE_200: #d8b2f8;
6364
$GRAPE_300: #cd9ef7;
65+
$GRAPE_400: #b986ec;
6466
$GRAPE_500: #a56de2;
67+
$GRAPE_600: #8c53ca;
6568
$GRAPE_700: #7239b3;
69+
$GRAPE_800: #5c319a;
6670
$GRAPE_900: #452981;
67-
$GRAPE_200: mix($GRAPE_100, $GRAPE_300, 50%);
68-
$GRAPE_400: mix($GRAPE_300, $GRAPE_500, 50%);
69-
$GRAPE_600: mix($GRAPE_500, $GRAPE_700, 50%);
70-
$GRAPE_800: mix($GRAPE_700, $GRAPE_900, 50%);
7171

7272
$BUBBLEGUM_100: #fe9ab8;
73+
$BUBBLEGUM_200: #f980aa;
7374
$BUBBLEGUM_300: #f4679d;
75+
$BUBBLEGUM_400: #e9528e;
7476
$BUBBLEGUM_500: #de3e80;
77+
$BUBBLEGUM_600: #cd316e;
7578
$BUBBLEGUM_700: #bc245d;
79+
$BUBBLEGUM_800: #a6194a;
7680
$BUBBLEGUM_900: #910e38;
77-
$BUBBLEGUM_200: mix($BUBBLEGUM_100, $BUBBLEGUM_300, 50%);
78-
$BUBBLEGUM_400: mix($BUBBLEGUM_300, $BUBBLEGUM_500, 50%);
79-
$BUBBLEGUM_600: mix($BUBBLEGUM_500, $BUBBLEGUM_700, 50%);
80-
$BUBBLEGUM_800: mix($BUBBLEGUM_700, $BUBBLEGUM_900, 50%);
8181

8282
$LATTE_100: #efdfc4;
83+
$LATTE_200: #ebd2aa;
8384
$LATTE_300: #e7c591;
85+
$LATTE_400: #dbb478;
8486
$LATTE_500: #cfa25e;
87+
$LATTE_600: #c29146;
8588
$LATTE_700: #b6802e;
89+
$LATTE_800: #9b6617;
8690
$LATTE_900: #804b00;
87-
$LATTE_200: mix($LATTE_100, $LATTE_300, 50%);
88-
$LATTE_400: mix($LATTE_300, $LATTE_500, 50%);
89-
$LATTE_600: mix($LATTE_500, $LATTE_700, 50%);
90-
$LATTE_800: mix($LATTE_700, $LATTE_900, 50%);
9191

9292
$COCOA_100: #a3907c;
93+
$COCOA_200: #96806d;
9394
$COCOA_300: #8a715e;
95+
$COCOA_400: #7e6251;
9496
$COCOA_500: #715344;
97+
$COCOA_600: #644638;
9598
$COCOA_700: #57392d;
99+
$COCOA_800: #4a2d24;
96100
$COCOA_900: #3d211b;
97-
$COCOA_200: mix($COCOA_100, $COCOA_300, 50%);
98-
$COCOA_400: mix($COCOA_300, $COCOA_500, 50%);
99-
$COCOA_600: mix($COCOA_500, $COCOA_700, 50%);
100-
$COCOA_800: mix($COCOA_700, $COCOA_900, 50%);
101101

102102
$SILVER_100: #fafafa;
103+
$SILVER_200: #e7e7e7;
103104
$SILVER_300: #d4d4d4;
105+
$SILVER_400: #c0c0c1;
104106
$SILVER_500: #abacae;
107+
$SILVER_600: #94969a;
105108
$SILVER_700: #7e8087;
109+
$SILVER_800: #6a6c74;
106110
$SILVER_900: #555761;
107-
$SILVER_200: mix($SILVER_100, $SILVER_300, 50%);
108-
$SILVER_400: mix($SILVER_300, $SILVER_500, 50%);
109-
$SILVER_600: mix($SILVER_500, $SILVER_700, 50%);
110-
$SILVER_800: mix($SILVER_700, $SILVER_900, 50%);
111111

112112
$SLATE_100: #95a3ab;
113+
$SLATE_200: #7e8e98;
113114
$SLATE_300: #667885;
115+
$SLATE_400: #576978;
114116
$SLATE_500: #485a6c;
117+
$SLATE_600: #384758;
115118
$SLATE_700: #273445;
119+
$SLATE_800: #1a2432;
116120
$SLATE_900: #0e141f;
117-
$SLATE_200: mix($SLATE_100, $SLATE_300, 50%);
118-
$SLATE_400: mix($SLATE_300, $SLATE_500, 50%);
119-
$SLATE_600: mix($SLATE_500, $SLATE_700, 50%);
120-
$SLATE_800: mix($SLATE_700, $SLATE_900, 50%);
121121

122122
$BLACK_100: #666;
123+
$BLACK_200: #5a5a5a;
123124
$BLACK_300: #4d4d4d;
125+
$BLACK_400: #404040;
124126
$BLACK_500: #333;
127+
$BLACK_600: #262626;
125128
$BLACK_700: #1a1a1a;
129+
$BLACK_800: #0d0d0d;
126130
$BLACK_900: #000;
127-
$BLACK_200: mix($BLACK_100, $BLACK_300, 50%);
128-
$BLACK_400: mix($BLACK_300, $BLACK_500, 50%);
129-
$BLACK_600: mix($BLACK_500, $BLACK_700, 50%);
130-
$BLACK_800: mix($BLACK_700, $BLACK_900, 50%);
131131

132132
// Exported Gtk
133133
@define-color STRAWBERRY_100 #{$STRAWBERRY_100};
134+
@define-color STRAWBERRY_200 #{$STRAWBERRY_200};
134135
@define-color STRAWBERRY_300 #{$STRAWBERRY_300};
136+
@define-color STRAWBERRY_400 #{$STRAWBERRY_400};
135137
@define-color STRAWBERRY_500 #{$STRAWBERRY_500};
138+
@define-color STRAWBERRY_600 #{$STRAWBERRY_600};
136139
@define-color STRAWBERRY_700 #{$STRAWBERRY_700};
140+
@define-color STRAWBERRY_800 #{$STRAWBERRY_800};
137141
@define-color STRAWBERRY_900 #{$STRAWBERRY_900};
138142

139143
@define-color ORANGE_100 #{$ORANGE_100};
144+
@define-color ORANGE_200 #{$ORANGE_200};
140145
@define-color ORANGE_300 #{$ORANGE_300};
146+
@define-color ORANGE_400 #{$ORANGE_400};
141147
@define-color ORANGE_500 #{$ORANGE_500};
148+
@define-color ORANGE_600 #{$ORANGE_600};
142149
@define-color ORANGE_700 #{$ORANGE_700};
150+
@define-color ORANGE_800 #{$ORANGE_800};
143151
@define-color ORANGE_900 #{$ORANGE_900};
144152

145153
@define-color BANANA_100 #{$BANANA_100};
154+
@define-color BANANA_200 #{$BANANA_200};
146155
@define-color BANANA_300 #{$BANANA_300};
156+
@define-color BANANA_400 #{$BANANA_400};
147157
@define-color BANANA_500 #{$BANANA_500};
158+
@define-color BANANA_600 #{$BANANA_600};
148159
@define-color BANANA_700 #{$BANANA_700};
160+
@define-color BANANA_800 #{$BANANA_800};
149161
@define-color BANANA_900 #{$BANANA_900};
150162

151163
@define-color LIME_100 #{$LIME_100};
164+
@define-color LIME_200 #{$LIME_200};
152165
@define-color LIME_300 #{$LIME_300};
166+
@define-color LIME_400 #{$LIME_400};
153167
@define-color LIME_500 #{$LIME_500};
168+
@define-color LIME_600 #{$LIME_600};
154169
@define-color LIME_700 #{$LIME_700};
155170
@define-color LIME_900 #{$LIME_900};
156171

157172
@define-color MINT_100 #{$MINT_100};
173+
@define-color MINT_200 #{$MINT_200};
158174
@define-color MINT_300 #{$MINT_300};
175+
@define-color MINT_400 #{$MINT_400};
159176
@define-color MINT_500 #{$MINT_500};
177+
@define-color MINT_600 #{$MINT_600};
160178
@define-color MINT_700 #{$MINT_700};
179+
@define-color MINT_800 #{$MINT_800};
161180
@define-color MINT_900 #{$MINT_900};
162181

163182
@define-color BLUEBERRY_100 #{$BLUEBERRY_100};
183+
@define-color BLUEBERRY_200 #{$BLUEBERRY_200};
164184
@define-color BLUEBERRY_300 #{$BLUEBERRY_300};
185+
@define-color BLUEBERRY_400 #{$BLUEBERRY_400};
165186
@define-color BLUEBERRY_500 #{$BLUEBERRY_500};
187+
@define-color BLUEBERRY_600 #{$BLUEBERRY_600};
166188
@define-color BLUEBERRY_700 #{$BLUEBERRY_700};
189+
@define-color BLUEBERRY_800 #{$BLUEBERRY_800};
167190
@define-color BLUEBERRY_900 #{$BLUEBERRY_900};
168191

169192
@define-color GRAPE_100 #{$GRAPE_100};
193+
@define-color GRAPE_200 #{$GRAPE_200};
170194
@define-color GRAPE_300 #{$GRAPE_300};
195+
@define-color GRAPE_400 #{$GRAPE_400};
171196
@define-color GRAPE_500 #{$GRAPE_500};
197+
@define-color GRAPE_600 #{$GRAPE_600};
172198
@define-color GRAPE_700 #{$GRAPE_700};
199+
@define-color GRAPE_800 #{$GRAPE_800};
173200
@define-color GRAPE_900 #{$GRAPE_900};
174201

175202
@define-color BUBBLEGUM_100 #{$BUBBLEGUM_100};
203+
@define-color BUBBLEGUM_200 #{$BUBBLEGUM_200};
176204
@define-color BUBBLEGUM_300 #{$BUBBLEGUM_300};
205+
@define-color BUBBLEGUM_400 #{$BUBBLEGUM_400};
177206
@define-color BUBBLEGUM_500 #{$BUBBLEGUM_500};
207+
@define-color BUBBLEGUM_600 #{$BUBBLEGUM_600};
178208
@define-color BUBBLEGUM_700 #{$BUBBLEGUM_700};
209+
@define-color BUBBLEGUM_800 #{$BUBBLEGUM_800};
179210
@define-color BUBBLEGUM_900 #{$BUBBLEGUM_900};
180211

181212
@define-color LATTE_100 #{$LATTE_100};
213+
@define-color LATTE_200 #{$LATTE_200};
182214
@define-color LATTE_300 #{$LATTE_300};
215+
@define-color LATTE_400 #{$LATTE_400};
183216
@define-color LATTE_500 #{$LATTE_500};
217+
@define-color LATTE_600 #{$LATTE_600};
184218
@define-color LATTE_700 #{$LATTE_700};
219+
@define-color LATTE_800 #{$LATTE_800};
185220
@define-color LATTE_900 #{$LATTE_900};
186221

187222
@define-color COCOA_100 #{$COCOA_100};
223+
@define-color COCOA_200 #{$COCOA_200};
188224
@define-color COCOA_300 #{$COCOA_300};
225+
@define-color COCOA_400 #{$COCOA_400};
189226
@define-color COCOA_500 #{$COCOA_500};
227+
@define-color COCOA_600 #{$COCOA_600};
190228
@define-color COCOA_700 #{$COCOA_700};
229+
@define-color COCOA_800 #{$COCOA_800};
191230
@define-color COCOA_900 #{$COCOA_900};
192231

193232
@define-color SILVER_100 #{$SILVER_100};
233+
@define-color SILVER_200 #{$SILVER_200};
194234
@define-color SILVER_300 #{$SILVER_300};
235+
@define-color SILVER_400 #{$SILVER_400};
195236
@define-color SILVER_500 #{$SILVER_500};
237+
@define-color SILVER_600 #{$SILVER_600};
196238
@define-color SILVER_700 #{$SILVER_700};
239+
@define-color SILVER_800 #{$SILVER_800};
197240
@define-color SILVER_900 #{$SILVER_900};
198241

199242
@define-color SLATE_100 #{$SLATE_100};
243+
@define-color SLATE_200 #{$SLATE_200};
200244
@define-color SLATE_300 #{$SLATE_300};
245+
@define-color SLATE_400 #{$SLATE_400};
201246
@define-color SLATE_500 #{$SLATE_500};
247+
@define-color SLATE_600 #{$SLATE_600};
202248
@define-color SLATE_700 #{$SLATE_700};
249+
@define-color SLATE_800 #{$SLATE_800};
203250
@define-color SLATE_900 #{$SLATE_900};
204251

205252
@define-color BLACK_100 #{$BLACK_100};
253+
@define-color BLACK_200 #{$BLACK_200};
206254
@define-color BLACK_300 #{$BLACK_300};
255+
@define-color BLACK_400 #{$BLACK_400};
207256
@define-color BLACK_500 #{$BLACK_500};
257+
@define-color BLACK_600 #{$BLACK_600};
208258
@define-color BLACK_700 #{$BLACK_700};
259+
@define-color BLACK_800 #{$BLACK_800};
209260
@define-color BLACK_900 #{"" + $BLACK_900};

0 commit comments

Comments
 (0)