@troennes/minium 0.1.0 → 0.2.0

package/dist/themes/olive.css

@@ -0,0 +1,107 @@
+@layer tokens, theme, reset, base, layout, components, project, utilities;
+
+/* Theme: olive (neutral: olive, primary: olive, accent: lime). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
+@layer theme {
+  :root {
+    /* neutral: olive */
+    --neutral-1: light-dark(#fcfdfc, #111210);
+    --neutral-2: light-dark(#f8faf8, #181917);
+    --neutral-3: light-dark(#eff1ef, #212220);
+    --neutral-4: light-dark(#e7e9e7, #282a27);
+    --neutral-5: light-dark(#dfe2df, #2f312e);
+    --neutral-8: light-dark(#b9bcb8, #5c625b);
+    --neutral-11: light-dark(#60655f, #afb5ad);
+    --neutral-12: light-dark(#1d211c, #eceeec);
+    --neutral-a2: light-dark(#00490007, #f1f2f008);
+    --neutral-a3: light-dark(#00200010, #f4f5f312);
+    --neutral-a4: light-dark(#00160018, #f3fef21a);
+    --neutral-a5: light-dark(#00180020, #f2fbf122);
+    --neutral-a6: light-dark(#00140028, #f4faed2c);
+    --neutral-a7: light-dark(#000f0033, #f2fced3b);
+
+    /* primary: olive */
+    --primary-7: light-dark(#cccfcc, #454843);
+    --primary-9: light-dark(#898e87, #687066);
+    --primary-10: light-dark(#7f847d, #767d74);
+    --primary-11: light-dark(#60655f, #afb5ad);
+    --primary-a2: light-dark(#00490007, #f1f2f008);
+    --primary-a3: light-dark(#00200010, #f4f5f312);
+    --primary-a4: light-dark(#00160018, #f3fef21a);
+    --primary-a5: light-dark(#00180020, #f2fbf122);
+    --primary-a6: light-dark(#00140028, #f4faed2c);
+    --primary-a7: light-dark(#000f0033, #f2fced3b);
+    --primary-a11: light-dark(#020a00a0, #f6fef4b0);
+    --primary-text: var(--primary-11);
+    --primary-inverse: white;
+
+    /* accent: lime */
+    --accent-7: light-dark(#abc978, #496231);
+    --accent-9: light-dark(#bdee63, #bdee63);
+    --accent-10: light-dark(#b0e64c, #d4ff70);
+    --accent-11: light-dark(#5c7c2f, #bde56c);
+    --accent-a2: light-dark(#6b95000c, #78f7000a);
+    --accent-a3: light-dark(#96c80029, #9bfd4c1a);
+    --accent-a4: light-dark(#8fc60042, #a7fe5c29);
+    --accent-a5: light-dark(#81bb0059, #affe6537);
+    --accent-a6: light-dark(#72aa006e, #b2fe6d46);
+    --accent-a7: light-dark(#61990087, #b6ff6f57);
+    --accent-a11: light-dark(#375f00d0, #d1fe77e4);
+    --accent-text: light-dark(var(--neutral-12), var(--accent-11));
+    --accent-inverse: light-dark(var(--neutral-12), var(--neutral-1));
+
+    /* gray primary */
+    --color-primary: var(--neutral-12);
+    --color-primary-inverse: var(--neutral-1);
+    --color-primary-hover: color-mix(in oklab, var(--neutral-12) 85%, var(--neutral-1));
+    --color-primary-text: var(--neutral-12);
+    --mark-color: light-dark(var(--accent-a5), var(--accent-a11));
+  }
+
+  @supports (color: color(display-p3 1 1 1)) {
+    @media (color-gamut: p3) {
+      :root {
+        /* neutral: olive */
+        --neutral-1: light-dark(color(display-p3 0.989 0.992 0.989), color(display-p3 0.067 0.07 0.063));
+        --neutral-2: light-dark(color(display-p3 0.974 0.98 0.973), color(display-p3 0.095 0.098 0.091));
+        --neutral-3: light-dark(color(display-p3 0.939 0.945 0.937), color(display-p3 0.131 0.135 0.126));
+        --neutral-4: light-dark(color(display-p3 0.907 0.914 0.905), color(display-p3 0.158 0.163 0.153));
+        --neutral-5: light-dark(color(display-p3 0.878 0.885 0.875), color(display-p3 0.186 0.192 0.18));
+        --neutral-8: light-dark(color(display-p3 0.727 0.738 0.723), color(display-p3 0.365 0.382 0.359));
+        --neutral-11: light-dark(color(display-p3 0.38 0.395 0.374), color(display-p3 0.69 0.709 0.682));
+        --neutral-12: light-dark(color(display-p3 0.117 0.129 0.111), color(display-p3 0.927 0.933 0.926));
+        --neutral-a2: light-dark(color(display-p3 0.024 0.302 0.024 / 0.028), color(display-p3 0.984 0.988 0.976 / 0.03));
+        --neutral-a3: light-dark(color(display-p3 0.008 0.129 0.008 / 0.063), color(display-p3 0.992 0.996 0.988 / 0.068));
+        --neutral-a4: light-dark(color(display-p3 0.012 0.094 0.012 / 0.095), color(display-p3 0.953 0.996 0.949 / 0.102));
+        --neutral-a5: light-dark(color(display-p3 0.035 0.098 0.008 / 0.126), color(display-p3 0.969 1 0.965 / 0.131));
+        --neutral-a6: light-dark(color(display-p3 0.027 0.078 0.004 / 0.157), color(display-p3 0.973 1 0.969 / 0.169));
+        --neutral-a7: light-dark(color(display-p3 0.02 0.059 0 / 0.2), color(display-p3 0.98 1 0.961 / 0.228));
+
+        /* primary: olive */
+        --primary-7: light-dark(color(display-p3 0.803 0.812 0.8), color(display-p3 0.273 0.284 0.266));
+        --primary-9: light-dark(color(display-p3 0.541 0.556 0.532), color(display-p3 0.414 0.438 0.404));
+        --primary-10: light-dark(color(display-p3 0.5 0.515 0.491), color(display-p3 0.467 0.49 0.458));
+        --primary-11: light-dark(color(display-p3 0.38 0.395 0.374), color(display-p3 0.69 0.709 0.682));
+        --primary-a2: light-dark(color(display-p3 0.024 0.302 0.024 / 0.028), color(display-p3 0.984 0.988 0.976 / 0.03));
+        --primary-a3: light-dark(color(display-p3 0.008 0.129 0.008 / 0.063), color(display-p3 0.992 0.996 0.988 / 0.068));
+        --primary-a4: light-dark(color(display-p3 0.012 0.094 0.012 / 0.095), color(display-p3 0.953 0.996 0.949 / 0.102));
+        --primary-a5: light-dark(color(display-p3 0.035 0.098 0.008 / 0.126), color(display-p3 0.969 1 0.965 / 0.131));
+        --primary-a6: light-dark(color(display-p3 0.027 0.078 0.004 / 0.157), color(display-p3 0.973 1 0.969 / 0.169));
+        --primary-a7: light-dark(color(display-p3 0.02 0.059 0 / 0.2), color(display-p3 0.98 1 0.961 / 0.228));
+        --primary-a11: light-dark(color(display-p3 0.012 0.039 0 / 0.628), color(display-p3 0.976 1 0.965 / 0.688));
+
+        /* accent: lime */
+        --accent-7: light-dark(color(display-p3 0.694 0.784 0.508), color(display-p3 0.307 0.383 0.215));
+        --accent-9: light-dark(color(display-p3 0.78 0.928 0.466), color(display-p3 0.78 0.928 0.466));
+        --accent-10: light-dark(color(display-p3 0.734 0.896 0.397), color(display-p3 0.865 0.995 0.519));
+        --accent-11: light-dark(color(display-p3 0.386 0.482 0.227), color(display-p3 0.771 0.893 0.485));
+        --accent-a2: light-dark(color(display-p3 0.514 0.592 0.024 / 0.048), color(display-p3 0.584 0.996 0.071 / 0.038));
+        --accent-a3: light-dark(color(display-p3 0.584 0.765 0.008 / 0.15), color(display-p3 0.69 1 0.38 / 0.101));
+        --accent-a4: light-dark(color(display-p3 0.561 0.757 0.004 / 0.24), color(display-p3 0.729 1 0.435 / 0.16));
+        --accent-a5: light-dark(color(display-p3 0.514 0.698 0.004 / 0.322), color(display-p3 0.745 1 0.471 / 0.215));
+        --accent-a6: light-dark(color(display-p3 0.443 0.627 0 / 0.4), color(display-p3 0.769 1 0.482 / 0.274));
+        --accent-a7: light-dark(color(display-p3 0.376 0.561 0.004 / 0.491), color(display-p3 0.769 1 0.506 / 0.341));
+        --accent-a11: light-dark(color(display-p3 0.386 0.482 0.227), color(display-p3 0.771 0.893 0.485));
+      }
+    }
+  }
+}

package/dist/themes/orange.css

@@ -0,0 +1,100 @@
+@layer tokens, theme, reset, base, layout, components, project, utilities;
+
+/* Theme: orange (neutral: sand, primary: orange, accent: indigo). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
+@layer theme {
+  :root {
+    /* neutral: sand */
+    --neutral-1: light-dark(#fdfdfc, #111110);
+    --neutral-2: light-dark(#f9f9f8, #191918);
+    --neutral-3: light-dark(#f1f0ef, #222221);
+    --neutral-4: light-dark(#e9e8e6, #2a2a28);
+    --neutral-5: light-dark(#e2e1de, #31312e);
+    --neutral-8: light-dark(#bcbbb5, #62605b);
+    --neutral-11: light-dark(#63635e, #b5b3ad);
+    --neutral-12: light-dark(#21201c, #eeeeec);
+    --neutral-a2: light-dark(#25250007, #f4f4f309);
+    --neutral-a3: light-dark(#20100010, #f6f6f513);
+    --neutral-a4: light-dark(#1f150019, #fefef31b);
+    --neutral-a5: light-dark(#1f180021, #fbfbeb23);
+    --neutral-a6: light-dark(#19130029, #fffaed2d);
+    --neutral-a7: light-dark(#19140035, #fffbed3c);
+
+    /* primary: orange */
+    --primary-7: light-dark(#f5ae73, #7e451d);
+    --primary-9: light-dark(#f76b15, #f76b15);
+    --primary-10: light-dark(#ef5f00, #ff801f);
+    --primary-11: light-dark(#cc4e00, #ffa057);
+    --primary-a2: light-dark(#ff8e0012, #fe6d000e);
+    --primary-a3: light-dark(#ff9c0029, #fb6a0025);
+    --primary-a4: light-dark(#ff91014a, #ff590039);
+    --primary-a5: light-dark(#ff8b0065, #ff61004a);
+    --primary-a6: light-dark(#ff81007d, #fd75045c);
+    --primary-a7: light-dark(#ed6c008c, #ff832c75);
+    --primary-a11: light-dark(#cc4e00, #ffa057);
+    --primary-text: var(--primary-11);
+    --primary-inverse: white;
+
+    /* accent: indigo */
+    --accent-7: light-dark(#abbdf9, #3a4f97);
+    --accent-9: light-dark(#3e63dd, #3e63dd);
+    --accent-10: light-dark(#3358d4, #5472e4);
+    --accent-11: light-dark(#3a5bc7, #9eb1ff);
+    --accent-a2: light-dark(#0040ff08, #3354fa17);
+    --accent-a3: light-dark(#0047f112, #2f62ff3c);
+    --accent-a4: light-dark(#0044ff1e, #3566ff57);
+    --accent-a5: light-dark(#0044ff2d, #4171fd6b);
+    --accent-a6: light-dark(#003eff3e, #5178fd7c);
+    --accent-a7: light-dark(#0037ed54, #5a7fff90);
+    --accent-a11: light-dark(#002bb7c5, #9eb1ff);
+    --accent-text: var(--accent-11);
+    --accent-inverse: white;
+  }
+
+  @supports (color: color(display-p3 1 1 1)) {
+    @media (color-gamut: p3) {
+      :root {
+        /* neutral: sand */
+        --neutral-1: light-dark(color(display-p3 0.992 0.992 0.989), color(display-p3 0.067 0.067 0.063));
+        --neutral-2: light-dark(color(display-p3 0.977 0.977 0.973), color(display-p3 0.098 0.098 0.094));
+        --neutral-3: light-dark(color(display-p3 0.943 0.942 0.936), color(display-p3 0.135 0.135 0.129));
+        --neutral-4: light-dark(color(display-p3 0.913 0.912 0.903), color(display-p3 0.164 0.163 0.156));
+        --neutral-5: light-dark(color(display-p3 0.885 0.883 0.873), color(display-p3 0.193 0.192 0.183));
+        --neutral-8: light-dark(color(display-p3 0.738 0.734 0.713), color(display-p3 0.384 0.378 0.357));
+        --neutral-11: light-dark(color(display-p3 0.388 0.388 0.37), color(display-p3 0.707 0.703 0.68));
+        --neutral-12: light-dark(color(display-p3 0.129 0.126 0.111), color(display-p3 0.933 0.933 0.926));
+        --neutral-a2: light-dark(color(display-p3 0.161 0.161 0.024 / 0.028), color(display-p3 0.992 0.992 0.988 / 0.034));
+        --neutral-a3: light-dark(color(display-p3 0.067 0.067 0.008 / 0.063), color(display-p3 0.996 0.996 0.992 / 0.072));
+        --neutral-a4: light-dark(color(display-p3 0.129 0.129 0.012 / 0.099), color(display-p3 0.992 0.992 0.953 / 0.106));
+        --neutral-a5: light-dark(color(display-p3 0.098 0.067 0.008 / 0.126), color(display-p3 1 1 0.965 / 0.135));
+        --neutral-a6: light-dark(color(display-p3 0.102 0.075 0.004 / 0.161), color(display-p3 1 0.976 0.929 / 0.177));
+        --neutral-a7: light-dark(color(display-p3 0.098 0.098 0.004 / 0.208), color(display-p3 1 0.984 0.929 / 0.236));
+
+        /* primary: orange */
+        --primary-7: light-dark(color(display-p3 0.919 0.693 0.486), color(display-p3 0.465 0.283 0.147));
+        --primary-9: light-dark(color(display-p3 0.9 0.45 0.2), color(display-p3 0.9 0.45 0.2));
+        --primary-10: light-dark(color(display-p3 0.87 0.409 0.164), color(display-p3 0.98 0.51 0.23));
+        --primary-11: light-dark(color(display-p3 0.76 0.34 0), color(display-p3 1 0.63 0.38));
+        --primary-a2: light-dark(color(display-p3 0.886 0.533 0.008 / 0.067), color(display-p3 0.992 0.529 0 / 0.051));
+        --primary-a3: light-dark(color(display-p3 0.922 0.584 0.008 / 0.15), color(display-p3 0.996 0.486 0 / 0.131));
+        --primary-a4: light-dark(color(display-p3 1 0.604 0.004 / 0.314), color(display-p3 0.996 0.384 0 / 0.211));
+        --primary-a5: light-dark(color(display-p3 1 0.569 0.004 / 0.416), color(display-p3 1 0.455 0 / 0.265));
+        --primary-a6: light-dark(color(display-p3 0.949 0.494 0.004 / 0.455), color(display-p3 1 0.529 0.129 / 0.332));
+        --primary-a7: light-dark(color(display-p3 0.839 0.408 0 / 0.514), color(display-p3 1 0.569 0.251 / 0.429));
+        --primary-a11: light-dark(color(display-p3 0.76 0.34 0), color(display-p3 1 0.63 0.38));
+
+        /* accent: indigo */
+        --accent-7: light-dark(color(display-p3 0.685 0.74 0.957), color(display-p3 0.245 0.309 0.575));
+        --accent-9: light-dark(color(display-p3 0.276 0.384 0.837), color(display-p3 0.276 0.384 0.837));
+        --accent-10: light-dark(color(display-p3 0.234 0.343 0.801), color(display-p3 0.354 0.445 0.866));
+        --accent-11: light-dark(color(display-p3 0.256 0.354 0.755), color(display-p3 0.63 0.69 1));
+        --accent-a2: light-dark(color(display-p3 0.024 0.161 0.863 / 0.028), color(display-p3 0.251 0.345 0.988 / 0.085));
+        --accent-a3: light-dark(color(display-p3 0.008 0.239 0.886 / 0.067), color(display-p3 0.243 0.404 1 / 0.223));
+        --accent-a4: light-dark(color(display-p3 0.004 0.247 1 / 0.114), color(display-p3 0.263 0.42 1 / 0.324));
+        --accent-a5: light-dark(color(display-p3 0.004 0.235 1 / 0.169), color(display-p3 0.314 0.451 1 / 0.4));
+        --accent-a6: light-dark(color(display-p3 0.004 0.208 0.984 / 0.232), color(display-p3 0.361 0.49 1 / 0.467));
+        --accent-a7: light-dark(color(display-p3 0.004 0.176 0.863 / 0.314), color(display-p3 0.388 0.51 1 / 0.547));
+        --accent-a11: light-dark(color(display-p3 0.256 0.354 0.755), color(display-p3 0.63 0.69 1));
+      }
+    }
+  }
+}

package/dist/themes/pink.css

@@ -0,0 +1,131 @@
+@layer tokens, theme, reset, base, layout, components, project, utilities;
+
+/* Theme: pink (neutral: mauve, primary: pink, accent: mint, success: grass). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
+@layer theme {
+  :root {
+    /* neutral: mauve */
+    --neutral-1: light-dark(#fdfcfd, #121113);
+    --neutral-2: light-dark(#faf9fb, #1a191b);
+    --neutral-3: light-dark(#f2eff3, #232225);
+    --neutral-4: light-dark(#eae7ec, #2b292d);
+    --neutral-5: light-dark(#e3dfe6, #323035);
+    --neutral-8: light-dark(#bcbac7, #625f69);
+    --neutral-11: light-dark(#65636d, #b5b2bc);
+    --neutral-12: light-dark(#211f26, #eeeef0);
+    --neutral-a2: light-dark(#2b005506, #f5f4f609);
+    --neutral-a3: light-dark(#30004010, #ebeaf814);
+    --neutral-a4: light-dark(#20003618, #eee5f81d);
+    --neutral-a5: light-dark(#20003820, #efe6fe25);
+    --neutral-a6: light-dark(#14003527, #f1e6fd30);
+    --neutral-a7: light-dark(#10003332, #eee9ff40);
+
+    /* primary: pink */
+    --primary-7: light-dark(#e7acd0, #833869);
+    --primary-9: light-dark(#d6409f, #d6409f);
+    --primary-10: light-dark(#cf3897, #de51a8);
+    --primary-11: light-dark(#c2298a, #ff8dcc);
+    --primary-a2: light-dark(#e0008008, #f420bb12);
+    --primary-a3: light-dark(#f4008c16, #fe37cc29);
+    --primary-a4: light-dark(#e2008b23, #fc1ec43f);
+    --primary-a5: light-dark(#d1008331, #fd35c24e);
+    --primary-a6: light-dark(#c0007840, #fd51c75f);
+    --primary-a7: light-dark(#b6006f53, #fd62c87b);
+    --primary-a11: light-dark(#b60074d6, #ff8dcc);
+    --primary-text: var(--primary-11);
+    --primary-inverse: white;
+
+    /* accent: mint */
+    --accent-7: light-dark(#7ecfbd, #1e685f);
+    --accent-9: light-dark(#86ead4, #86ead4);
+    --accent-10: light-dark(#7de0cb, #a8f5e5);
+    --accent-11: light-dark(#027864, #58d5ba);
+    --accent-a2: light-dark(#00b18a0d, #00f9f90b);
+    --accent-a3: light-dark(#00d29e22, #00fff61d);
+    --accent-a4: light-dark(#00cc9937, #00fff42c);
+    --accent-a5: light-dark(#00c0914c, #00fff23a);
+    --accent-a6: light-dark(#00b08663, #0effeb4a);
+    --accent-a7: light-dark(#00a17d81, #34fde55e);
+    --accent-a11: light-dark(#007763fd, #67ffded2);
+    --accent-text: light-dark(var(--neutral-12), var(--accent-11));
+    --accent-inverse: light-dark(var(--neutral-12), var(--neutral-1));
+
+    /* success: grass */
+    --success-7: light-dark(#94ce9a, #366740);
+    --success-9: light-dark(#46a758, #46a758);
+    --success-10: light-dark(#3e9b4f, #53b365);
+    --success-11: light-dark(#2a7e3b, #71d083);
+    --success-a2: light-dark(#0099000a, #5ef7780a);
+    --success-a3: light-dark(#00970016, #70fe8c1b);
+    --success-a4: light-dark(#009f0725, #57ff802c);
+    --success-a5: light-dark(#00930536, #68ff8b3b);
+    --success-a6: light-dark(#008f0a4d, #71ff8f4b);
+    --success-a7: light-dark(#018b0f6b, #77fd925d);
+    --success-a11: light-dark(#006514d5, #89ff9fcd);
+    --success-text: var(--success-11);
+    --success-inverse: white;
+
+    /* icons */
+    --icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2346a758' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
+  }
+
+  @supports (color: color(display-p3 1 1 1)) {
+    @media (color-gamut: p3) {
+      :root {
+        /* neutral: mauve */
+        --neutral-1: light-dark(color(display-p3 0.991 0.988 0.992), color(display-p3 0.07 0.067 0.074));
+        --neutral-2: light-dark(color(display-p3 0.98 0.976 0.984), color(display-p3 0.101 0.098 0.105));
+        --neutral-3: light-dark(color(display-p3 0.946 0.938 0.952), color(display-p3 0.138 0.134 0.144));
+        --neutral-4: light-dark(color(display-p3 0.915 0.906 0.925), color(display-p3 0.167 0.161 0.175));
+        --neutral-5: light-dark(color(display-p3 0.886 0.876 0.901), color(display-p3 0.196 0.189 0.206));
+        --neutral-8: light-dark(color(display-p3 0.735 0.728 0.777), color(display-p3 0.383 0.373 0.408));
+        --neutral-11: light-dark(color(display-p3 0.395 0.388 0.424), color(display-p3 0.707 0.7 0.735));
+        --neutral-12: light-dark(color(display-p3 0.128 0.122 0.147), color(display-p3 0.933 0.933 0.94));
+        --neutral-a2: light-dark(color(display-p3 0.184 0.024 0.349 / 0.024), color(display-p3 0.996 0.992 1 / 0.034));
+        --neutral-a3: light-dark(color(display-p3 0.129 0.008 0.255 / 0.063), color(display-p3 0.937 0.933 0.992 / 0.077));
+        --neutral-a4: light-dark(color(display-p3 0.094 0.012 0.216 / 0.095), color(display-p3 0.957 0.918 0.996 / 0.111));
+        --neutral-a5: light-dark(color(display-p3 0.098 0.008 0.224 / 0.126), color(display-p3 0.937 0.906 0.996 / 0.145));
+        --neutral-a6: light-dark(color(display-p3 0.055 0.004 0.18 / 0.153), color(display-p3 0.953 0.925 0.996 / 0.183));
+        --neutral-a7: light-dark(color(display-p3 0.067 0.008 0.184 / 0.197), color(display-p3 0.945 0.929 1 / 0.246));
+
+        /* primary: pink */
+        --primary-7: light-dark(color(display-p3 0.869 0.683 0.81), color(display-p3 0.477 0.238 0.405));
+        --primary-9: light-dark(color(display-p3 0.775 0.297 0.61), color(display-p3 0.775 0.297 0.61));
+        --primary-10: light-dark(color(display-p3 0.748 0.27 0.581), color(display-p3 0.808 0.356 0.645));
+        --primary-11: light-dark(color(display-p3 0.698 0.219 0.528), color(display-p3 1 0.535 0.78));
+        --primary-a2: light-dark(color(display-p3 0.757 0.02 0.51 / 0.032), color(display-p3 1 0.2 0.8 / 0.059));
+        --primary-a3: light-dark(color(display-p3 0.765 0.008 0.529 / 0.083), color(display-p3 1 0.294 0.886 / 0.139));
+        --primary-a4: light-dark(color(display-p3 0.737 0.008 0.506 / 0.134), color(display-p3 1 0.192 0.82 / 0.219));
+        --primary-a5: light-dark(color(display-p3 0.663 0.004 0.451 / 0.185), color(display-p3 1 0.282 0.827 / 0.274));
+        --primary-a6: light-dark(color(display-p3 0.616 0.004 0.424 / 0.244), color(display-p3 1 0.396 0.835 / 0.337));
+        --primary-a7: light-dark(color(display-p3 0.596 0.004 0.412 / 0.318), color(display-p3 1 0.459 0.831 / 0.442));
+        --primary-a11: light-dark(color(display-p3 0.698 0.219 0.528), color(display-p3 1 0.535 0.78));
+
+        /* accent: mint */
+        --accent-7: light-dark(color(display-p3 0.567 0.805 0.744), color(display-p3 0.207 0.403 0.373));
+        --accent-9: light-dark(color(display-p3 0.62 0.908 0.834), color(display-p3 0.62 0.908 0.834));
+        --accent-10: light-dark(color(display-p3 0.585 0.871 0.797), color(display-p3 0.725 0.954 0.898));
+        --accent-11: light-dark(color(display-p3 0.203 0.463 0.397), color(display-p3 0.482 0.825 0.733));
+        --accent-a2: light-dark(color(display-p3 0.02 0.647 0.467 / 0.044), color(display-p3 0.071 0.98 0.98 / 0.043));
+        --accent-a3: light-dark(color(display-p3 0.004 0.761 0.553 / 0.114), color(display-p3 0.176 0.996 0.996 / 0.11));
+        --accent-a4: light-dark(color(display-p3 0.004 0.741 0.545 / 0.181), color(display-p3 0.071 0.996 0.973 / 0.169));
+        --accent-a5: light-dark(color(display-p3 0.004 0.678 0.51 / 0.255), color(display-p3 0.243 1 0.949 / 0.223));
+        --accent-a6: light-dark(color(display-p3 0.004 0.616 0.463 / 0.334), color(display-p3 0.369 1 0.933 / 0.286));
+        --accent-a7: light-dark(color(display-p3 0.004 0.549 0.412 / 0.432), color(display-p3 0.459 1 0.914 / 0.362));
+        --accent-a11: light-dark(color(display-p3 0.203 0.463 0.397), color(display-p3 0.482 0.825 0.733));
+
+        /* success: grass */
+        --success-7: light-dark(color(display-p3 0.628 0.803 0.622), color(display-p3 0.258 0.4 0.264));
+        --success-9: light-dark(color(display-p3 0.38 0.647 0.378), color(display-p3 0.38 0.647 0.378));
+        --success-10: light-dark(color(display-p3 0.344 0.598 0.342), color(display-p3 0.426 0.694 0.426));
+        --success-11: light-dark(color(display-p3 0.263 0.488 0.261), color(display-p3 0.535 0.807 0.542));
+        --success-a2: light-dark(color(display-p3 0.024 0.565 0.024 / 0.036), color(display-p3 0.482 0.996 0.584 / 0.038));
+        --success-a3: light-dark(color(display-p3 0.059 0.576 0.008 / 0.083), color(display-p3 0.549 0.992 0.588 / 0.106));
+        --success-a4: light-dark(color(display-p3 0.035 0.565 0.008 / 0.134), color(display-p3 0.51 0.996 0.557 / 0.169));
+        --success-a5: light-dark(color(display-p3 0.047 0.545 0.008 / 0.197), color(display-p3 0.553 1 0.588 / 0.227));
+        --success-a6: light-dark(color(display-p3 0.031 0.502 0.004 / 0.275), color(display-p3 0.584 1 0.608 / 0.29));
+        --success-a7: light-dark(color(display-p3 0.012 0.482 0.004 / 0.377), color(display-p3 0.604 1 0.616 / 0.358));
+        --success-a11: light-dark(color(display-p3 0.263 0.488 0.261), color(display-p3 0.535 0.807 0.542));
+      }
+    }
+  }
+}

package/dist/themes/plum.css

@@ -0,0 +1,128 @@
+@layer tokens, theme, reset, base, layout, components, project, utilities;
+
+/* Theme: plum (neutral: mauve, primary: plum, accent: iris, info: cyan). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
+@layer theme {
+  :root {
+    /* neutral: mauve */
+    --neutral-1: light-dark(#fdfcfd, #121113);
+    --neutral-2: light-dark(#faf9fb, #1a191b);
+    --neutral-3: light-dark(#f2eff3, #232225);
+    --neutral-4: light-dark(#eae7ec, #2b292d);
+    --neutral-5: light-dark(#e3dfe6, #323035);
+    --neutral-8: light-dark(#bcbac7, #625f69);
+    --neutral-11: light-dark(#65636d, #b5b2bc);
+    --neutral-12: light-dark(#211f26, #eeeef0);
+    --neutral-a2: light-dark(#2b005506, #f5f4f609);
+    --neutral-a3: light-dark(#30004010, #ebeaf814);
+    --neutral-a4: light-dark(#20003618, #eee5f81d);
+    --neutral-a5: light-dark(#20003820, #efe6fe25);
+    --neutral-a6: light-dark(#14003527, #f1e6fd30);
+    --neutral-a7: light-dark(#10003332, #eee9ff40);
+
+    /* primary: plum */
+    --primary-7: light-dark(#deade3, #734079);
+    --primary-9: light-dark(#ab4aba, #ab4aba);
+    --primary-10: light-dark(#a144af, #b658c4);
+    --primary-11: light-dark(#953ea3, #e796f3);
+    --primary-a2: light-dark(#c000c008, #f22ff211);
+    --primary-a3: light-dark(#cc00cc14, #fd4cfd27);
+    --primary-a4: light-dark(#c200c921, #f646ff3a);
+    --primary-a5: light-dark(#b700bd2e, #f455ff48);
+    --primary-a6: light-dark(#a400b03d, #f66dff56);
+    --primary-a7: light-dark(#9900a852, #f07cfd70);
+    --primary-a11: light-dark(#730086c1, #f19cfef3);
+    --primary-text: var(--primary-11);
+    --primary-inverse: white;
+
+    /* accent: iris */
+    --accent-7: light-dark(#b8baf8, #4a4a95);
+    --accent-9: light-dark(#5b5bd6, #5b5bd6);
+    --accent-10: light-dark(#5151cd, #6e6ade);
+    --accent-11: light-dark(#5753c6, #b1a9ff);
+    --accent-a2: light-dark(#0000ff07, #564bf916);
+    --accent-a3: light-dark(#0011ee0f, #525bff3b);
+    --accent-a4: light-dark(#000bff19, #4d58ff5a);
+    --accent-a5: light-dark(#000eff25, #5b62fd6b);
+    --accent-a6: light-dark(#000aff34, #6d6ffd7a);
+    --accent-a7: light-dark(#0008e647, #7777fe8e);
+    --accent-a11: light-dark(#0600abac, #b1a9ff);
+    --accent-text: var(--accent-11);
+    --accent-inverse: white;
+
+    /* info: cyan */
+    --info-7: light-dark(#7dcedc, #12677e);
+    --info-9: light-dark(#00a2c7, #00a2c7);
+    --info-10: light-dark(#0797b9, #23afd0);
+    --info-11: light-dark(#107d98, #4ccce6);
+    --info-a2: light-dark(#009db10d, #02a7f211);
+    --info-a3: light-dark(#00c2d121, #00befd28);
+    --info-a4: light-dark(#00bcd435, #00baff3b);
+    --info-a5: light-dark(#01b4cc4a, #00befd4d);
+    --info-a6: light-dark(#00a7c162, #00c7fd5e);
+    --info-a7: light-dark(#009fbb82, #14cdff75);
+    --info-a11: light-dark(#007491ef, #52e1fee5);
+    --info-text: var(--info-11);
+    --info-inverse: white;
+  }
+
+  @supports (color: color(display-p3 1 1 1)) {
+    @media (color-gamut: p3) {
+      :root {
+        /* neutral: mauve */
+        --neutral-1: light-dark(color(display-p3 0.991 0.988 0.992), color(display-p3 0.07 0.067 0.074));
+        --neutral-2: light-dark(color(display-p3 0.98 0.976 0.984), color(display-p3 0.101 0.098 0.105));
+        --neutral-3: light-dark(color(display-p3 0.946 0.938 0.952), color(display-p3 0.138 0.134 0.144));
+        --neutral-4: light-dark(color(display-p3 0.915 0.906 0.925), color(display-p3 0.167 0.161 0.175));
+        --neutral-5: light-dark(color(display-p3 0.886 0.876 0.901), color(display-p3 0.196 0.189 0.206));
+        --neutral-8: light-dark(color(display-p3 0.735 0.728 0.777), color(display-p3 0.383 0.373 0.408));
+        --neutral-11: light-dark(color(display-p3 0.395 0.388 0.424), color(display-p3 0.707 0.7 0.735));
+        --neutral-12: light-dark(color(display-p3 0.128 0.122 0.147), color(display-p3 0.933 0.933 0.94));
+        --neutral-a2: light-dark(color(display-p3 0.184 0.024 0.349 / 0.024), color(display-p3 0.996 0.992 1 / 0.034));
+        --neutral-a3: light-dark(color(display-p3 0.129 0.008 0.255 / 0.063), color(display-p3 0.937 0.933 0.992 / 0.077));
+        --neutral-a4: light-dark(color(display-p3 0.094 0.012 0.216 / 0.095), color(display-p3 0.957 0.918 0.996 / 0.111));
+        --neutral-a5: light-dark(color(display-p3 0.098 0.008 0.224 / 0.126), color(display-p3 0.937 0.906 0.996 / 0.145));
+        --neutral-a6: light-dark(color(display-p3 0.055 0.004 0.18 / 0.153), color(display-p3 0.953 0.925 0.996 / 0.183));
+        --neutral-a7: light-dark(color(display-p3 0.067 0.008 0.184 / 0.197), color(display-p3 0.945 0.929 1 / 0.246));
+
+        /* primary: plum */
+        --primary-7: light-dark(color(display-p3 0.84 0.686 0.877), color(display-p3 0.424 0.262 0.461));
+        --primary-9: light-dark(color(display-p3 0.624 0.313 0.708), color(display-p3 0.624 0.313 0.708));
+        --primary-10: light-dark(color(display-p3 0.587 0.29 0.667), color(display-p3 0.666 0.365 0.748));
+        --primary-11: light-dark(color(display-p3 0.543 0.263 0.619), color(display-p3 0.86 0.602 0.933));
+        --primary-a2: light-dark(color(display-p3 0.58 0.024 0.58 / 0.028), color(display-p3 0.933 0.267 1 / 0.059));
+        --primary-a3: light-dark(color(display-p3 0.655 0.008 0.753 / 0.079), color(display-p3 0.918 0.333 0.996 / 0.148));
+        --primary-a4: light-dark(color(display-p3 0.627 0.008 0.722 / 0.126), color(display-p3 0.91 0.318 1 / 0.219));
+        --primary-a5: light-dark(color(display-p3 0.58 0.004 0.69 / 0.177), color(display-p3 0.914 0.388 1 / 0.269));
+        --primary-a6: light-dark(color(display-p3 0.537 0.004 0.655 / 0.236), color(display-p3 0.906 0.463 1 / 0.328));
+        --primary-a7: light-dark(color(display-p3 0.49 0.004 0.616 / 0.314), color(display-p3 0.906 0.529 1 / 0.425));
+        --primary-a11: light-dark(color(display-p3 0.543 0.263 0.619), color(display-p3 0.86 0.602 0.933));
+
+        /* accent: iris */
+        --accent-7: light-dark(color(display-p3 0.721 0.727 0.955), color(display-p3 0.291 0.289 0.565));
+        --accent-9: light-dark(color(display-p3 0.357 0.357 0.81), color(display-p3 0.357 0.357 0.81));
+        --accent-10: light-dark(color(display-p3 0.318 0.318 0.774), color(display-p3 0.428 0.416 0.843));
+        --accent-11: light-dark(color(display-p3 0.337 0.326 0.748), color(display-p3 0.685 0.662 1));
+        --accent-a2: light-dark(color(display-p3 0.024 0.024 0.863 / 0.028), color(display-p3 0.361 0.314 1 / 0.08));
+        --accent-a3: light-dark(color(display-p3 0.004 0.071 0.871 / 0.059), color(display-p3 0.357 0.373 1 / 0.219));
+        --accent-a4: light-dark(color(display-p3 0.012 0.051 1 / 0.099), color(display-p3 0.325 0.361 1 / 0.337));
+        --accent-a5: light-dark(color(display-p3 0.008 0.035 1 / 0.142), color(display-p3 0.38 0.4 1 / 0.4));
+        --accent-a6: light-dark(color(display-p3 0 0.02 0.941 / 0.2), color(display-p3 0.447 0.447 1 / 0.454));
+        --accent-a7: light-dark(color(display-p3 0.004 0.02 0.847 / 0.279), color(display-p3 0.486 0.486 1 / 0.534));
+        --accent-a11: light-dark(color(display-p3 0.337 0.326 0.748), color(display-p3 0.685 0.662 1));
+
+        /* info: cyan */
+        --info-7: light-dark(color(display-p3 0.564 0.8 0.854), color(display-p3 0.186 0.398 0.484));
+        --info-9: light-dark(color(display-p3 0.282 0.627 0.765), color(display-p3 0.282 0.627 0.765));
+        --info-10: light-dark(color(display-p3 0.264 0.583 0.71), color(display-p3 0.331 0.675 0.801));
+        --info-11: light-dark(color(display-p3 0.08 0.48 0.63), color(display-p3 0.446 0.79 0.887));
+        --info-a2: light-dark(color(display-p3 0.02 0.557 0.647 / 0.044), color(display-p3 0.133 0.733 1 / 0.059));
+        --info-a3: light-dark(color(display-p3 0.004 0.694 0.796 / 0.114), color(display-p3 0.122 0.741 0.996 / 0.152));
+        --info-a4: light-dark(color(display-p3 0.004 0.678 0.784 / 0.181), color(display-p3 0.051 0.725 1 / 0.227));
+        --info-a5: light-dark(color(display-p3 0.004 0.624 0.733 / 0.248), color(display-p3 0.149 0.757 1 / 0.29));
+        --info-a6: light-dark(color(display-p3 0.004 0.584 0.706 / 0.33), color(display-p3 0.267 0.792 1 / 0.358));
+        --info-a7: light-dark(color(display-p3 0.004 0.541 0.667 / 0.436), color(display-p3 0.333 0.808 1 / 0.446));
+        --info-a11: light-dark(color(display-p3 0.08 0.48 0.63), color(display-p3 0.446 0.79 0.887));
+      }
+    }
+  }
+}

package/dist/themes/purple.css

@@ -0,0 +1,100 @@
+@layer tokens, theme, reset, base, layout, components, project, utilities;
+
+/* Theme: purple (neutral: mauve, primary: purple, accent: gold). Generated by scripts/build-themes.mjs from scripts/themes.json. Do not edit. */
+@layer theme {
+  :root {
+    /* neutral: mauve */
+    --neutral-1: light-dark(#fdfcfd, #121113);
+    --neutral-2: light-dark(#faf9fb, #1a191b);
+    --neutral-3: light-dark(#f2eff3, #232225);
+    --neutral-4: light-dark(#eae7ec, #2b292d);
+    --neutral-5: light-dark(#e3dfe6, #323035);
+    --neutral-8: light-dark(#bcbac7, #625f69);
+    --neutral-11: light-dark(#65636d, #b5b2bc);
+    --neutral-12: light-dark(#211f26, #eeeef0);
+    --neutral-a2: light-dark(#2b005506, #f5f4f609);
+    --neutral-a3: light-dark(#30004010, #ebeaf814);
+    --neutral-a4: light-dark(#20003618, #eee5f81d);
+    --neutral-a5: light-dark(#20003820, #efe6fe25);
+    --neutral-a6: light-dark(#14003527, #f1e6fd30);
+    --neutral-a7: light-dark(#10003332, #eee9ff40);
+
+    /* primary: purple */
+    --primary-7: light-dark(#d1afec, #664282);
+    --primary-9: light-dark(#8e4ec6, #8e4ec6);
+    --primary-10: light-dark(#8347b9, #9a5cd0);
+    --primary-11: light-dark(#8145b5, #d19dff);
+    --primary-a2: light-dark(#8000e008, #b744f714);
+    --primary-a3: light-dark(#8e00f112, #c150ff2d);
+    --primary-a4: light-dark(#8d00e51d, #bb53fd42);
+    --primary-a5: light-dark(#8000db2a, #be5cfd51);
+    --primary-a6: light-dark(#7a01d03b, #c16dfd61);
+    --primary-a7: light-dark(#6d00c350, #c378fd7a);
+    --primary-a11: light-dark(#52009aba, #d19dff);
+    --primary-text: var(--primary-11);
+    --primary-inverse: white;
+
+    /* accent: gold */
+    --accent-7: light-dark(#cbc0aa, #544f46);
+    --accent-9: light-dark(#978365, #978365);
+    --accent-10: light-dark(#8c7a5e, #a39073);
+    --accent-11: light-dark(#71624b, #cbb99f);
+    --accent-a2: light-dark(#9d8a000d, #f9e29d0b);
+    --accent-a3: light-dark(#75600018, #f8ecbb15);
+    --accent-a4: light-dark(#6b4e0024, #ffeec41e);
+    --accent-a5: light-dark(#60460030, #feecc22a);
+    --accent-a6: light-dark(#64440040, #feebcb37);
+    --accent-a7: light-dark(#63420055, #ffedcd48);
+    --accent-a11: light-dark(#362100b4, #fee7c6c8);
+    --accent-text: var(--accent-11);
+    --accent-inverse: white;
+  }
+
+  @supports (color: color(display-p3 1 1 1)) {
+    @media (color-gamut: p3) {
+      :root {
+        /* neutral: mauve */
+        --neutral-1: light-dark(color(display-p3 0.991 0.988 0.992), color(display-p3 0.07 0.067 0.074));
+        --neutral-2: light-dark(color(display-p3 0.98 0.976 0.984), color(display-p3 0.101 0.098 0.105));
+        --neutral-3: light-dark(color(display-p3 0.946 0.938 0.952), color(display-p3 0.138 0.134 0.144));
+        --neutral-4: light-dark(color(display-p3 0.915 0.906 0.925), color(display-p3 0.167 0.161 0.175));
+        --neutral-5: light-dark(color(display-p3 0.886 0.876 0.901), color(display-p3 0.196 0.189 0.206));
+        --neutral-8: light-dark(color(display-p3 0.735 0.728 0.777), color(display-p3 0.383 0.373 0.408));
+        --neutral-11: light-dark(color(display-p3 0.395 0.388 0.424), color(display-p3 0.707 0.7 0.735));
+        --neutral-12: light-dark(color(display-p3 0.128 0.122 0.147), color(display-p3 0.933 0.933 0.94));
+        --neutral-a2: light-dark(color(display-p3 0.184 0.024 0.349 / 0.024), color(display-p3 0.996 0.992 1 / 0.034));
+        --neutral-a3: light-dark(color(display-p3 0.129 0.008 0.255 / 0.063), color(display-p3 0.937 0.933 0.992 / 0.077));
+        --neutral-a4: light-dark(color(display-p3 0.094 0.012 0.216 / 0.095), color(display-p3 0.957 0.918 0.996 / 0.111));
+        --neutral-a5: light-dark(color(display-p3 0.098 0.008 0.224 / 0.126), color(display-p3 0.937 0.906 0.996 / 0.145));
+        --neutral-a6: light-dark(color(display-p3 0.055 0.004 0.18 / 0.153), color(display-p3 0.953 0.925 0.996 / 0.183));
+        --neutral-a7: light-dark(color(display-p3 0.067 0.008 0.184 / 0.197), color(display-p3 0.945 0.929 1 / 0.246));
+
+        /* primary: purple */
+        --primary-7: light-dark(color(display-p3 0.799 0.69 0.91), color(display-p3 0.381 0.266 0.496));
+        --primary-9: light-dark(color(display-p3 0.523 0.318 0.751), color(display-p3 0.523 0.318 0.751));
+        --primary-10: light-dark(color(display-p3 0.483 0.289 0.7), color(display-p3 0.57 0.373 0.791));
+        --primary-11: light-dark(color(display-p3 0.473 0.281 0.687), color(display-p3 0.8 0.62 1));
+        --primary-a2: light-dark(color(display-p3 0.443 0.024 0.722 / 0.028), color(display-p3 0.722 0.286 0.996 / 0.072));
+        --primary-a3: light-dark(color(display-p3 0.506 0.008 0.835 / 0.071), color(display-p3 0.718 0.349 0.996 / 0.169));
+        --primary-a4: light-dark(color(display-p3 0.451 0.004 0.831 / 0.114), color(display-p3 0.702 0.353 1 / 0.248));
+        --primary-a5: light-dark(color(display-p3 0.431 0.004 0.788 / 0.165), color(display-p3 0.718 0.404 1 / 0.303));
+        --primary-a6: light-dark(color(display-p3 0.384 0.004 0.745 / 0.228), color(display-p3 0.733 0.455 1 / 0.366));
+        --primary-a7: light-dark(color(display-p3 0.357 0.004 0.71 / 0.31), color(display-p3 0.753 0.506 1 / 0.458));
+        --primary-a11: light-dark(color(display-p3 0.473 0.281 0.687), color(display-p3 0.8 0.62 1));
+
+        /* accent: gold */
+        --accent-7: light-dark(color(display-p3 0.788 0.753 0.677), color(display-p3 0.327 0.31 0.277));
+        --accent-9: light-dark(color(display-p3 0.579 0.517 0.41), color(display-p3 0.579 0.517 0.41));
+        --accent-10: light-dark(color(display-p3 0.538 0.479 0.38), color(display-p3 0.628 0.566 0.463));
+        --accent-11: light-dark(color(display-p3 0.433 0.386 0.305), color(display-p3 0.784 0.728 0.635));
+        --accent-a2: light-dark(color(display-p3 0.592 0.514 0.024 / 0.048), color(display-p3 0.98 0.89 0.616 / 0.043));
+        --accent-a3: light-dark(color(display-p3 0.4 0.357 0.012 / 0.091), color(display-p3 1 0.949 0.753 / 0.08));
+        --accent-a4: light-dark(color(display-p3 0.357 0.298 0.008 / 0.134), color(display-p3 1 0.933 0.8 / 0.118));
+        --accent-a5: light-dark(color(display-p3 0.345 0.282 0.004 / 0.185), color(display-p3 1 0.949 0.804 / 0.16));
+        --accent-a6: light-dark(color(display-p3 0.341 0.263 0.004 / 0.244), color(display-p3 1 0.925 0.8 / 0.215));
+        --accent-a7: light-dark(color(display-p3 0.345 0.235 0.004 / 0.322), color(display-p3 1 0.945 0.831 / 0.278));
+        --accent-a11: light-dark(color(display-p3 0.433 0.386 0.305), color(display-p3 0.784 0.728 0.635));
+      }
+    }
+  }
+}