@diskette/palette 0.1.0

package/dist/cyan-p3.css

@@ -0,0 +1,95 @@
+@theme static {
+  --color-cyan-1: var(--cyan-1);
+  --color-cyan-2: var(--cyan-2);
+  --color-cyan-3: var(--cyan-3);
+  --color-cyan-4: var(--cyan-4);
+  --color-cyan-5: var(--cyan-5);
+  --color-cyan-6: var(--cyan-6);
+  --color-cyan-7: var(--cyan-7);
+  --color-cyan-8: var(--cyan-8);
+  --color-cyan-9: var(--cyan-9);
+  --color-cyan-10: var(--cyan-10);
+  --color-cyan-11: var(--cyan-11);
+  --color-cyan-12: var(--cyan-12);
+
+  --color-cyan-a1: var(--cyan-a1);
+  --color-cyan-a2: var(--cyan-a2);
+  --color-cyan-a3: var(--cyan-a3);
+  --color-cyan-a4: var(--cyan-a4);
+  --color-cyan-a5: var(--cyan-a5);
+  --color-cyan-a6: var(--cyan-a6);
+  --color-cyan-a7: var(--cyan-a7);
+  --color-cyan-a8: var(--cyan-a8);
+  --color-cyan-a9: var(--cyan-a9);
+  --color-cyan-a10: var(--cyan-a10);
+  --color-cyan-a11: var(--cyan-a11);
+  --color-cyan-a12: var(--cyan-a12);
+
+  --color-cyan-contrast: var(--cyan-contrast);
+  --color-cyan-surface: var(--cyan-surface);
+  --color-cyan-indicator: var(--cyan-indicator);
+  --color-cyan-track: var(--cyan-track);
+}
+
+:root {
+  --cyan-1: color(display-p3 0.982 0.992 0.996);
+  --cyan-2: color(display-p3 0.955 0.981 0.984);
+  --cyan-3: color(display-p3 0.888 0.965 0.975);
+  --cyan-4: color(display-p3 0.821 0.941 0.959);
+  --cyan-5: color(display-p3 0.751 0.907 0.935);
+  --cyan-6: color(display-p3 0.671 0.862 0.9);
+  --cyan-7: color(display-p3 0.564 0.8 0.854);
+  --cyan-8: color(display-p3 0.388 0.715 0.798);
+  --cyan-9: color(display-p3 0.282 0.627 0.765);
+  --cyan-10: color(display-p3 0.264 0.583 0.71);
+  --cyan-11: color(display-p3 0.08 0.48 0.63);
+  --cyan-12: color(display-p3 0.108 0.232 0.277);
+
+  --cyan-a1: color(display-p3 0.02 0.608 0.804 / 0.02);
+  --cyan-a2: color(display-p3 0.02 0.557 0.647 / 0.044);
+  --cyan-a3: color(display-p3 0.004 0.694 0.796 / 0.114);
+  --cyan-a4: color(display-p3 0.004 0.678 0.784 / 0.181);
+  --cyan-a5: color(display-p3 0.004 0.624 0.733 / 0.248);
+  --cyan-a6: color(display-p3 0.004 0.584 0.706 / 0.33);
+  --cyan-a7: color(display-p3 0.004 0.541 0.667 / 0.436);
+  --cyan-a8: color(display-p3 0 0.533 0.667 / 0.612);
+  --cyan-a9: color(display-p3 0 0.482 0.675 / 0.718);
+  --cyan-a10: color(display-p3 0 0.435 0.608 / 0.738);
+  --cyan-a11: color(display-p3 0.08 0.48 0.63);
+  --cyan-a12: color(display-p3 0.108 0.232 0.277);
+
+  --cyan-contrast: white;
+  --cyan-surface: color(display-p3 0.9412 0.9765 0.9804 / 0.8);
+  --cyan-indicator: var(--cyan-9);
+  --cyan-track: var(--cyan-9);
+}
+
+.dark {
+  --cyan-1: color(display-p3 0.053 0.085 0.098);
+  --cyan-2: color(display-p3 0.072 0.105 0.122);
+  --cyan-3: color(display-p3 0.073 0.168 0.209);
+  --cyan-4: color(display-p3 0.063 0.216 0.277);
+  --cyan-5: color(display-p3 0.091 0.267 0.336);
+  --cyan-6: color(display-p3 0.137 0.324 0.4);
+  --cyan-7: color(display-p3 0.186 0.398 0.484);
+  --cyan-8: color(display-p3 0.23 0.496 0.6);
+  --cyan-9: color(display-p3 0.282 0.627 0.765);
+  --cyan-10: color(display-p3 0.331 0.675 0.801);
+  --cyan-11: color(display-p3 0.446 0.79 0.887);
+  --cyan-12: color(display-p3 0.757 0.919 0.962);
+
+  --cyan-a1: color(display-p3 0 0.647 0.992 / 0.034);
+  --cyan-a2: color(display-p3 0.133 0.733 1 / 0.059);
+  --cyan-a3: color(display-p3 0.122 0.741 0.996 / 0.152);
+  --cyan-a4: color(display-p3 0.051 0.725 1 / 0.227);
+  --cyan-a5: color(display-p3 0.149 0.757 1 / 0.29);
+  --cyan-a6: color(display-p3 0.267 0.792 1 / 0.358);
+  --cyan-a7: color(display-p3 0.333 0.808 1 / 0.446);
+  --cyan-a8: color(display-p3 0.357 0.816 1 / 0.572);
+  --cyan-a9: color(display-p3 0.357 0.82 1 / 0.748);
+  --cyan-a10: color(display-p3 0.4 0.839 1 / 0.786);
+  --cyan-a11: color(display-p3 0.446 0.79 0.887);
+  --cyan-a12: color(display-p3 0.757 0.919 0.962);
+
+  --cyan-surface: color(display-p3 0.0784 0.1412 0.1725 / 0.5);
+}

package/dist/cyan-tokens.css

@@ -0,0 +1,32 @@
+[data-accent-color='cyan'] {
+  --accent-1: var(--cyan-1);
+  --accent-2: var(--cyan-2);
+  --accent-3: var(--cyan-3);
+  --accent-4: var(--cyan-4);
+  --accent-5: var(--cyan-5);
+  --accent-6: var(--cyan-6);
+  --accent-7: var(--cyan-7);
+  --accent-8: var(--cyan-8);
+  --accent-9: var(--cyan-9);
+  --accent-10: var(--cyan-10);
+  --accent-11: var(--cyan-11);
+  --accent-12: var(--cyan-12);
+
+  --accent-a1: var(--cyan-a1);
+  --accent-a2: var(--cyan-a2);
+  --accent-a3: var(--cyan-a3);
+  --accent-a4: var(--cyan-a4);
+  --accent-a5: var(--cyan-a5);
+  --accent-a6: var(--cyan-a6);
+  --accent-a7: var(--cyan-a7);
+  --accent-a8: var(--cyan-a8);
+  --accent-a9: var(--cyan-a9);
+  --accent-a10: var(--cyan-a10);
+  --accent-a11: var(--cyan-a11);
+  --accent-a12: var(--cyan-a12);
+
+  --accent-contrast: var(--cyan-contrast);
+  --accent-surface: var(--cyan-surface);
+  --accent-indicator: var(--cyan-indicator);
+  --accent-track: var(--cyan-track);
+}

package/dist/gold-p3.css

@@ -0,0 +1,95 @@
+@theme static {
+  --color-gold-1: var(--gold-1);
+  --color-gold-2: var(--gold-2);
+  --color-gold-3: var(--gold-3);
+  --color-gold-4: var(--gold-4);
+  --color-gold-5: var(--gold-5);
+  --color-gold-6: var(--gold-6);
+  --color-gold-7: var(--gold-7);
+  --color-gold-8: var(--gold-8);
+  --color-gold-9: var(--gold-9);
+  --color-gold-10: var(--gold-10);
+  --color-gold-11: var(--gold-11);
+  --color-gold-12: var(--gold-12);
+
+  --color-gold-a1: var(--gold-a1);
+  --color-gold-a2: var(--gold-a2);
+  --color-gold-a3: var(--gold-a3);
+  --color-gold-a4: var(--gold-a4);
+  --color-gold-a5: var(--gold-a5);
+  --color-gold-a6: var(--gold-a6);
+  --color-gold-a7: var(--gold-a7);
+  --color-gold-a8: var(--gold-a8);
+  --color-gold-a9: var(--gold-a9);
+  --color-gold-a10: var(--gold-a10);
+  --color-gold-a11: var(--gold-a11);
+  --color-gold-a12: var(--gold-a12);
+
+  --color-gold-contrast: var(--gold-contrast);
+  --color-gold-surface: var(--gold-surface);
+  --color-gold-indicator: var(--gold-indicator);
+  --color-gold-track: var(--gold-track);
+}
+
+:root {
+  --gold-1: color(display-p3 0.992 0.992 0.989);
+  --gold-2: color(display-p3 0.98 0.976 0.953);
+  --gold-3: color(display-p3 0.947 0.94 0.909);
+  --gold-4: color(display-p3 0.914 0.904 0.865);
+  --gold-5: color(display-p3 0.88 0.865 0.816);
+  --gold-6: color(display-p3 0.84 0.818 0.756);
+  --gold-7: color(display-p3 0.788 0.753 0.677);
+  --gold-8: color(display-p3 0.715 0.66 0.565);
+  --gold-9: color(display-p3 0.579 0.517 0.41);
+  --gold-10: color(display-p3 0.538 0.479 0.38);
+  --gold-11: color(display-p3 0.433 0.386 0.305);
+  --gold-12: color(display-p3 0.227 0.209 0.173);
+
+  --gold-a1: color(display-p3 0.349 0.349 0.024 / 0.012);
+  --gold-a2: color(display-p3 0.592 0.514 0.024 / 0.048);
+  --gold-a3: color(display-p3 0.4 0.357 0.012 / 0.091);
+  --gold-a4: color(display-p3 0.357 0.298 0.008 / 0.134);
+  --gold-a5: color(display-p3 0.345 0.282 0.004 / 0.185);
+  --gold-a6: color(display-p3 0.341 0.263 0.004 / 0.244);
+  --gold-a7: color(display-p3 0.345 0.235 0.004 / 0.322);
+  --gold-a8: color(display-p3 0.345 0.22 0.004 / 0.436);
+  --gold-a9: color(display-p3 0.286 0.18 0 / 0.589);
+  --gold-a10: color(display-p3 0.255 0.161 0 / 0.62);
+  --gold-a11: color(display-p3 0.433 0.386 0.305);
+  --gold-a12: color(display-p3 0.227 0.209 0.173);
+
+  --gold-contrast: white;
+  --gold-surface: color(display-p3 0.9765 0.9725 0.9412 / 0.8);
+  --gold-indicator: var(--gold-9);
+  --gold-track: var(--gold-9);
+}
+
+.dark {
+  --gold-1: color(display-p3 0.071 0.071 0.067);
+  --gold-2: color(display-p3 0.104 0.101 0.09);
+  --gold-3: color(display-p3 0.141 0.136 0.122);
+  --gold-4: color(display-p3 0.177 0.17 0.152);
+  --gold-5: color(display-p3 0.217 0.207 0.185);
+  --gold-6: color(display-p3 0.265 0.252 0.225);
+  --gold-7: color(display-p3 0.327 0.31 0.277);
+  --gold-8: color(display-p3 0.407 0.384 0.342);
+  --gold-9: color(display-p3 0.579 0.517 0.41);
+  --gold-10: color(display-p3 0.628 0.566 0.463);
+  --gold-11: color(display-p3 0.784 0.728 0.635);
+  --gold-12: color(display-p3 0.906 0.887 0.855);
+
+  --gold-a1: color(display-p3 0.855 0.855 0.071 / 0.005);
+  --gold-a2: color(display-p3 0.98 0.89 0.616 / 0.043);
+  --gold-a3: color(display-p3 1 0.949 0.753 / 0.08);
+  --gold-a4: color(display-p3 1 0.933 0.8 / 0.118);
+  --gold-a5: color(display-p3 1 0.949 0.804 / 0.16);
+  --gold-a6: color(display-p3 1 0.925 0.8 / 0.215);
+  --gold-a7: color(display-p3 1 0.945 0.831 / 0.278);
+  --gold-a8: color(display-p3 1 0.937 0.82 / 0.366);
+  --gold-a9: color(display-p3 0.996 0.882 0.69 / 0.551);
+  --gold-a10: color(display-p3 1 0.894 0.725 / 0.601);
+  --gold-a11: color(display-p3 0.784 0.728 0.635);
+  --gold-a12: color(display-p3 0.906 0.887 0.855);
+
+  --gold-surface: color(display-p3 0.1412 0.1333 0.1098 / 0.5);
+}

package/dist/grass-p3.css

@@ -0,0 +1,95 @@
+@theme static {
+  --color-grass-1: var(--grass-1);
+  --color-grass-2: var(--grass-2);
+  --color-grass-3: var(--grass-3);
+  --color-grass-4: var(--grass-4);
+  --color-grass-5: var(--grass-5);
+  --color-grass-6: var(--grass-6);
+  --color-grass-7: var(--grass-7);
+  --color-grass-8: var(--grass-8);
+  --color-grass-9: var(--grass-9);
+  --color-grass-10: var(--grass-10);
+  --color-grass-11: var(--grass-11);
+  --color-grass-12: var(--grass-12);
+
+  --color-grass-a1: var(--grass-a1);
+  --color-grass-a2: var(--grass-a2);
+  --color-grass-a3: var(--grass-a3);
+  --color-grass-a4: var(--grass-a4);
+  --color-grass-a5: var(--grass-a5);
+  --color-grass-a6: var(--grass-a6);
+  --color-grass-a7: var(--grass-a7);
+  --color-grass-a8: var(--grass-a8);
+  --color-grass-a9: var(--grass-a9);
+  --color-grass-a10: var(--grass-a10);
+  --color-grass-a11: var(--grass-a11);
+  --color-grass-a12: var(--grass-a12);
+
+  --color-grass-contrast: var(--grass-contrast);
+  --color-grass-surface: var(--grass-surface);
+  --color-grass-indicator: var(--grass-indicator);
+  --color-grass-track: var(--grass-track);
+}
+
+:root {
+  --grass-1: color(display-p3 0.986 0.996 0.985);
+  --grass-2: color(display-p3 0.966 0.983 0.964);
+  --grass-3: color(display-p3 0.923 0.965 0.917);
+  --grass-4: color(display-p3 0.872 0.94 0.865);
+  --grass-5: color(display-p3 0.811 0.908 0.802);
+  --grass-6: color(display-p3 0.733 0.864 0.724);
+  --grass-7: color(display-p3 0.628 0.803 0.622);
+  --grass-8: color(display-p3 0.477 0.72 0.482);
+  --grass-9: color(display-p3 0.38 0.647 0.378);
+  --grass-10: color(display-p3 0.344 0.598 0.342);
+  --grass-11: color(display-p3 0.263 0.488 0.261);
+  --grass-12: color(display-p3 0.151 0.233 0.153);
+
+  --grass-a1: color(display-p3 0.024 0.757 0.024 / 0.016);
+  --grass-a2: color(display-p3 0.024 0.565 0.024 / 0.036);
+  --grass-a3: color(display-p3 0.059 0.576 0.008 / 0.083);
+  --grass-a4: color(display-p3 0.035 0.565 0.008 / 0.134);
+  --grass-a5: color(display-p3 0.047 0.545 0.008 / 0.197);
+  --grass-a6: color(display-p3 0.031 0.502 0.004 / 0.275);
+  --grass-a7: color(display-p3 0.012 0.482 0.004 / 0.377);
+  --grass-a8: color(display-p3 0 0.467 0.008 / 0.522);
+  --grass-a9: color(display-p3 0.008 0.435 0 / 0.624);
+  --grass-a10: color(display-p3 0.008 0.388 0 / 0.659);
+  --grass-a11: color(display-p3 0.263 0.488 0.261);
+  --grass-a12: color(display-p3 0.151 0.233 0.153);
+
+  --grass-contrast: white;
+  --grass-surface: color(display-p3 0.9569 0.9804 0.9569 / 0.8);
+  --grass-indicator: var(--grass-9);
+  --grass-track: var(--grass-9);
+}
+
+.dark {
+  --grass-1: color(display-p3 0.062 0.083 0.067);
+  --grass-2: color(display-p3 0.083 0.103 0.085);
+  --grass-3: color(display-p3 0.118 0.163 0.122);
+  --grass-4: color(display-p3 0.142 0.225 0.15);
+  --grass-5: color(display-p3 0.178 0.279 0.186);
+  --grass-6: color(display-p3 0.217 0.337 0.224);
+  --grass-7: color(display-p3 0.258 0.4 0.264);
+  --grass-8: color(display-p3 0.302 0.47 0.305);
+  --grass-9: color(display-p3 0.38 0.647 0.378);
+  --grass-10: color(display-p3 0.426 0.694 0.426);
+  --grass-11: color(display-p3 0.535 0.807 0.542);
+  --grass-12: color(display-p3 0.797 0.936 0.776);
+
+  --grass-a1: color(display-p3 0 0.992 0.071 / 0.017);
+  --grass-a2: color(display-p3 0.482 0.996 0.584 / 0.038);
+  --grass-a3: color(display-p3 0.549 0.992 0.588 / 0.106);
+  --grass-a4: color(display-p3 0.51 0.996 0.557 / 0.169);
+  --grass-a5: color(display-p3 0.553 1 0.588 / 0.227);
+  --grass-a6: color(display-p3 0.584 1 0.608 / 0.29);
+  --grass-a7: color(display-p3 0.604 1 0.616 / 0.358);
+  --grass-a8: color(display-p3 0.608 1 0.62 / 0.433);
+  --grass-a9: color(display-p3 0.573 1 0.569 / 0.622);
+  --grass-a10: color(display-p3 0.6 0.996 0.6 / 0.673);
+  --grass-a11: color(display-p3 0.535 0.807 0.542);
+  --grass-a12: color(display-p3 0.797 0.936 0.776);
+
+  --grass-surface: color(display-p3 0.102 0.1333 0.102 / 0.5);
+}

package/dist/grass-tokens.css

@@ -0,0 +1,32 @@
+[data-accent-color='grass'] {
+  --accent-1: var(--grass-1);
+  --accent-2: var(--grass-2);
+  --accent-3: var(--grass-3);
+  --accent-4: var(--grass-4);
+  --accent-5: var(--grass-5);
+  --accent-6: var(--grass-6);
+  --accent-7: var(--grass-7);
+  --accent-8: var(--grass-8);
+  --accent-9: var(--grass-9);
+  --accent-10: var(--grass-10);
+  --accent-11: var(--grass-11);
+  --accent-12: var(--grass-12);
+
+  --accent-a1: var(--grass-a1);
+  --accent-a2: var(--grass-a2);
+  --accent-a3: var(--grass-a3);
+  --accent-a4: var(--grass-a4);
+  --accent-a5: var(--grass-a5);
+  --accent-a6: var(--grass-a6);
+  --accent-a7: var(--grass-a7);
+  --accent-a8: var(--grass-a8);
+  --accent-a9: var(--grass-a9);
+  --accent-a10: var(--grass-a10);
+  --accent-a11: var(--grass-a11);
+  --accent-a12: var(--grass-a12);
+
+  --accent-contrast: var(--grass-contrast);
+  --accent-surface: var(--grass-surface);
+  --accent-indicator: var(--grass-indicator);
+  --accent-track: var(--grass-track);
+}

package/dist/gray-p3.css

@@ -0,0 +1,95 @@
+@theme static {
+  --color-gray-1: var(--gray-1);
+  --color-gray-2: var(--gray-2);
+  --color-gray-3: var(--gray-3);
+  --color-gray-4: var(--gray-4);
+  --color-gray-5: var(--gray-5);
+  --color-gray-6: var(--gray-6);
+  --color-gray-7: var(--gray-7);
+  --color-gray-8: var(--gray-8);
+  --color-gray-9: var(--gray-9);
+  --color-gray-10: var(--gray-10);
+  --color-gray-11: var(--gray-11);
+  --color-gray-12: var(--gray-12);
+
+  --color-gray-a1: var(--gray-a1);
+  --color-gray-a2: var(--gray-a2);
+  --color-gray-a3: var(--gray-a3);
+  --color-gray-a4: var(--gray-a4);
+  --color-gray-a5: var(--gray-a5);
+  --color-gray-a6: var(--gray-a6);
+  --color-gray-a7: var(--gray-a7);
+  --color-gray-a8: var(--gray-a8);
+  --color-gray-a9: var(--gray-a9);
+  --color-gray-a10: var(--gray-a10);
+  --color-gray-a11: var(--gray-a11);
+  --color-gray-a12: var(--gray-a12);
+
+  --color-gray-contrast: var(--gray-contrast);
+  --color-gray-surface: var(--gray-surface);
+  --color-gray-indicator: var(--gray-indicator);
+  --color-gray-track: var(--gray-track);
+}
+
+:root {
+  --gray-1: color(display-p3 0.988 0.988 0.988);
+  --gray-2: color(display-p3 0.975 0.975 0.975);
+  --gray-3: color(display-p3 0.939 0.939 0.939);
+  --gray-4: color(display-p3 0.908 0.908 0.908);
+  --gray-5: color(display-p3 0.88 0.88 0.88);
+  --gray-6: color(display-p3 0.849 0.849 0.849);
+  --gray-7: color(display-p3 0.807 0.807 0.807);
+  --gray-8: color(display-p3 0.732 0.732 0.732);
+  --gray-9: color(display-p3 0.553 0.553 0.553);
+  --gray-10: color(display-p3 0.512 0.512 0.512);
+  --gray-11: color(display-p3 0.392 0.392 0.392);
+  --gray-12: color(display-p3 0.125 0.125 0.125);
+
+  --gray-a1: color(display-p3 0 0 0 / 0.012);
+  --gray-a2: color(display-p3 0 0 0 / 0.024);
+  --gray-a3: color(display-p3 0 0 0 / 0.063);
+  --gray-a4: color(display-p3 0 0 0 / 0.09);
+  --gray-a5: color(display-p3 0 0 0 / 0.122);
+  --gray-a6: color(display-p3 0 0 0 / 0.153);
+  --gray-a7: color(display-p3 0 0 0 / 0.192);
+  --gray-a8: color(display-p3 0 0 0 / 0.267);
+  --gray-a9: color(display-p3 0 0 0 / 0.447);
+  --gray-a10: color(display-p3 0 0 0 / 0.486);
+  --gray-a11: color(display-p3 0 0 0 / 0.608);
+  --gray-a12: color(display-p3 0 0 0 / 0.875);
+
+  --gray-contrast: white;
+  --gray-surface: color(display-p3 1 1 1 / 0.8);
+  --gray-indicator: var(--gray-9);
+  --gray-track: var(--gray-9);
+}
+
+.dark {
+  --gray-1: color(display-p3 0.067 0.067 0.067);
+  --gray-2: color(display-p3 0.098 0.098 0.098);
+  --gray-3: color(display-p3 0.135 0.135 0.135);
+  --gray-4: color(display-p3 0.163 0.163 0.163);
+  --gray-5: color(display-p3 0.192 0.192 0.192);
+  --gray-6: color(display-p3 0.228 0.228 0.228);
+  --gray-7: color(display-p3 0.283 0.283 0.283);
+  --gray-8: color(display-p3 0.375 0.375 0.375);
+  --gray-9: color(display-p3 0.431 0.431 0.431);
+  --gray-10: color(display-p3 0.484 0.484 0.484);
+  --gray-11: color(display-p3 0.706 0.706 0.706);
+  --gray-12: color(display-p3 0.933 0.933 0.933);
+
+  --gray-a1: color(display-p3 0 0 0 / 0);
+  --gray-a2: color(display-p3 1 1 1 / 0.034);
+  --gray-a3: color(display-p3 1 1 1 / 0.071);
+  --gray-a4: color(display-p3 1 1 1 / 0.105);
+  --gray-a5: color(display-p3 1 1 1 / 0.134);
+  --gray-a6: color(display-p3 1 1 1 / 0.172);
+  --gray-a7: color(display-p3 1 1 1 / 0.231);
+  --gray-a8: color(display-p3 1 1 1 / 0.332);
+  --gray-a9: color(display-p3 1 1 1 / 0.391);
+  --gray-a10: color(display-p3 1 1 1 / 0.445);
+  --gray-a11: color(display-p3 1 1 1 / 0.685);
+  --gray-a12: color(display-p3 1 1 1 / 0.929);
+
+  --gray-surface: color(display-p3 0.1255 0.1255 0.1255 / 0.5);
+}

package/dist/gray-tokens.css

@@ -0,0 +1,32 @@
+[data-accent-color='gray'] {
+  --accent-1: var(--gray-1);
+  --accent-2: var(--gray-2);
+  --accent-3: var(--gray-3);
+  --accent-4: var(--gray-4);
+  --accent-5: var(--gray-5);
+  --accent-6: var(--gray-6);
+  --accent-7: var(--gray-7);
+  --accent-8: var(--gray-8);
+  --accent-9: var(--gray-9);
+  --accent-10: var(--gray-10);
+  --accent-11: var(--gray-11);
+  --accent-12: var(--gray-12);
+
+  --accent-a1: var(--gray-a1);
+  --accent-a2: var(--gray-a2);
+  --accent-a3: var(--gray-a3);
+  --accent-a4: var(--gray-a4);
+  --accent-a5: var(--gray-a5);
+  --accent-a6: var(--gray-a6);
+  --accent-a7: var(--gray-a7);
+  --accent-a8: var(--gray-a8);
+  --accent-a9: var(--gray-a9);
+  --accent-a10: var(--gray-a10);
+  --accent-a11: var(--gray-a11);
+  --accent-a12: var(--gray-a12);
+
+  --accent-contrast: var(--gray-contrast);
+  --accent-surface: var(--gray-surface);
+  --accent-indicator: var(--gray-indicator);
+  --accent-track: var(--gray-track);
+}

package/dist/green-p3.css

@@ -0,0 +1,95 @@
+@theme static {
+  --color-green-1: var(--green-1);
+  --color-green-2: var(--green-2);
+  --color-green-3: var(--green-3);
+  --color-green-4: var(--green-4);
+  --color-green-5: var(--green-5);
+  --color-green-6: var(--green-6);
+  --color-green-7: var(--green-7);
+  --color-green-8: var(--green-8);
+  --color-green-9: var(--green-9);
+  --color-green-10: var(--green-10);
+  --color-green-11: var(--green-11);
+  --color-green-12: var(--green-12);
+
+  --color-green-a1: var(--green-a1);
+  --color-green-a2: var(--green-a2);
+  --color-green-a3: var(--green-a3);
+  --color-green-a4: var(--green-a4);
+  --color-green-a5: var(--green-a5);
+  --color-green-a6: var(--green-a6);
+  --color-green-a7: var(--green-a7);
+  --color-green-a8: var(--green-a8);
+  --color-green-a9: var(--green-a9);
+  --color-green-a10: var(--green-a10);
+  --color-green-a11: var(--green-a11);
+  --color-green-a12: var(--green-a12);
+
+  --color-green-contrast: var(--green-contrast);
+  --color-green-surface: var(--green-surface);
+  --color-green-indicator: var(--green-indicator);
+  --color-green-track: var(--green-track);
+}
+
+:root {
+  --green-1: color(display-p3 0.986 0.996 0.989);
+  --green-2: color(display-p3 0.963 0.983 0.967);
+  --green-3: color(display-p3 0.913 0.964 0.925);
+  --green-4: color(display-p3 0.859 0.94 0.879);
+  --green-5: color(display-p3 0.796 0.907 0.826);
+  --green-6: color(display-p3 0.718 0.863 0.761);
+  --green-7: color(display-p3 0.61 0.801 0.675);
+  --green-8: color(display-p3 0.451 0.715 0.559);
+  --green-9: color(display-p3 0.332 0.634 0.442);
+  --green-10: color(display-p3 0.308 0.595 0.417);
+  --green-11: color(display-p3 0.19 0.5 0.32);
+  --green-12: color(display-p3 0.132 0.228 0.18);
+
+  --green-a1: color(display-p3 0.024 0.757 0.267 / 0.016);
+  --green-a2: color(display-p3 0.024 0.565 0.129 / 0.036);
+  --green-a3: color(display-p3 0.012 0.596 0.145 / 0.087);
+  --green-a4: color(display-p3 0.008 0.588 0.145 / 0.142);
+  --green-a5: color(display-p3 0.004 0.541 0.157 / 0.204);
+  --green-a6: color(display-p3 0.004 0.518 0.157 / 0.283);
+  --green-a7: color(display-p3 0.004 0.486 0.165 / 0.389);
+  --green-a8: color(display-p3 0 0.478 0.2 / 0.55);
+  --green-a9: color(display-p3 0 0.455 0.165 / 0.667);
+  --green-a10: color(display-p3 0 0.416 0.153 / 0.691);
+  --green-a11: color(display-p3 0.19 0.5 0.32);
+  --green-a12: color(display-p3 0.132 0.228 0.18);
+
+  --green-contrast: white;
+  --green-surface: color(display-p3 0.9569 0.9804 0.9608 / 0.8);
+  --green-indicator: var(--green-9);
+  --green-track: var(--green-9);
+}
+
+.dark {
+  --green-1: color(display-p3 0.062 0.083 0.071);
+  --green-2: color(display-p3 0.079 0.106 0.09);
+  --green-3: color(display-p3 0.1 0.173 0.133);
+  --green-4: color(display-p3 0.115 0.229 0.166);
+  --green-5: color(display-p3 0.147 0.282 0.206);
+  --green-6: color(display-p3 0.185 0.338 0.25);
+  --green-7: color(display-p3 0.227 0.403 0.298);
+  --green-8: color(display-p3 0.27 0.479 0.351);
+  --green-9: color(display-p3 0.332 0.634 0.442);
+  --green-10: color(display-p3 0.357 0.682 0.474);
+  --green-11: color(display-p3 0.434 0.828 0.573);
+  --green-12: color(display-p3 0.747 0.938 0.807);
+
+  --green-a1: color(display-p3 0 0.992 0.298 / 0.017);
+  --green-a2: color(display-p3 0.341 0.98 0.616 / 0.043);
+  --green-a3: color(display-p3 0.376 0.996 0.655 / 0.114);
+  --green-a4: color(display-p3 0.341 0.996 0.635 / 0.173);
+  --green-a5: color(display-p3 0.408 1 0.678 / 0.232);
+  --green-a6: color(display-p3 0.475 1 0.706 / 0.29);
+  --green-a7: color(display-p3 0.514 1 0.706 / 0.362);
+  --green-a8: color(display-p3 0.529 1 0.718 / 0.442);
+  --green-a9: color(display-p3 0.502 0.996 0.682 / 0.61);
+  --green-a10: color(display-p3 0.506 1 0.682 / 0.66);
+  --green-a11: color(display-p3 0.434 0.828 0.573);
+  --green-a12: color(display-p3 0.747 0.938 0.807);
+
+  --green-surface: color(display-p3 0.0941 0.1412 0.1098 / 0.5);
+}

package/dist/green-tokens.css

@@ -0,0 +1,32 @@
+[data-accent-color='green'] {
+  --accent-1: var(--green-1);
+  --accent-2: var(--green-2);
+  --accent-3: var(--green-3);
+  --accent-4: var(--green-4);
+  --accent-5: var(--green-5);
+  --accent-6: var(--green-6);
+  --accent-7: var(--green-7);
+  --accent-8: var(--green-8);
+  --accent-9: var(--green-9);
+  --accent-10: var(--green-10);
+  --accent-11: var(--green-11);
+  --accent-12: var(--green-12);
+
+  --accent-a1: var(--green-a1);
+  --accent-a2: var(--green-a2);
+  --accent-a3: var(--green-a3);
+  --accent-a4: var(--green-a4);
+  --accent-a5: var(--green-a5);
+  --accent-a6: var(--green-a6);
+  --accent-a7: var(--green-a7);
+  --accent-a8: var(--green-a8);
+  --accent-a9: var(--green-a9);
+  --accent-a10: var(--green-a10);
+  --accent-a11: var(--green-a11);
+  --accent-a12: var(--green-a12);
+
+  --accent-contrast: var(--green-contrast);
+  --accent-surface: var(--green-surface);
+  --accent-indicator: var(--green-indicator);
+  --accent-track: var(--green-track);
+}