@bcc-code/design-tokens 2.0.15 → 2.0.17

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 (7) hide show
  1. package/build/bcc/cdn/light.css +80 -80
  2. package/build/bcc/cdn/variables.css +80 -80
  3. package/build/bcc/primevue/index.d.ts +35 -4
  4. package/build/bcc/primevue/override.js +48 -15
  5. package/build/bcc/tailwind/index.css +0 -1
  6. package/build/bcc/tailwind/light.css +80 -80
  7. package/package.json +1 -1
package/build/bcc/cdn/light.css CHANGED
@@ -45,52 +45,52 @@
45
45
  --color-bcc-1000: #002320;
46
46
 
47
47
  /* COLOR: ORANGE */
48
- --color-orange-100: #fcf6f4;
49
- --color-orange-200: #f9ece7;
50
- --color-orange-300: #f6dcd2;
51
- --color-orange-400: #e9b29e;
52
- --color-orange-500: #e29f87;
53
- --color-orange-600: #d37f60;
54
- --color-orange-700: #be6544;
55
- --color-orange-800: #9f5236;
56
- --color-orange-900: #844630;
57
- --color-orange-1000: #4c271a;
48
+ --color-orange-100: #fcf3ef;
49
+ --color-orange-200: #f7dbcc;
50
+ --color-orange-300: #f2bda6;
51
+ --color-orange-400: #ed9f83;
52
+ --color-orange-500: #dd8263;
53
+ --color-orange-600: #c36e54;
54
+ --color-orange-700: #a55c45;
55
+ --color-orange-800: #864a35;
56
+ --color-orange-900: #683927;
57
+ --color-orange-1000: #4a281a;
58
58
 
59
59
  /* COLOR: RED */
60
- --color-red-100: #fcf4f4;
61
- --color-red-200: #fae7e6;
62
- --color-red-300: #f6d3d2;
63
- --color-red-400: #efb4b2;
64
- --color-red-500: #e38986;
65
- --color-red-600: #d5625e;
66
- --color-red-700: #c04642;
67
- --color-red-800: #ad3c38;
68
- --color-red-900: #86312e;
69
- --color-red-1000: #461716;
60
+ --color-red-100: #fff1ed;
61
+ --color-red-200: #ffdad2;
62
+ --color-red-300: #f7a399;
63
+ --color-red-400: #ee7a69;
64
+ --color-red-500: #db5944;
65
+ --color-red-600: #c7402e;
66
+ --color-red-700: #a83423;
67
+ --color-red-800: #86291b;
68
+ --color-red-900: #6b1f15;
69
+ --color-red-1000: #4f140d;
70
70
 
71
71
  /* COLOR: GREEN */
72
- --color-green-100: #f2fbf6;
73
- --color-green-200: #e2f6ea;
74
- --color-green-300: #c6ecd6;
75
- --color-green-400: #9adbb5;
76
- --color-green-500: #66c28d;
77
- --color-green-600: #40a56c;
78
- --color-green-700: #308957;
79
- --color-green-800: #296c47;
80
- --color-green-900: #25563b;
81
- --color-green-1000: #133925;
72
+ --color-green-100: #e8fbed;
73
+ --color-green-200: #c2f0d2;
74
+ --color-green-300: #95e6b6;
75
+ --color-green-400: #62da9c;
76
+ --color-green-500: #37cf83;
77
+ --color-green-600: #1fbf71;
78
+ --color-green-700: #169b5a;
79
+ --color-green-800: #0f7744;
80
+ --color-green-900: #08532d;
81
+ --color-green-1000: #003b1c;
82
82
 
83
83
  /* COLOR: TEAL */
84
- --color-teal-100: #f1f9fa;
85
- --color-teal-200: #dceff1;
86
- --color-teal-300: #bde0e4;
87
- --color-teal-400: #8fc9d1;
88
- --color-teal-500: #5cabb7;
89
- --color-teal-600: #3e8e9c;
90
- --color-teal-700: #377483;
91
- --color-teal-800: #32606c;
92
- --color-teal-900: #2f505b;
93
- --color-teal-1000: #1d353f;
84
+ --color-teal-100: #e4faf8;
85
+ --color-teal-200: #b6f0eb;
86
+ --color-teal-300: #85e6de;
87
+ --color-teal-400: #56d6d1;
88
+ --color-teal-500: #2bc4c2;
89
+ --color-teal-600: #00b0b5;
90
+ --color-teal-700: #00929a;
91
+ --color-teal-800: #00757f;
92
+ --color-teal-900: #005962;
93
+ --color-teal-1000: #003d45;
94
94
 
95
95
  /* COLOR: BROWN */
96
96
  --color-brown-100: #f7f3ee;
@@ -105,40 +105,40 @@
105
105
  --color-brown-1000: #3c3420;
106
106
 
107
107
  /* COLOR: BLUE */
108
- --color-blue-100: #f1f7fd;
109
- --color-blue-200: #dfedfa;
110
- --color-blue-300: #c6e0f7;
111
- --color-blue-400: #a0cdf0;
112
- --color-blue-500: #72b1e8;
113
- --color-blue-600: #5294e0;
114
- --color-blue-700: #3c79d4;
115
- --color-blue-800: #3365c2;
116
- --color-blue-900: #2f529e;
117
- --color-blue-1000: #25385f;
108
+ --color-blue-100: #e8f3ff;
109
+ --color-blue-200: #cce0ff;
110
+ --color-blue-300: #99c2ff;
111
+ --color-blue-400: #66a6ff;
112
+ --color-blue-500: #338aff;
113
+ --color-blue-600: #0065ff;
114
+ --color-blue-700: #0052cc;
115
+ --color-blue-800: #0747a6;
116
+ --color-blue-900: #053e85;
117
+ --color-blue-1000: #092c66;
118
118
 
119
119
  /* COLOR: PURPLE */
120
- --color-purple-100: #f1f1fc;
121
- --color-purple-200: #e5e7fa;
122
- --color-purple-300: #d0d1f5;
123
- --color-purple-400: #b3b3ee;
124
- --color-purple-500: #9b95e4;
125
- --color-purple-600: #8678d9;
126
- --color-purple-700: #7860cb;
127
- --color-purple-800: #6750b2;
128
- --color-purple-900: #554390;
129
- --color-purple-1000: #352c54;
120
+ --color-purple-100: #f3f0ff;
121
+ --color-purple-200: #dfd7ff;
122
+ --color-purple-300: #b8acff;
123
+ --color-purple-400: #9982ff;
124
+ --color-purple-500: #7a5aff;
125
+ --color-purple-600: #5e37ff;
126
+ --color-purple-700: #4722cc;
127
+ --color-purple-800: #3319a3;
128
+ --color-purple-900: #26157a;
129
+ --color-purple-1000: #1b0f52;
130
130
 
131
131
  /* COLOR: MAGENTA */
132
- --color-magenta-100: #faf5f9;
133
- --color-magenta-200: #f7ecf5;
134
- --color-magenta-300: #f0daec;
135
- --color-magenta-400: #e4bddd;
136
- --color-magenta-500: #d294c5;
137
- --color-magenta-600: #c377b1;
138
- --color-magenta-700: #ac5693;
139
- --color-magenta-800: #93437a;
140
- --color-magenta-900: #7a3a65;
141
- --color-magenta-1000: #592648;
132
+ --color-magenta-100: #fff0f8;
133
+ --color-magenta-200: #ffd2ec;
134
+ --color-magenta-300: #ff94d5;
135
+ --color-magenta-400: #f562c8;
136
+ --color-magenta-500: #e037b8;
137
+ --color-magenta-600: #cc1bac;
138
+ --color-magenta-700: #a11388;
139
+ --color-magenta-800: #7a0d66;
140
+ --color-magenta-900: #550944;
141
+ --color-magenta-1000: #3b052e;
142
142
 
143
143
  /* COLOR: NEUTRAL-ALPHA */
144
144
  --color-neutral-alpha-100-a: rgba(9, 30, 77, 0.03);
@@ -155,16 +155,16 @@
155
155
  --color-dark-neutral-alpha-500-a: rgba(166, 197, 226, 0.5);
156
156
 
157
157
  /* COLOR: YELLOW */
158
- --color-yellow-100: #f7f3ee;
159
- --color-yellow-200: #ede5da;
160
- --color-yellow-300: #dccfba;
161
- --color-yellow-400: #c5b191;
162
- --color-yellow-500: #ae966d;
163
- --color-yellow-600: #937b4f;
164
- --color-yellow-700: #74613c;
165
- --color-yellow-800: #5a4d31;
166
- --color-yellow-900: #49402b;
167
- --color-yellow-1000: #3c3420;
158
+ --color-yellow-100: #fcf9ec;
159
+ --color-yellow-200: #f7eecb;
160
+ --color-yellow-300: #eddc96;
161
+ --color-yellow-400: #e6cf72;
162
+ --color-yellow-500: #e1be5d;
163
+ --color-yellow-600: #d7aa41;
164
+ --color-yellow-700: #c58c35;
165
+ --color-yellow-800: #b46e2d;
166
+ --color-yellow-900: #9f5226;
167
+ --color-yellow-1000: #7c331b;
168
168
 
169
169
  /* COLOR: TEXT */
170
170
  --color-text-default: var(--color-neutral-1100);
package/build/bcc/cdn/variables.css CHANGED
@@ -45,52 +45,52 @@
45
45
  --color-bcc-1000: #002320;
46
46
 
47
47
  /* COLOR: ORANGE */
48
- --color-orange-100: #fcf6f4;
49
- --color-orange-200: #f9ece7;
50
- --color-orange-300: #f6dcd2;
51
- --color-orange-400: #e9b29e;
52
- --color-orange-500: #e29f87;
53
- --color-orange-600: #d37f60;
54
- --color-orange-700: #be6544;
55
- --color-orange-800: #9f5236;
56
- --color-orange-900: #844630;
57
- --color-orange-1000: #4c271a;
48
+ --color-orange-100: #fcf3ef;
49
+ --color-orange-200: #f7dbcc;
50
+ --color-orange-300: #f2bda6;
51
+ --color-orange-400: #ed9f83;
52
+ --color-orange-500: #dd8263;
53
+ --color-orange-600: #c36e54;
54
+ --color-orange-700: #a55c45;
55
+ --color-orange-800: #864a35;
56
+ --color-orange-900: #683927;
57
+ --color-orange-1000: #4a281a;
58
58
 
59
59
  /* COLOR: RED */
60
- --color-red-100: #fcf4f4;
61
- --color-red-200: #fae7e6;
62
- --color-red-300: #f6d3d2;
63
- --color-red-400: #efb4b2;
64
- --color-red-500: #e38986;
65
- --color-red-600: #d5625e;
66
- --color-red-700: #c04642;
67
- --color-red-800: #ad3c38;
68
- --color-red-900: #86312e;
69
- --color-red-1000: #461716;
60
+ --color-red-100: #fff1ed;
61
+ --color-red-200: #ffdad2;
62
+ --color-red-300: #f7a399;
63
+ --color-red-400: #ee7a69;
64
+ --color-red-500: #db5944;
65
+ --color-red-600: #c7402e;
66
+ --color-red-700: #a83423;
67
+ --color-red-800: #86291b;
68
+ --color-red-900: #6b1f15;
69
+ --color-red-1000: #4f140d;
70
70
 
71
71
  /* COLOR: GREEN */
72
- --color-green-100: #f2fbf6;
73
- --color-green-200: #e2f6ea;
74
- --color-green-300: #c6ecd6;
75
- --color-green-400: #9adbb5;
76
- --color-green-500: #66c28d;
77
- --color-green-600: #40a56c;
78
- --color-green-700: #308957;
79
- --color-green-800: #296c47;
80
- --color-green-900: #25563b;
81
- --color-green-1000: #133925;
72
+ --color-green-100: #e8fbed;
73
+ --color-green-200: #c2f0d2;
74
+ --color-green-300: #95e6b6;
75
+ --color-green-400: #62da9c;
76
+ --color-green-500: #37cf83;
77
+ --color-green-600: #1fbf71;
78
+ --color-green-700: #169b5a;
79
+ --color-green-800: #0f7744;
80
+ --color-green-900: #08532d;
81
+ --color-green-1000: #003b1c;
82
82
 
83
83
  /* COLOR: TEAL */
84
- --color-teal-100: #f1f9fa;
85
- --color-teal-200: #dceff1;
86
- --color-teal-300: #bde0e4;
87
- --color-teal-400: #8fc9d1;
88
- --color-teal-500: #5cabb7;
89
- --color-teal-600: #3e8e9c;
90
- --color-teal-700: #377483;
91
- --color-teal-800: #32606c;
92
- --color-teal-900: #2f505b;
93
- --color-teal-1000: #1d353f;
84
+ --color-teal-100: #e4faf8;
85
+ --color-teal-200: #b6f0eb;
86
+ --color-teal-300: #85e6de;
87
+ --color-teal-400: #56d6d1;
88
+ --color-teal-500: #2bc4c2;
89
+ --color-teal-600: #00b0b5;
90
+ --color-teal-700: #00929a;
91
+ --color-teal-800: #00757f;
92
+ --color-teal-900: #005962;
93
+ --color-teal-1000: #003d45;
94
94
 
95
95
  /* COLOR: BROWN */
96
96
  --color-brown-100: #f7f3ee;
@@ -105,40 +105,40 @@
105
105
  --color-brown-1000: #3c3420;
106
106
 
107
107
  /* COLOR: BLUE */
108
- --color-blue-100: #f1f7fd;
109
- --color-blue-200: #dfedfa;
110
- --color-blue-300: #c6e0f7;
111
- --color-blue-400: #a0cdf0;
112
- --color-blue-500: #72b1e8;
113
- --color-blue-600: #5294e0;
114
- --color-blue-700: #3c79d4;
115
- --color-blue-800: #3365c2;
116
- --color-blue-900: #2f529e;
117
- --color-blue-1000: #25385f;
108
+ --color-blue-100: #e8f3ff;
109
+ --color-blue-200: #cce0ff;
110
+ --color-blue-300: #99c2ff;
111
+ --color-blue-400: #66a6ff;
112
+ --color-blue-500: #338aff;
113
+ --color-blue-600: #0065ff;
114
+ --color-blue-700: #0052cc;
115
+ --color-blue-800: #0747a6;
116
+ --color-blue-900: #053e85;
117
+ --color-blue-1000: #092c66;
118
118
 
119
119
  /* COLOR: PURPLE */
120
- --color-purple-100: #f1f1fc;
121
- --color-purple-200: #e5e7fa;
122
- --color-purple-300: #d0d1f5;
123
- --color-purple-400: #b3b3ee;
124
- --color-purple-500: #9b95e4;
125
- --color-purple-600: #8678d9;
126
- --color-purple-700: #7860cb;
127
- --color-purple-800: #6750b2;
128
- --color-purple-900: #554390;
129
- --color-purple-1000: #352c54;
120
+ --color-purple-100: #f3f0ff;
121
+ --color-purple-200: #dfd7ff;
122
+ --color-purple-300: #b8acff;
123
+ --color-purple-400: #9982ff;
124
+ --color-purple-500: #7a5aff;
125
+ --color-purple-600: #5e37ff;
126
+ --color-purple-700: #4722cc;
127
+ --color-purple-800: #3319a3;
128
+ --color-purple-900: #26157a;
129
+ --color-purple-1000: #1b0f52;
130
130
 
131
131
  /* COLOR: MAGENTA */
132
- --color-magenta-100: #faf5f9;
133
- --color-magenta-200: #f7ecf5;
134
- --color-magenta-300: #f0daec;
135
- --color-magenta-400: #e4bddd;
136
- --color-magenta-500: #d294c5;
137
- --color-magenta-600: #c377b1;
138
- --color-magenta-700: #ac5693;
139
- --color-magenta-800: #93437a;
140
- --color-magenta-900: #7a3a65;
141
- --color-magenta-1000: #592648;
132
+ --color-magenta-100: #fff0f8;
133
+ --color-magenta-200: #ffd2ec;
134
+ --color-magenta-300: #ff94d5;
135
+ --color-magenta-400: #f562c8;
136
+ --color-magenta-500: #e037b8;
137
+ --color-magenta-600: #cc1bac;
138
+ --color-magenta-700: #a11388;
139
+ --color-magenta-800: #7a0d66;
140
+ --color-magenta-900: #550944;
141
+ --color-magenta-1000: #3b052e;
142
142
 
143
143
  /* COLOR: NEUTRAL-ALPHA */
144
144
  --color-neutral-alpha-100-a: rgba(9, 30, 77, 0.03);
@@ -155,16 +155,16 @@
155
155
  --color-dark-neutral-alpha-500-a: rgba(166, 197, 226, 0.5);
156
156
 
157
157
  /* COLOR: YELLOW */
158
- --color-yellow-100: #f7f3ee;
159
- --color-yellow-200: #ede5da;
160
- --color-yellow-300: #dccfba;
161
- --color-yellow-400: #c5b191;
162
- --color-yellow-500: #ae966d;
163
- --color-yellow-600: #937b4f;
164
- --color-yellow-700: #74613c;
165
- --color-yellow-800: #5a4d31;
166
- --color-yellow-900: #49402b;
167
- --color-yellow-1000: #3c3420;
158
+ --color-yellow-100: #fcf9ec;
159
+ --color-yellow-200: #f7eecb;
160
+ --color-yellow-300: #eddc96;
161
+ --color-yellow-400: #e6cf72;
162
+ --color-yellow-500: #e1be5d;
163
+ --color-yellow-600: #d7aa41;
164
+ --color-yellow-700: #c58c35;
165
+ --color-yellow-800: #b46e2d;
166
+ --color-yellow-900: #9f5226;
167
+ --color-yellow-1000: #7c331b;
168
168
 
169
169
  /* COLOR: TEXT */
170
170
  --color-text-default: var(--color-neutral-1100);
package/build/bcc/primevue/index.d.ts CHANGED
@@ -1,4 +1,35 @@
1
- declare module '@bcc-code/design-tokens/bcc/primevue' {
2
- const BCCPreset: any;
3
- export default BCCPreset;
4
- }
1
+ // build/bcc/primevue/index.d.ts
2
+ import type { PrimeVueThemeOptions } from '@primeuix/themes';
3
+
4
+ interface BCCPresetTheme {
5
+ primitive: {
6
+ neutral: Record<string, string>;
7
+ red: Record<string, string>;
8
+ orange: Record<string, string>;
9
+ green: Record<string, string>;
10
+ teal: Record<string, string>;
11
+ blue: Record<string, string>;
12
+ purple: Record<string, string>;
13
+ pink: Record<string, string>;
14
+ yellow: Record<string, string>;
15
+ amber: Record<string, string>;
16
+ };
17
+ semantic: {
18
+ primary: Record<string, string>;
19
+ colorScheme: {
20
+ light: {
21
+ surface: Record<string, string>;
22
+ };
23
+ dark: {
24
+ surface: Record<string, string>;
25
+ };
26
+ };
27
+ };
28
+ }
29
+
30
+ declare const BCCPreset: BCCPresetTheme;
31
+ export default BCCPreset;
32
+
33
+ // Re-export useful types for consumers
34
+ export type { PrimeVueThemeOptions };
35
+ export type BCCTheme = BCCPresetTheme;
package/build/bcc/primevue/override.js CHANGED
@@ -1,3 +1,4 @@
1
+ // build/bcc/primevue/override.js
1
2
  const BCCAuraOverride = {
2
3
  primitive: {
3
4
  neutral: {
@@ -13,7 +14,6 @@ const BCCAuraOverride = {
13
14
  900: "var(--color-neutral-900)",
14
15
  950: "var(--color-neutral-1000)",
15
16
  },
16
-
17
17
  red: {
18
18
  50: "var(--color-red-100)",
19
19
  100: "var(--color-red-200)",
@@ -125,22 +125,21 @@ const BCCAuraOverride = {
125
125
  },
126
126
  semantic: {
127
127
  primary: {
128
- 50: "var(--color-bcc-50)",
129
- 100: "var(--color-bcc-100)",
130
- 200: "var(--color-bcc-200)",
131
- 300: "var(--color-bcc-300)",
132
- 400: "var(--color-bcc-400)",
133
- 500: "var(--color-bcc-500)",
134
- 600: "var(--color-bcc-600)",
135
- 700: "var(--color-bcc-700)",
136
- 800: "var(--color-bcc-800)",
137
- 900: "var(--color-bcc-900)",
138
- 1000: "var(--color-bcc-1000)",
128
+ 50: "var(--color-bcc-100)",
129
+ 100: "var(--color-bcc-200)",
130
+ 200: "var(--color-bcc-300)",
131
+ 300: "var(--color-bcc-400)",
132
+ 400: "var(--color-bcc-500)",
133
+ 500: "var(--color-bcc-600)",
134
+ 600: "var(--color-bcc-700)",
135
+ 700: "var(--color-bcc-800)",
136
+ 800: "var(--color-bcc-900)",
137
+ 900: "var(--color-bcc-1000)",
139
138
  },
140
139
  colorScheme: {
141
140
  light: {
142
141
  surface: {
143
- 0: "var(--color-neutral-0)",
142
+ 0: "var(--color-elevation-surface-default)",
144
143
  50: "var(--color-neutral-100)",
145
144
  100: "var(--color-neutral-200)",
146
145
  200: "var(--color-neutral-300)",
@@ -151,12 +150,29 @@ const BCCAuraOverride = {
151
150
  700: "var(--color-neutral-800)",
152
151
  800: "var(--color-neutral-900)",
153
152
  900: "var(--color-neutral-1000)",
154
- 950: "var(--color-neutral-1100)",
153
+ 950: "var(--color-neutral-1100)",
154
+ },
155
+ // Add semantic color mappings
156
+ primary: {
157
+ color: "var(--color-text-brand)",
158
+ inverseColor: "var(--color-text-inverse)",
159
+ hoverColor: "var(--color-background-brand-hover)",
160
+ activeColor: "var(--color-background-brand-pressed)",
161
+ },
162
+ text: {
163
+ color: "var(--color-text-default)",
164
+ hoverColor: "var(--color-text-subtle)",
165
+ mutedColor: "var(--color-text-subtler)",
166
+ },
167
+ content: {
168
+ background: "var(--color-elevation-surface-default)",
169
+ hoverBackground: "var(--color-elevation-surface-hovered)",
170
+ borderColor: "var(--color-border-default)",
155
171
  },
156
172
  },
157
173
  dark: {
158
174
  surface: {
159
- 0: "var(--color-dark-neutral-0)",
175
+ 0: "var(--color-elevation-surface-default)",
160
176
  50: "var(--color-dark-neutral-100)",
161
177
  100: "var(--color-dark-neutral-200)",
162
178
  200: "var(--color-dark-neutral-300)",
@@ -169,6 +185,23 @@ const BCCAuraOverride = {
169
185
  900: "var(--color-dark-neutral-1000)",
170
186
  950: "var(--color-dark-neutral-1100)",
171
187
  },
188
+ // Dark mode semantic mappings
189
+ primary: {
190
+ color: "var(--color-text-brand)",
191
+ inverseColor: "var(--color-text-inverse)",
192
+ hoverColor: "var(--color-background-brand-hover)",
193
+ activeColor: "var(--color-background-brand-pressed)",
194
+ },
195
+ text: {
196
+ color: "var(--color-text-default)",
197
+ hoverColor: "var(--color-text-subtle)",
198
+ mutedColor: "var(--color-text-subtler)",
199
+ },
200
+ content: {
201
+ background: "var(--color-elevation-surface-default)",
202
+ hoverBackground: "var(--color-elevation-surface-hovered)",
203
+ borderColor: "var(--color-border-default)",
204
+ },
172
205
  },
173
206
  },
174
207
  },
package/build/bcc/tailwind/index.css CHANGED
@@ -3,7 +3,6 @@
3
3
  */
4
4
 
5
5
 
6
- @import "tailwindcss";
7
6
  @custom-variant dark (&:where(.dark, .dark *));
8
7
 
9
8
  @import "./light.css";
package/build/bcc/tailwind/light.css CHANGED
@@ -45,52 +45,52 @@
45
45
  --color-bcc-1000: #002320;
46
46
 
47
47
  /* COLOR: ORANGE */
48
- --color-orange-100: #fcf6f4;
49
- --color-orange-200: #f9ece7;
50
- --color-orange-300: #f6dcd2;
51
- --color-orange-400: #e9b29e;
52
- --color-orange-500: #e29f87;
53
- --color-orange-600: #d37f60;
54
- --color-orange-700: #be6544;
55
- --color-orange-800: #9f5236;
56
- --color-orange-900: #844630;
57
- --color-orange-1000: #4c271a;
48
+ --color-orange-100: #fcf3ef;
49
+ --color-orange-200: #f7dbcc;
50
+ --color-orange-300: #f2bda6;
51
+ --color-orange-400: #ed9f83;
52
+ --color-orange-500: #dd8263;
53
+ --color-orange-600: #c36e54;
54
+ --color-orange-700: #a55c45;
55
+ --color-orange-800: #864a35;
56
+ --color-orange-900: #683927;
57
+ --color-orange-1000: #4a281a;
58
58
 
59
59
  /* COLOR: RED */
60
- --color-red-100: #fcf4f4;
61
- --color-red-200: #fae7e6;
62
- --color-red-300: #f6d3d2;
63
- --color-red-400: #efb4b2;
64
- --color-red-500: #e38986;
65
- --color-red-600: #d5625e;
66
- --color-red-700: #c04642;
67
- --color-red-800: #ad3c38;
68
- --color-red-900: #86312e;
69
- --color-red-1000: #461716;
60
+ --color-red-100: #fff1ed;
61
+ --color-red-200: #ffdad2;
62
+ --color-red-300: #f7a399;
63
+ --color-red-400: #ee7a69;
64
+ --color-red-500: #db5944;
65
+ --color-red-600: #c7402e;
66
+ --color-red-700: #a83423;
67
+ --color-red-800: #86291b;
68
+ --color-red-900: #6b1f15;
69
+ --color-red-1000: #4f140d;
70
70
 
71
71
  /* COLOR: GREEN */
72
- --color-green-100: #f2fbf6;
73
- --color-green-200: #e2f6ea;
74
- --color-green-300: #c6ecd6;
75
- --color-green-400: #9adbb5;
76
- --color-green-500: #66c28d;
77
- --color-green-600: #40a56c;
78
- --color-green-700: #308957;
79
- --color-green-800: #296c47;
80
- --color-green-900: #25563b;
81
- --color-green-1000: #133925;
72
+ --color-green-100: #e8fbed;
73
+ --color-green-200: #c2f0d2;
74
+ --color-green-300: #95e6b6;
75
+ --color-green-400: #62da9c;
76
+ --color-green-500: #37cf83;
77
+ --color-green-600: #1fbf71;
78
+ --color-green-700: #169b5a;
79
+ --color-green-800: #0f7744;
80
+ --color-green-900: #08532d;
81
+ --color-green-1000: #003b1c;
82
82
 
83
83
  /* COLOR: TEAL */
84
- --color-teal-100: #f1f9fa;
85
- --color-teal-200: #dceff1;
86
- --color-teal-300: #bde0e4;
87
- --color-teal-400: #8fc9d1;
88
- --color-teal-500: #5cabb7;
89
- --color-teal-600: #3e8e9c;
90
- --color-teal-700: #377483;
91
- --color-teal-800: #32606c;
92
- --color-teal-900: #2f505b;
93
- --color-teal-1000: #1d353f;
84
+ --color-teal-100: #e4faf8;
85
+ --color-teal-200: #b6f0eb;
86
+ --color-teal-300: #85e6de;
87
+ --color-teal-400: #56d6d1;
88
+ --color-teal-500: #2bc4c2;
89
+ --color-teal-600: #00b0b5;
90
+ --color-teal-700: #00929a;
91
+ --color-teal-800: #00757f;
92
+ --color-teal-900: #005962;
93
+ --color-teal-1000: #003d45;
94
94
 
95
95
  /* COLOR: BROWN */
96
96
  --color-brown-100: #f7f3ee;
@@ -105,40 +105,40 @@
105
105
  --color-brown-1000: #3c3420;
106
106
 
107
107
  /* COLOR: BLUE */
108
- --color-blue-100: #f1f7fd;
109
- --color-blue-200: #dfedfa;
110
- --color-blue-300: #c6e0f7;
111
- --color-blue-400: #a0cdf0;
112
- --color-blue-500: #72b1e8;
113
- --color-blue-600: #5294e0;
114
- --color-blue-700: #3c79d4;
115
- --color-blue-800: #3365c2;
116
- --color-blue-900: #2f529e;
117
- --color-blue-1000: #25385f;
108
+ --color-blue-100: #e8f3ff;
109
+ --color-blue-200: #cce0ff;
110
+ --color-blue-300: #99c2ff;
111
+ --color-blue-400: #66a6ff;
112
+ --color-blue-500: #338aff;
113
+ --color-blue-600: #0065ff;
114
+ --color-blue-700: #0052cc;
115
+ --color-blue-800: #0747a6;
116
+ --color-blue-900: #053e85;
117
+ --color-blue-1000: #092c66;
118
118
 
119
119
  /* COLOR: PURPLE */
120
- --color-purple-100: #f1f1fc;
121
- --color-purple-200: #e5e7fa;
122
- --color-purple-300: #d0d1f5;
123
- --color-purple-400: #b3b3ee;
124
- --color-purple-500: #9b95e4;
125
- --color-purple-600: #8678d9;
126
- --color-purple-700: #7860cb;
127
- --color-purple-800: #6750b2;
128
- --color-purple-900: #554390;
129
- --color-purple-1000: #352c54;
120
+ --color-purple-100: #f3f0ff;
121
+ --color-purple-200: #dfd7ff;
122
+ --color-purple-300: #b8acff;
123
+ --color-purple-400: #9982ff;
124
+ --color-purple-500: #7a5aff;
125
+ --color-purple-600: #5e37ff;
126
+ --color-purple-700: #4722cc;
127
+ --color-purple-800: #3319a3;
128
+ --color-purple-900: #26157a;
129
+ --color-purple-1000: #1b0f52;
130
130
 
131
131
  /* COLOR: MAGENTA */
132
- --color-magenta-100: #faf5f9;
133
- --color-magenta-200: #f7ecf5;
134
- --color-magenta-300: #f0daec;
135
- --color-magenta-400: #e4bddd;
136
- --color-magenta-500: #d294c5;
137
- --color-magenta-600: #c377b1;
138
- --color-magenta-700: #ac5693;
139
- --color-magenta-800: #93437a;
140
- --color-magenta-900: #7a3a65;
141
- --color-magenta-1000: #592648;
132
+ --color-magenta-100: #fff0f8;
133
+ --color-magenta-200: #ffd2ec;
134
+ --color-magenta-300: #ff94d5;
135
+ --color-magenta-400: #f562c8;
136
+ --color-magenta-500: #e037b8;
137
+ --color-magenta-600: #cc1bac;
138
+ --color-magenta-700: #a11388;
139
+ --color-magenta-800: #7a0d66;
140
+ --color-magenta-900: #550944;
141
+ --color-magenta-1000: #3b052e;
142
142
 
143
143
  /* COLOR: NEUTRAL-ALPHA */
144
144
  --color-neutral-alpha-100-a: rgba(9, 30, 77, 0.03);
@@ -155,16 +155,16 @@
155
155
  --color-dark-neutral-alpha-500-a: rgba(166, 197, 226, 0.5);
156
156
 
157
157
  /* COLOR: YELLOW */
158
- --color-yellow-100: #f7f3ee;
159
- --color-yellow-200: #ede5da;
160
- --color-yellow-300: #dccfba;
161
- --color-yellow-400: #c5b191;
162
- --color-yellow-500: #ae966d;
163
- --color-yellow-600: #937b4f;
164
- --color-yellow-700: #74613c;
165
- --color-yellow-800: #5a4d31;
166
- --color-yellow-900: #49402b;
167
- --color-yellow-1000: #3c3420;
158
+ --color-yellow-100: #fcf9ec;
159
+ --color-yellow-200: #f7eecb;
160
+ --color-yellow-300: #eddc96;
161
+ --color-yellow-400: #e6cf72;
162
+ --color-yellow-500: #e1be5d;
163
+ --color-yellow-600: #d7aa41;
164
+ --color-yellow-700: #c58c35;
165
+ --color-yellow-800: #b46e2d;
166
+ --color-yellow-900: #9f5226;
167
+ --color-yellow-1000: #7c331b;
168
168
 
169
169
  /* COLOR: TEXT */
170
170
  --color-text-default: var(--color-neutral-1100);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bcc-code/design-tokens",
3
- "version": "2.0.15",
3
+ "version": "2.0.17",
4
4
  "description": "Design tokens with CSS variables, Tailwind v4, and framework presets.",
5
5
  "type": "module",
6
6
  "main": "build/bcc/cdn/variables.css",