elements-kit 0.5.0 → 0.5.2

package/dist/ui/styles/palette/bronze.css

@@ -0,0 +1,127 @@
+:root, .light, .light-theme {
+  --bronze-1: #fdfcfc;
+  --bronze-2: #fdf7f5;
+  --bronze-3: #f6edea;
+  --bronze-4: #efe4df;
+  --bronze-5: #e7d9d3;
+  --bronze-6: #dfcdc5;
+  --bronze-7: #d3bcb3;
+  --bronze-8: #c2a499;
+  --bronze-9: #a18072;
+  --bronze-10: #957468;
+  --bronze-11: #7d5e54;
+  --bronze-12: #43302b;
+  --bronze-a1: #55000003;
+  --bronze-a2: #cc33000a;
+  --bronze-a3: #92250015;
+  --bronze-a4: #80280020;
+  --bronze-a5: #7423002c;
+  --bronze-a6: #7324003a;
+  --bronze-a7: #6c1f004c;
+  --bronze-a8: #671c0066;
+  --bronze-a9: #551a008d;
+  --bronze-a10: #4c150097;
+  --bronze-a11: #3d0f00ab;
+  --bronze-a12: #1d0600d4;
+  --bronze-surface: #fdf5f3cc;
+  --bronze-indicator: var(--bronze-9);
+  --bronze-track: var(--bronze-9);
+}
+
+@supports (color: color(display-p3 1 1 1)) {
+  @media (color-gamut: p3) {
+    :root, .light, .light-theme {
+      --bronze-1: color(display-p3 .991 .988 .988);
+      --bronze-2: color(display-p3 .989 .97 .961);
+      --bronze-3: color(display-p3 .958 .932 .919);
+      --bronze-4: color(display-p3 .929 .894 .877);
+      --bronze-5: color(display-p3 .898 .853 .832);
+      --bronze-6: color(display-p3 .861 .805 .778);
+      --bronze-7: color(display-p3 .812 .739 .706);
+      --bronze-8: color(display-p3 .741 .647 .606);
+      --bronze-9: color(display-p3 .611 .507 .455);
+      --bronze-10: color(display-p3 .563 .461 .414);
+      --bronze-11: color(display-p3 .471 .373 .336);
+      --bronze-12: color(display-p3 .251 .191 .172);
+      --bronze-a1: color(display-p3 .349 .024 .024 / .012);
+      --bronze-a2: color(display-p3 .71 .22 .024 / .04);
+      --bronze-a3: color(display-p3 .482 .2 .008 / .083);
+      --bronze-a4: color(display-p3 .424 .133 .004 / .122);
+      --bronze-a5: color(display-p3 .4 .145 .004 / .169);
+      --bronze-a6: color(display-p3 .388 .125 .004 / .224);
+      --bronze-a7: color(display-p3 .365 .11 .004 / .295);
+      --bronze-a8: color(display-p3 .341 .102 .004 / .393);
+      --bronze-a9: color(display-p3 .29 .094 0 / .546);
+      --bronze-a10: color(display-p3 .255 .082 0 / .585);
+      --bronze-a11: color(display-p3 .471 .373 .336);
+      --bronze-a12: color(display-p3 .251 .191 .172);
+      --bronze-surface: color(display-p3 .9843 .9608 .9529 / .8);
+    }
+  }
+}
+
+.dark, .dark-theme {
+  --bronze-1: #141110;
+  --bronze-2: #1c1917;
+  --bronze-3: #262220;
+  --bronze-4: #302a27;
+  --bronze-5: #3b3330;
+  --bronze-6: #493e3a;
+  --bronze-7: #5a4c47;
+  --bronze-8: #6f5f58;
+  --bronze-9: #a18072;
+  --bronze-10: #ae8c7e;
+  --bronze-11: #d4b3a5;
+  --bronze-12: #ede0d9;
+  --bronze-a1: #d1110004;
+  --bronze-a2: #fbbc910c;
+  --bronze-a3: #faceb817;
+  --bronze-a4: #facdb622;
+  --bronze-a5: #ffd2c12d;
+  --bronze-a6: #ffd1c03c;
+  --bronze-a7: #fdd0c04f;
+  --bronze-a8: #ffd6c565;
+  --bronze-a9: #fec7b09b;
+  --bronze-a10: #fecab5a9;
+  --bronze-a11: #ffd7c6d1;
+  --bronze-a12: #fff1e9ec;
+  --bronze-surface: #27211d80;
+  --bronze-indicator: var(--bronze-9);
+  --bronze-track: var(--bronze-9);
+}
+
+@supports (color: color(display-p3 1 1 1)) {
+  @media (color-gamut: p3) {
+    .dark, .dark-theme {
+      --bronze-1: color(display-p3 .076 .067 .063);
+      --bronze-2: color(display-p3 .106 .097 .093);
+      --bronze-3: color(display-p3 .147 .132 .125);
+      --bronze-4: color(display-p3 .185 .166 .156);
+      --bronze-5: color(display-p3 .227 .202 .19);
+      --bronze-6: color(display-p3 .278 .246 .23);
+      --bronze-7: color(display-p3 .343 .302 .281);
+      --bronze-8: color(display-p3 .426 .374 .347);
+      --bronze-9: color(display-p3 .611 .507 .455);
+      --bronze-10: color(display-p3 .66 .556 .504);
+      --bronze-11: color(display-p3 .81 .707 .655);
+      --bronze-12: color(display-p3 .921 .88 .854);
+      --bronze-a1: color(display-p3 .941 .067 0 / .009);
+      --bronze-a2: color(display-p3 .98 .8 .706 / .043);
+      --bronze-a3: color(display-p3 .988 .851 .761 / .085);
+      --bronze-a4: color(display-p3 .996 .839 .78 / .127);
+      --bronze-a5: color(display-p3 .996 .863 .773 / .173);
+      --bronze-a6: color(display-p3 1 .863 .796 / .227);
+      --bronze-a7: color(display-p3 1 .867 .8 / .295);
+      --bronze-a8: color(display-p3 1 .859 .788 / .387);
+      --bronze-a9: color(display-p3 1 .82 .733 / .585);
+      --bronze-a10: color(display-p3 1 .839 .761 / .635);
+      --bronze-a11: color(display-p3 .81 .707 .655);
+      --bronze-a12: color(display-p3 .921 .88 .854);
+      --bronze-surface: color(display-p3 .1412 .1255 .1176 / .5);
+    }
+  }
+}
+
+:root {
+  --bronze-contrast: white;
+}

package/dist/ui/styles/palette/brown.css

@@ -0,0 +1,127 @@
+:root, .light, .light-theme {
+  --brown-1: #fefdfc;
+  --brown-2: #fcf9f6;
+  --brown-3: #f6eee7;
+  --brown-4: #f0e4d9;
+  --brown-5: #ebdaca;
+  --brown-6: #e4cdb7;
+  --brown-7: #dcbc9f;
+  --brown-8: #cea37e;
+  --brown-9: #ad7f58;
+  --brown-10: #a07553;
+  --brown-11: #815e46;
+  --brown-12: #3e332e;
+  --brown-a1: #aa550003;
+  --brown-a2: #aa550009;
+  --brown-a3: #a04b0018;
+  --brown-a4: #9b4a0026;
+  --brown-a5: #9f4d0035;
+  --brown-a6: #a04e0048;
+  --brown-a7: #a34e0060;
+  --brown-a8: #9f4a0081;
+  --brown-a9: #823c00a7;
+  --brown-a10: #723300ac;
+  --brown-a11: #522100b9;
+  --brown-a12: #140600d1;
+  --brown-surface: #fbf8f4cc;
+  --brown-indicator: var(--brown-9);
+  --brown-track: var(--brown-9);
+}
+
+@supports (color: color(display-p3 1 1 1)) {
+  @media (color-gamut: p3) {
+    :root, .light, .light-theme {
+      --brown-1: color(display-p3 .995 .992 .989);
+      --brown-2: color(display-p3 .987 .976 .964);
+      --brown-3: color(display-p3 .959 .936 .909);
+      --brown-4: color(display-p3 .934 .897 .855);
+      --brown-5: color(display-p3 .909 .856 .798);
+      --brown-6: color(display-p3 .88 .808 .73);
+      --brown-7: color(display-p3 .841 .742 .639);
+      --brown-8: color(display-p3 .782 .647 .514);
+      --brown-9: color(display-p3 .651 .505 .368);
+      --brown-10: color(display-p3 .601 .465 .344);
+      --brown-11: color(display-p3 .485 .374 .288);
+      --brown-12: color(display-p3 .236 .202 .183);
+      --brown-a1: color(display-p3 .675 .349 .024 / .012);
+      --brown-a2: color(display-p3 .675 .349 .024 / .036);
+      --brown-a3: color(display-p3 .573 .314 .012 / .091);
+      --brown-a4: color(display-p3 .545 .302 .008 / .146);
+      --brown-a5: color(display-p3 .561 .29 .004 / .204);
+      --brown-a6: color(display-p3 .553 .294 .004 / .271);
+      --brown-a7: color(display-p3 .557 .286 .004 / .361);
+      --brown-a8: color(display-p3 .549 .275 .004 / .487);
+      --brown-a9: color(display-p3 .447 .22 0 / .632);
+      --brown-a10: color(display-p3 .388 .188 0 / .655);
+      --brown-a11: color(display-p3 .485 .374 .288);
+      --brown-a12: color(display-p3 .236 .202 .183);
+      --brown-surface: color(display-p3 .9843 .9725 .9569 / .8);
+    }
+  }
+}
+
+.dark, .dark-theme {
+  --brown-1: #12110f;
+  --brown-2: #1c1816;
+  --brown-3: #28211d;
+  --brown-4: #322922;
+  --brown-5: #3e3128;
+  --brown-6: #4d3c2f;
+  --brown-7: #614a39;
+  --brown-8: #7c5f46;
+  --brown-9: #ad7f58;
+  --brown-10: #b88c67;
+  --brown-11: #dbb594;
+  --brown-12: #f2e1ca;
+  --brown-a1: #91110002;
+  --brown-a2: #fba67c0c;
+  --brown-a3: #fcb58c19;
+  --brown-a4: #fbbb8a24;
+  --brown-a5: #fcb88931;
+  --brown-a6: #fdba8741;
+  --brown-a7: #ffbb8856;
+  --brown-a8: #ffbe8773;
+  --brown-a9: #feb87da8;
+  --brown-a10: #ffc18cb3;
+  --brown-a11: #fed1aad9;
+  --brown-a12: #feecd4f2;
+  --brown-surface: #271f1b80;
+  --brown-indicator: var(--brown-9);
+  --brown-track: var(--brown-9);
+}
+
+@supports (color: color(display-p3 1 1 1)) {
+  @media (color-gamut: p3) {
+    .dark, .dark-theme {
+      --brown-1: color(display-p3 .071 .067 .059);
+      --brown-2: color(display-p3 .107 .095 .087);
+      --brown-3: color(display-p3 .151 .13 .115);
+      --brown-4: color(display-p3 .191 .161 .138);
+      --brown-5: color(display-p3 .235 .194 .162);
+      --brown-6: color(display-p3 .291 .237 .192);
+      --brown-7: color(display-p3 .365 .295 .232);
+      --brown-8: color(display-p3 .469 .377 .287);
+      --brown-9: color(display-p3 .651 .505 .368);
+      --brown-10: color(display-p3 .697 .557 .423);
+      --brown-11: color(display-p3 .835 .715 .597);
+      --brown-12: color(display-p3 .938 .885 .802);
+      --brown-a1: color(display-p3 .855 .071 0 / .005);
+      --brown-a2: color(display-p3 .98 .706 .525 / .043);
+      --brown-a3: color(display-p3 .996 .745 .576 / .093);
+      --brown-a4: color(display-p3 1 .765 .592 / .135);
+      --brown-a5: color(display-p3 1 .761 .588 / .181);
+      --brown-a6: color(display-p3 1 .773 .592 / .24);
+      --brown-a7: color(display-p3 .996 .776 .58 / .32);
+      --brown-a8: color(display-p3 1 .78 .573 / .433);
+      --brown-a9: color(display-p3 1 .769 .549 / .627);
+      --brown-a10: color(display-p3 1 .792 .596 / .677);
+      --brown-a11: color(display-p3 .835 .715 .597);
+      --brown-a12: color(display-p3 .938 .885 .802);
+      --brown-surface: color(display-p3 .1412 .1176 .102 / .5);
+    }
+  }
+}
+
+:root {
+  --brown-contrast: white;
+}

package/dist/ui/styles/palette/crimson.css

@@ -0,0 +1,127 @@
+:root, .light, .light-theme {
+  --crimson-1: #fffcfd;
+  --crimson-2: #fef7f9;
+  --crimson-3: #ffe9f0;
+  --crimson-4: #fedce7;
+  --crimson-5: #facedd;
+  --crimson-6: #f3bed1;
+  --crimson-7: #eaacc3;
+  --crimson-8: #e093b2;
+  --crimson-9: #e93d82;
+  --crimson-10: #df3478;
+  --crimson-11: #cb1d63;
+  --crimson-12: #621639;
+  --crimson-a1: #ff005503;
+  --crimson-a2: #e0004008;
+  --crimson-a3: #ff005216;
+  --crimson-a4: #f8005123;
+  --crimson-a5: #e5004f31;
+  --crimson-a6: #d0004b41;
+  --crimson-a7: #bf004753;
+  --crimson-a8: #b6004a6c;
+  --crimson-a9: #e2005bc2;
+  --crimson-a10: #d70056cb;
+  --crimson-a11: #c4004fe2;
+  --crimson-a12: #530026e9;
+  --crimson-surface: #fef5f8cc;
+  --crimson-indicator: var(--crimson-9);
+  --crimson-track: var(--crimson-9);
+}
+
+@supports (color: color(display-p3 1 1 1)) {
+  @media (color-gamut: p3) {
+    :root, .light, .light-theme {
+      --crimson-1: color(display-p3 .998 .989 .992);
+      --crimson-2: color(display-p3 .991 .969 .976);
+      --crimson-3: color(display-p3 .987 .917 .941);
+      --crimson-4: color(display-p3 .975 .866 .904);
+      --crimson-5: color(display-p3 .953 .813 .864);
+      --crimson-6: color(display-p3 .921 .755 .817);
+      --crimson-7: color(display-p3 .88 .683 .761);
+      --crimson-8: color(display-p3 .834 .592 .694);
+      --crimson-9: color(display-p3 .843 .298 .507);
+      --crimson-10: color(display-p3 .807 .266 .468);
+      --crimson-11: color(display-p3 .731 .195 .388);
+      --crimson-12: color(display-p3 .352 .111 .221);
+      --crimson-a1: color(display-p3 .675 .024 .349 / .012);
+      --crimson-a2: color(display-p3 .757 .02 .267 / .032);
+      --crimson-a3: color(display-p3 .859 .008 .294 / .083);
+      --crimson-a4: color(display-p3 .827 .008 .298 / .134);
+      --crimson-a5: color(display-p3 .753 .008 .275 / .189);
+      --crimson-a6: color(display-p3 .682 .004 .247 / .244);
+      --crimson-a7: color(display-p3 .62 .004 .251 / .318);
+      --crimson-a8: color(display-p3 .6 .004 .251 / .408);
+      --crimson-a9: color(display-p3 .776 0 .298 / .702);
+      --crimson-a10: color(display-p3 .737 0 .275 / .734);
+      --crimson-a11: color(display-p3 .731 .195 .388);
+      --crimson-a12: color(display-p3 .352 .111 .221);
+      --crimson-surface: color(display-p3 .9922 .9608 .9725 / .8);
+    }
+  }
+}
+
+.dark, .dark-theme {
+  --crimson-1: #191114;
+  --crimson-2: #201318;
+  --crimson-3: #381525;
+  --crimson-4: #4d122f;
+  --crimson-5: #5c1839;
+  --crimson-6: #6d2545;
+  --crimson-7: #873356;
+  --crimson-8: #b0436e;
+  --crimson-9: #e93d82;
+  --crimson-10: #ee518a;
+  --crimson-11: #ff92ad;
+  --crimson-12: #fdd3e8;
+  --crimson-a1: #f4126709;
+  --crimson-a2: #f22f7a11;
+  --crimson-a3: #fe2a8b2a;
+  --crimson-a4: #fd158741;
+  --crimson-a5: #fd278f51;
+  --crimson-a6: #fe459763;
+  --crimson-a7: #fd559b7f;
+  --crimson-a8: #fe5b9bab;
+  --crimson-a9: #fe418de8;
+  --crimson-a10: #ff5693ed;
+  --crimson-a11: #ff92ad;
+  --crimson-a12: #ffd5eafd;
+  --crimson-surface: #2f151f80;
+  --crimson-indicator: var(--crimson-9);
+  --crimson-track: var(--crimson-9);
+}
+
+@supports (color: color(display-p3 1 1 1)) {
+  @media (color-gamut: p3) {
+    .dark, .dark-theme {
+      --crimson-1: color(display-p3 .093 .068 .078);
+      --crimson-2: color(display-p3 .117 .078 .095);
+      --crimson-3: color(display-p3 .203 .091 .143);
+      --crimson-4: color(display-p3 .277 .087 .182);
+      --crimson-5: color(display-p3 .332 .115 .22);
+      --crimson-6: color(display-p3 .394 .162 .268);
+      --crimson-7: color(display-p3 .489 .222 .336);
+      --crimson-8: color(display-p3 .638 .289 .429);
+      --crimson-9: color(display-p3 .843 .298 .507);
+      --crimson-10: color(display-p3 .864 .364 .539);
+      --crimson-11: color(display-p3 1 .56 .66);
+      --crimson-12: color(display-p3 .966 .834 .906);
+      --crimson-a1: color(display-p3 .984 .071 .463 / .03);
+      --crimson-a2: color(display-p3 .996 .282 .569 / .055);
+      --crimson-a3: color(display-p3 .996 .227 .573 / .148);
+      --crimson-a4: color(display-p3 1 .157 .569 / .227);
+      --crimson-a5: color(display-p3 1 .231 .604 / .286);
+      --crimson-a6: color(display-p3 1 .337 .643 / .349);
+      --crimson-a7: color(display-p3 1 .416 .663 / .454);
+      --crimson-a8: color(display-p3 .996 .427 .651 / .614);
+      --crimson-a9: color(display-p3 1 .345 .596 / .832);
+      --crimson-a10: color(display-p3 1 .42 .62 / .853);
+      --crimson-a11: color(display-p3 1 .56 .66);
+      --crimson-a12: color(display-p3 .966 .834 .906);
+      --crimson-surface: color(display-p3 .1647 .0863 .1176 / .5);
+    }
+  }
+}
+
+:root {
+  --crimson-contrast: white;
+}

package/dist/ui/styles/palette/cyan.css

@@ -0,0 +1,127 @@
+:root, .light, .light-theme {
+  --cyan-1: #fafdfe;
+  --cyan-2: #f2fafb;
+  --cyan-3: #def7f9;
+  --cyan-4: #caf1f6;
+  --cyan-5: #b5e9f0;
+  --cyan-6: #9ddde7;
+  --cyan-7: #7dcedc;
+  --cyan-8: #3db9cf;
+  --cyan-9: #00a2c7;
+  --cyan-10: #0797b9;
+  --cyan-11: #107d98;
+  --cyan-12: #0d3c48;
+  --cyan-a1: #0099cc05;
+  --cyan-a2: #009db10d;
+  --cyan-a3: #00c2d121;
+  --cyan-a4: #00bcd435;
+  --cyan-a5: #01b4cc4a;
+  --cyan-a6: #00a7c162;
+  --cyan-a7: #009fbb82;
+  --cyan-a8: #00a3c0c2;
+  --cyan-a9: #00a2c7;
+  --cyan-a10: #0094b7f8;
+  --cyan-a11: #007491ef;
+  --cyan-a12: #00323ef2;
+  --cyan-surface: #eff9facc;
+  --cyan-indicator: var(--cyan-9);
+  --cyan-track: var(--cyan-9);
+}
+
+@supports (color: color(display-p3 1 1 1)) {
+  @media (color-gamut: p3) {
+    :root, .light, .light-theme {
+      --cyan-1: color(display-p3 .982 .992 .996);
+      --cyan-2: color(display-p3 .955 .981 .984);
+      --cyan-3: color(display-p3 .888 .965 .975);
+      --cyan-4: color(display-p3 .821 .941 .959);
+      --cyan-5: color(display-p3 .751 .907 .935);
+      --cyan-6: color(display-p3 .671 .862 .9);
+      --cyan-7: color(display-p3 .564 .8 .854);
+      --cyan-8: color(display-p3 .388 .715 .798);
+      --cyan-9: color(display-p3 .282 .627 .765);
+      --cyan-10: color(display-p3 .264 .583 .71);
+      --cyan-11: color(display-p3 .08 .48 .63);
+      --cyan-12: color(display-p3 .108 .232 .277);
+      --cyan-a1: color(display-p3 .02 .608 .804 / .02);
+      --cyan-a2: color(display-p3 .02 .557 .647 / .044);
+      --cyan-a3: color(display-p3 .004 .694 .796 / .114);
+      --cyan-a4: color(display-p3 .004 .678 .784 / .181);
+      --cyan-a5: color(display-p3 .004 .624 .733 / .248);
+      --cyan-a6: color(display-p3 .004 .584 .706 / .33);
+      --cyan-a7: color(display-p3 .004 .541 .667 / .436);
+      --cyan-a8: color(display-p3 0 .533 .667 / .612);
+      --cyan-a9: color(display-p3 0 .482 .675 / .718);
+      --cyan-a10: color(display-p3 0 .435 .608 / .738);
+      --cyan-a11: color(display-p3 .08 .48 .63);
+      --cyan-a12: color(display-p3 .108 .232 .277);
+      --cyan-surface: color(display-p3 .9412 .9765 .9804 / .8);
+    }
+  }
+}
+
+.dark, .dark-theme {
+  --cyan-1: #0b161a;
+  --cyan-2: #101b20;
+  --cyan-3: #082c36;
+  --cyan-4: #003848;
+  --cyan-5: #004558;
+  --cyan-6: #045468;
+  --cyan-7: #12677e;
+  --cyan-8: #11809c;
+  --cyan-9: #00a2c7;
+  --cyan-10: #23afd0;
+  --cyan-11: #4ccce6;
+  --cyan-12: #b6ecf7;
+  --cyan-a1: #0091f70a;
+  --cyan-a2: #02a7f211;
+  --cyan-a3: #00befd28;
+  --cyan-a4: #00baff3b;
+  --cyan-a5: #00befd4d;
+  --cyan-a6: #00c7fd5e;
+  --cyan-a7: #14cdff75;
+  --cyan-a8: #11cfff95;
+  --cyan-a9: #00cfffc3;
+  --cyan-a10: #28d6ffcd;
+  --cyan-a11: #52e1fee5;
+  --cyan-a12: #bbf3fef7;
+  --cyan-surface: #11252d80;
+  --cyan-indicator: var(--cyan-9);
+  --cyan-track: var(--cyan-9);
+}
+
+@supports (color: color(display-p3 1 1 1)) {
+  @media (color-gamut: p3) {
+    .dark, .dark-theme {
+      --cyan-1: color(display-p3 .053 .085 .098);
+      --cyan-2: color(display-p3 .072 .105 .122);
+      --cyan-3: color(display-p3 .073 .168 .209);
+      --cyan-4: color(display-p3 .063 .216 .277);
+      --cyan-5: color(display-p3 .091 .267 .336);
+      --cyan-6: color(display-p3 .137 .324 .4);
+      --cyan-7: color(display-p3 .186 .398 .484);
+      --cyan-8: color(display-p3 .23 .496 .6);
+      --cyan-9: color(display-p3 .282 .627 .765);
+      --cyan-10: color(display-p3 .331 .675 .801);
+      --cyan-11: color(display-p3 .446 .79 .887);
+      --cyan-12: color(display-p3 .757 .919 .962);
+      --cyan-a1: color(display-p3 0 .647 .992 / .034);
+      --cyan-a2: color(display-p3 .133 .733 1 / .059);
+      --cyan-a3: color(display-p3 .122 .741 .996 / .152);
+      --cyan-a4: color(display-p3 .051 .725 1 / .227);
+      --cyan-a5: color(display-p3 .149 .757 1 / .29);
+      --cyan-a6: color(display-p3 .267 .792 1 / .358);
+      --cyan-a7: color(display-p3 .333 .808 1 / .446);
+      --cyan-a8: color(display-p3 .357 .816 1 / .572);
+      --cyan-a9: color(display-p3 .357 .82 1 / .748);
+      --cyan-a10: color(display-p3 .4 .839 1 / .786);
+      --cyan-a11: color(display-p3 .446 .79 .887);
+      --cyan-a12: color(display-p3 .757 .919 .962);
+      --cyan-surface: color(display-p3 .0784 .1412 .1725 / .5);
+    }
+  }
+}
+
+:root {
+  --cyan-contrast: white;
+}

package/dist/ui/styles/palette/gold.css

@@ -0,0 +1,127 @@
+:root, .light, .light-theme {
+  --gold-1: #fdfdfc;
+  --gold-2: #faf9f2;
+  --gold-3: #f2f0e7;
+  --gold-4: #eae6db;
+  --gold-5: #e1dccf;
+  --gold-6: #d8d0bf;
+  --gold-7: #cbc0aa;
+  --gold-8: #b9a88d;
+  --gold-9: #978365;
+  --gold-10: #8c7a5e;
+  --gold-11: #71624b;
+  --gold-12: #3b352b;
+  --gold-a1: #55550003;
+  --gold-a2: #9d8a000d;
+  --gold-a3: #75600018;
+  --gold-a4: #6b4e0024;
+  --gold-a5: #60460030;
+  --gold-a6: #64440040;
+  --gold-a7: #63420055;
+  --gold-a8: #633d0072;
+  --gold-a9: #5332009a;
+  --gold-a10: #492d00a1;
+  --gold-a11: #362100b4;
+  --gold-a12: #130c00d4;
+  --gold-surface: #f9f8efcc;
+  --gold-indicator: var(--gold-9);
+  --gold-track: var(--gold-9);
+}
+
+@supports (color: color(display-p3 1 1 1)) {
+  @media (color-gamut: p3) {
+    :root, .light, .light-theme {
+      --gold-1: color(display-p3 .992 .992 .989);
+      --gold-2: color(display-p3 .98 .976 .953);
+      --gold-3: color(display-p3 .947 .94 .909);
+      --gold-4: color(display-p3 .914 .904 .865);
+      --gold-5: color(display-p3 .88 .865 .816);
+      --gold-6: color(display-p3 .84 .818 .756);
+      --gold-7: color(display-p3 .788 .753 .677);
+      --gold-8: color(display-p3 .715 .66 .565);
+      --gold-9: color(display-p3 .579 .517 .41);
+      --gold-10: color(display-p3 .538 .479 .38);
+      --gold-11: color(display-p3 .433 .386 .305);
+      --gold-12: color(display-p3 .227 .209 .173);
+      --gold-a1: color(display-p3 .349 .349 .024 / .012);
+      --gold-a2: color(display-p3 .592 .514 .024 / .048);
+      --gold-a3: color(display-p3 .4 .357 .012 / .091);
+      --gold-a4: color(display-p3 .357 .298 .008 / .134);
+      --gold-a5: color(display-p3 .345 .282 .004 / .185);
+      --gold-a6: color(display-p3 .341 .263 .004 / .244);
+      --gold-a7: color(display-p3 .345 .235 .004 / .322);
+      --gold-a8: color(display-p3 .345 .22 .004 / .436);
+      --gold-a9: color(display-p3 .286 .18 0 / .589);
+      --gold-a10: color(display-p3 .255 .161 0 / .62);
+      --gold-a11: color(display-p3 .433 .386 .305);
+      --gold-a12: color(display-p3 .227 .209 .173);
+      --gold-surface: color(display-p3 .9765 .9725 .9412 / .8);
+    }
+  }
+}
+
+.dark, .dark-theme {
+  --gold-1: #121211;
+  --gold-2: #1b1a17;
+  --gold-3: #24231f;
+  --gold-4: #2d2b26;
+  --gold-5: #38352e;
+  --gold-6: #444039;
+  --gold-7: #544f46;
+  --gold-8: #696256;
+  --gold-9: #978365;
+  --gold-10: #a39073;
+  --gold-11: #cbb99f;
+  --gold-12: #e8e2d9;
+  --gold-a1: #91911102;
+  --gold-a2: #f9e29d0b;
+  --gold-a3: #f8ecbb15;
+  --gold-a4: #ffeec41e;
+  --gold-a5: #feecc22a;
+  --gold-a6: #feebcb37;
+  --gold-a7: #ffedcd48;
+  --gold-a8: #fdeaca5f;
+  --gold-a9: #ffdba690;
+  --gold-a10: #fedfb09d;
+  --gold-a11: #fee7c6c8;
+  --gold-a12: #fef7ede7;
+  --gold-surface: #25231d80;
+  --gold-indicator: var(--gold-9);
+  --gold-track: var(--gold-9);
+}
+
+@supports (color: color(display-p3 1 1 1)) {
+  @media (color-gamut: p3) {
+    .dark, .dark-theme {
+      --gold-1: color(display-p3 .071 .071 .067);
+      --gold-2: color(display-p3 .104 .101 .09);
+      --gold-3: color(display-p3 .141 .136 .122);
+      --gold-4: color(display-p3 .177 .17 .152);
+      --gold-5: color(display-p3 .217 .207 .185);
+      --gold-6: color(display-p3 .265 .252 .225);
+      --gold-7: color(display-p3 .327 .31 .277);
+      --gold-8: color(display-p3 .407 .384 .342);
+      --gold-9: color(display-p3 .579 .517 .41);
+      --gold-10: color(display-p3 .628 .566 .463);
+      --gold-11: color(display-p3 .784 .728 .635);
+      --gold-12: color(display-p3 .906 .887 .855);
+      --gold-a1: color(display-p3 .855 .855 .071 / .005);
+      --gold-a2: color(display-p3 .98 .89 .616 / .043);
+      --gold-a3: color(display-p3 1 .949 .753 / .08);
+      --gold-a4: color(display-p3 1 .933 .8 / .118);
+      --gold-a5: color(display-p3 1 .949 .804 / .16);
+      --gold-a6: color(display-p3 1 .925 .8 / .215);
+      --gold-a7: color(display-p3 1 .945 .831 / .278);
+      --gold-a8: color(display-p3 1 .937 .82 / .366);
+      --gold-a9: color(display-p3 .996 .882 .69 / .551);
+      --gold-a10: color(display-p3 1 .894 .725 / .601);
+      --gold-a11: color(display-p3 .784 .728 .635);
+      --gold-a12: color(display-p3 .906 .887 .855);
+      --gold-surface: color(display-p3 .1412 .1333 .1098 / .5);
+    }
+  }
+}
+
+:root {
+  --gold-contrast: white;
+}