@sumup/design-tokens - npm Package Compare versions

Comparing version 7.2.0-next.2 to 7.2.0-next.3

dist/cjs/themes/dark.d.ts

@@ -16,541 +16,541 @@ /**
 export declare const dark: ({
-    name: "--cui-border-accent";
-    value: "#ffffff";
+    name: "--cui-bg-normal";
+    value: "#171d24";
     type: "color";
 } | {
-    name: "--cui-border-danger";
-    value: "#de331d";
+    name: "--cui-bg-normal-hovered";
+    value: "#212831";
     type: "color";
 } | {
-    name: "--cui-border-divider";
-    value: "#454954";
+    name: "--cui-bg-normal-pressed";
+    value: "#28313c";
     type: "color";
 } | {
-    name: "--cui-border-focus";
-    value: "#ffffff";
+    name: "--cui-bg-normal-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-border-normal";
-    value: "#454954";
+    name: "--cui-bg-subtle";
+    value: "#0c0f12";
     type: "color";
 } | {
-    name: "--cui-border-promo";
-    value: "#ae49de";
+    name: "--cui-bg-subtle-hovered";
+    value: "#080b0d";
     type: "color";
 } | {
-    name: "--cui-border-strong";
-    value: "#4e5155";
+    name: "--cui-bg-subtle-pressed";
+    value: "#040607";
     type: "color";
 } | {
-    name: "--cui-border-subtle";
-    value: "#2c3038";
+    name: "--cui-bg-subtle-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-border-success";
-    value: "#39c57a";
+    name: "--cui-bg-highlight";
+    value: "#363c41";
     type: "color";
 } | {
-    name: "--cui-border-warning";
-    value: "#e87c00";
+    name: "--cui-bg-highlight-hovered";
+    value: "#3d4249";
     type: "color";
 } | {
-    name: "--cui-bg-accent";
-    value: "#181d22";
+    name: "--cui-bg-highlight-pressed";
+    value: "#424950";
     type: "color";
 } | {
-    name: "--cui-bg-accent-disabled";
-    value: "rgba(238, 240, 242, 0.4000)";
+    name: "--cui-bg-highlight-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-accent-hovered";
-    value: "#e3e7eb";
+    name: "--cui-bg-strong";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-bg-accent-pressed";
-    value: "#e3e7eb";
+    name: "--cui-bg-strong-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-bg-accent-strong";
-    value: "#ffffff";
+    name: "--cui-bg-strong-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-bg-accent-strong-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-bg-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-accent-strong-hovered";
-    value: "#000000";
+    name: "--cui-bg-accent";
+    value: "#0C0F12";
     type: "color";
 } | {
-    name: "--cui-bg-accent-strong-pressed";
-    value: "#000000";
+    name: "--cui-bg-accent-hovered";
+    value: "#080B0D";
     type: "color";
 } | {
-    name: "--cui-bg-danger";
-    value: "#5e181d";
+    name: "--cui-bg-accent-pressed";
+    value: "#040607";
     type: "color";
 } | {
-    name: "--cui-bg-danger-disabled";
-    value: "rgba(251, 233, 231, 0.4000)";
+    name: "--cui-bg-accent-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-danger-hovered";
-    value: "#fcddd9";
+    name: "--cui-bg-accent-strong";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-bg-danger-pressed";
-    value: "#f7ccc7";
+    name: "--cui-bg-accent-strong-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-bg-danger-strong";
-    value: "#de331d";
+    name: "--cui-bg-accent-strong-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-bg-danger-strong-disabled";
-    value: "rgba(222, 51, 29, 0.4000)";
+    name: "--cui-bg-accent-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-danger-strong-hovered";
-    value: "#bd2c19";
+    name: "--cui-bg-success";
+    value: "rgba(12, 211, 104, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-bg-danger-strong-pressed";
-    value: "#9e2415";
+    name: "--cui-bg-success-hovered";
+    value: "rgba(12, 211, 104, 0.2500)";
     type: "color";
 } | {
-    name: "--cui-bg-elevated";
-    value: "#2d343a";
+    name: "--cui-bg-success-pressed";
+    value: "rgba(12, 211, 104, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-bg-highlight";
-    value: "#383f46";
+    name: "--cui-bg-success-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-highlight-disabled";
-    value: "rgba(227, 231, 235, 0.4000)";
+    name: "--cui-bg-success-strong";
+    value: "#0cd368";
     type: "color";
 } | {
-    name: "--cui-bg-highlight-hovered";
-    value: "#c2c9d1";
+    name: "--cui-bg-success-strong-hovered";
+    value: "#13e072";
     type: "color";
 } | {
-    name: "--cui-bg-highlight-pressed";
-    value: "#9da7b1";
+    name: "--cui-bg-success-strong-pressed";
+    value: "#25e980";
     type: "color";
 } | {
-    name: "--cui-bg-normal";
-    value: "#0a0e12";
+    name: "--cui-bg-success-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-normal-disabled";
-    value: "rgba(255, 255, 255, 0.4000)";
+    name: "--cui-bg-warning";
+    value: "rgba(245, 158, 28, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-bg-normal-hovered";
-    value: "#e3e7eb";
+    name: "--cui-bg-warning-hovered";
+    value: "rgba(245, 158, 28, 0.2500)";
     type: "color";
 } | {
-    name: "--cui-bg-normal-pressed";
-    value: "#e3e7eb";
+    name: "--cui-bg-warning-pressed";
+    value: "rgba(245, 158, 28, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-bg-overlay";
-    value: "rgba(0, 0, 0, 0.4000)";
+    name: "--cui-bg-warning-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-promo";
-    value: "#f5edfe";
+    name: "--cui-bg-warning-strong";
+    value: "#f5b81c";
     type: "color";
 } | {
-    name: "--cui-bg-promo-disabled";
-    value: "rgba(245, 237, 254, 0.4000)";
+    name: "--cui-bg-warning-strong-hovered";
+    value: "#f7c440";
     type: "color";
 } | {
-    name: "--cui-bg-promo-hovered";
-    value: "#ede0fc";
+    name: "--cui-bg-warning-strong-pressed";
+    value: "#f7cb59";
     type: "color";
 } | {
-    name: "--cui-bg-promo-pressed";
-    value: "#e0c9f8";
+    name: "--cui-bg-warning-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-promo-strong";
-    value: "#ae49de";
+    name: "--cui-bg-danger";
+    value: "rgba(255, 76, 53, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-bg-promo-strong-disabled";
-    value: "rgba(158, 51, 224, 0.4000)";
+    name: "--cui-bg-danger-hovered";
+    value: "rgba(255, 76, 53, 0.2500)";
     type: "color";
 } | {
-    name: "--cui-bg-promo-strong-hovered";
-    value: "#8a1ecc";
+    name: "--cui-bg-danger-pressed";
+    value: "rgba(255, 76, 53, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-bg-promo-strong-pressed";
-    value: "#7219a9";
+    name: "--cui-bg-danger-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-strong";
-    value: "#2d343a";
+    name: "--cui-bg-danger-strong";
+    value: "#ff4e37";
     type: "color";
 } | {
-    name: "--cui-bg-strong-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-bg-danger-strong-hovered";
+    value: "#ff5c47";
     type: "color";
 } | {
-    name: "--cui-bg-strong-hovered";
-    value: "#000000";
+    name: "--cui-bg-danger-strong-pressed";
+    value: "#ff6a57";
     type: "color";
 } | {
-    name: "--cui-bg-strong-pressed";
-    value: "#000000";
+    name: "--cui-bg-danger-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-subtle";
-    value: "#181d22";
+    name: "--cui-bg-promo";
+    value: "rgba(195, 83, 247, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-bg-subtle-disabled";
-    value: "rgba(227, 231, 235, 0.4000)";
+    name: "--cui-bg-promo-hovered";
+    value: "rgba(195, 83, 247, 0.2500)";
     type: "color";
 } | {
-    name: "--cui-bg-subtle-hovered";
-    value: "#e3e7eb";
+    name: "--cui-bg-promo-pressed";
+    value: "rgba(195, 83, 247, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-bg-subtle-pressed";
-    value: "#c2c9d1";
+    name: "--cui-bg-promo-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-success";
-    value: "#044022";
+    name: "--cui-bg-promo-strong";
+    value: "#c353f7";
     type: "color";
 } | {
-    name: "--cui-bg-success-disabled";
-    value: "rgba(233, 251, 233, 0.4000)";
+    name: "--cui-bg-promo-strong-hovered";
+    value: "#c768f3";
     type: "color";
 } | {
-    name: "--cui-bg-success-hovered";
-    value: "#d7f8d7";
+    name: "--cui-bg-promo-strong-pressed";
+    value: "#ce72f8";
     type: "color";
 } | {
-    name: "--cui-bg-success-pressed";
-    value: "#c1e8c1";
+    name: "--cui-bg-promo-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-success-strong";
-    value: "#39c57a";
+    name: "--cui-fg-normal";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-bg-success-strong-disabled";
-    value: "rgba(1, 136, 80, 0.4000)";
+    name: "--cui-fg-normal-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-bg-success-strong-hovered";
-    value: "#007a4e";
+    name: "--cui-fg-normal-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-bg-success-strong-pressed";
-    value: "#016c26";
+    name: "--cui-fg-normal-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning";
-    value: "#593918";
+    name: "--cui-fg-subtle";
+    value: "rgba(223, 232, 241, 0.6000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-disabled";
-    value: "rgba(253, 244, 219, 0.4000)";
+    name: "--cui-fg-subtle-hovered";
+    value: "rgba(223, 232, 241, 0.7000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-hovered";
-    value: "#faeec6";
+    name: "--cui-fg-subtle-pressed";
+    value: "rgba(223, 232, 241, 0.8000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-pressed";
-    value: "#f5dea3";
+    name: "--cui-fg-subtle-disabled";
+    value: "rgba(216, 232, 248, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-strong";
-    value: "#f9d20a";
+    name: "--cui-fg-placeholder";
+    value: "rgba(223, 232, 241, 0.4000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-strong-disabled";
-    value: "rgba(232, 124, 0, 0.4000)";
+    name: "--cui-fg-placeholder-hovered";
+    value: "rgba(223, 232, 241, 0.4000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-strong-hovered";
-    value: "#cc6d00";
+    name: "--cui-fg-placeholder-pressed";
+    value: "rgba(223, 232, 241, 0.4000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-strong-pressed";
-    value: "#b25c00";
+    name: "--cui-fg-placeholder-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-border-accent-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-fg-on-strong";
+    value: "#0f131a";
     type: "color";
 } | {
-    name: "--cui-border-accent-hovered";
-    value: "#000000";
+    name: "--cui-fg-on-strong-hovered";
+    value: "#0f131a";
     type: "color";
 } | {
-    name: "--cui-border-accent-pressed";
-    value: "#000000";
+    name: "--cui-fg-on-strong-pressed";
+    value: "#0f131a";
     type: "color";
 } | {
-    name: "--cui-border-danger-disabled";
-    value: "rgba(222, 51, 29, 0.4000)";
+    name: "--cui-fg-on-strong-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-border-danger-hovered";
-    value: "#bd2c19";
+    name: "--cui-fg-on-strong-subtle";
+    value: "rgba(15, 19, 26, 0.7000)";
     type: "color";
 } | {
-    name: "--cui-border-danger-pressed";
-    value: "#9e2415";
+    name: "--cui-fg-on-strong-subtle-hovered";
+    value: "rgba(15, 19, 26, 0.7000)";
     type: "color";
 } | {
-    name: "--cui-border-divider-disabled";
-    value: "rgba(194, 201, 209, 0.4000)";
+    name: "--cui-fg-on-strong-subtle-pressed";
+    value: "rgba(15, 19, 26, 0.7000)";
     type: "color";
 } | {
-    name: "--cui-border-divider-hovered";
-    value: "#9da7b1";
+    name: "--cui-fg-on-strong-subtle-disabled";
+    value: "rgba(216, 232, 248, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-border-divider-pressed";
-    value: "#6a737c";
+    name: "--cui-fg-accent";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-border-normal-disabled";
-    value: "rgba(194, 201, 209, 0.4000)";
+    name: "--cui-fg-accent-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-border-normal-hovered";
-    value: "#9da7b1";
+    name: "--cui-fg-accent-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-border-normal-pressed";
-    value: "#6a737c";
+    name: "--cui-fg-accent-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-border-promo-disabled";
-    value: "rgba(158, 51, 224, 0.4000)";
+    name: "--cui-fg-success";
+    value: "#17db72";
     type: "color";
 } | {
-    name: "--cui-border-promo-hovered";
-    value: "#8a1ecc";
+    name: "--cui-fg-success-hovered";
+    value: "#13e072";
     type: "color";
 } | {
-    name: "--cui-border-promo-pressed";
-    value: "#7219a9";
+    name: "--cui-fg-success-pressed";
+    value: "#25e980";
     type: "color";
 } | {
-    name: "--cui-border-strong-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-fg-success-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-border-strong-hovered";
-    value: "#000000";
+    name: "--cui-fg-warning";
+    value: "#f5b81c";
     type: "color";
 } | {
-    name: "--cui-border-strong-pressed";
-    value: "#000000";
+    name: "--cui-fg-warning-hovered";
+    value: "#f7c440";
     type: "color";
 } | {
-    name: "--cui-border-subtle-disabled";
-    value: "rgba(230, 230, 230, 0.4000)";
+    name: "--cui-fg-warning-pressed";
+    value: "#f7cb59";
     type: "color";
 } | {
-    name: "--cui-border-subtle-hovered";
-    value: "#c2c9d1";
+    name: "--cui-fg-warning-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-border-subtle-pressed";
-    value: "#9da7b1";
+    name: "--cui-fg-danger";
+    value: "#ff634e";
     type: "color";
 } | {
-    name: "--cui-border-success-disabled";
-    value: "rgba(1, 136, 80, 0.4000)";
+    name: "--cui-fg-danger-hovered";
+    value: "#ff5c47";
     type: "color";
 } | {
-    name: "--cui-border-success-hovered";
-    value: "#007a4e";
+    name: "--cui-fg-danger-pressed";
+    value: "#ff6a57";
     type: "color";
 } | {
-    name: "--cui-border-success-pressed";
-    value: "#016c26";
+    name: "--cui-fg-danger-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-border-warning-disabled";
-    value: "rgba(226, 121, 0, 0.4000)";
+    name: "--cui-fg-promo";
+    value: "#cf7bf6";
     type: "color";
 } | {
-    name: "--cui-border-warning-hovered";
-    value: "#cc6d00";
+    name: "--cui-fg-promo-hovered";
+    value: "#c768f3";
     type: "color";
 } | {
-    name: "--cui-border-warning-pressed";
-    value: "#b25c00";
+    name: "--cui-fg-promo-pressed";
+    value: "#ce72f8";
     type: "color";
 } | {
-    name: "--cui-fg-accent";
-    value: "#ffffff";
+    name: "--cui-fg-promo-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-fg-accent-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-border-normal";
+    value: "rgba(223, 232, 241, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-fg-accent-hovered";
-    value: "#000000";
+    name: "--cui-border-normal-hovered";
+    value: "rgba(223, 232, 241, 0.3500)";
     type: "color";
 } | {
-    name: "--cui-fg-accent-pressed";
-    value: "#000000";
+    name: "--cui-border-normal-pressed";
+    value: "rgba(223, 232, 241, 0.4500)";
     type: "color";
 } | {
-    name: "--cui-fg-danger";
-    value: "#de331d";
+    name: "--cui-border-normal-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-danger-disabled";
-    value: "rgba(222, 51, 29, 0.4000)";
+    name: "--cui-border-subtle";
+    value: "rgba(223, 232, 241, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-danger-hovered";
-    value: "#bd2c19";
+    name: "--cui-border-subtle-hovered";
+    value: "rgba(223, 232, 241, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-fg-danger-pressed";
-    value: "#9e2415";
+    name: "--cui-border-subtle-pressed";
+    value: "rgba(223, 232, 241, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-fg-normal";
-    value: "#ffffff";
+    name: "--cui-border-subtle-disabled";
+    value: "rgba(216, 232, 248, 0.1000)";
     type: "color";
 } | {
-    name: "--cui-fg-normal-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-border-divider";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-fg-normal-hovered";
-    value: "#0f131a";
+    name: "--cui-border-divider-hovered";
+    value: "rgba(223, 232, 241, 0.3500)";
     type: "color";
 } | {
-    name: "--cui-fg-normal-pressed";
-    value: "#0f131a";
+    name: "--cui-border-divider-pressed";
+    value: "rgba(223, 232, 241, 0.4500)";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong";
-    value: "#0f131a";
+    name: "--cui-border-divider-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-disabled";
-    value: "rgba(255, 255, 255, 0.4000)";
+    name: "--cui-border-strong";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-hovered";
-    value: "#ffffff";
+    name: "--cui-border-strong-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-pressed";
-    value: "#ffffff";
+    name: "--cui-border-strong-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-subtle";
-    value: "rgba(15, 19, 26, 0.7000)";
+    name: "--cui-border-strong-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-subtle-disabled";
-    value: "rgba(255, 255, 255, 0.3000)";
+    name: "--cui-border-accent";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-subtle-hovered";
-    value: "rgba(255, 255, 255, 0.8000)";
+    name: "--cui-border-accent-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-subtle-pressed";
-    value: "rgba(255, 255, 255, 0.9000)";
+    name: "--cui-border-accent-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-fg-placeholder";
-    value: "#6e747a";
+    name: "--cui-border-accent-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-placeholder-disabled";
-    value: "rgba(157, 167, 177, 0.4000)";
+    name: "--cui-border-success";
+    value: "#0cd368";
     type: "color";
 } | {
-    name: "--cui-fg-placeholder-hovered";
-    value: "#9da7b1";
+    name: "--cui-border-success-hovered";
+    value: "#13e072";
     type: "color";
 } | {
-    name: "--cui-fg-placeholder-pressed";
-    value: "#9da7b1";
+    name: "--cui-border-success-pressed";
+    value: "#25e980";
     type: "color";
 } | {
-    name: "--cui-fg-promo";
-    value: "#ae49de";
+    name: "--cui-border-success-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-promo-disabled";
-    value: "rgba(158, 51, 224, 0.4000)";
+    name: "--cui-border-warning";
+    value: "#f5b81c";
     type: "color";
 } | {
-    name: "--cui-fg-promo-hovered";
-    value: "#8a1ecc";
+    name: "--cui-border-warning-hovered";
+    value: "#f7c440";
     type: "color";
 } | {
-    name: "--cui-fg-promo-pressed";
-    value: "#7219a9";
+    name: "--cui-border-warning-pressed";
+    value: "#f7cb59";
     type: "color";
 } | {
-    name: "--cui-fg-subtle";
-    value: "#8f969d";
+    name: "--cui-border-warning-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-subtle-disabled";
-    value: "rgba(106, 115, 124, 0.4000)";
+    name: "--cui-border-danger";
+    value: "#ff4e37";
     type: "color";
 } | {
-    name: "--cui-fg-subtle-hovered";
-    value: "#33373e";
+    name: "--cui-border-danger-hovered";
+    value: "#ff5c47";
     type: "color";
 } | {
-    name: "--cui-fg-subtle-pressed";
-    value: "#0f131a";
+    name: "--cui-border-danger-pressed";
+    value: "#ff6a57";
     type: "color";
 } | {
-    name: "--cui-fg-success";
-    value: "#39c57a";
+    name: "--cui-border-danger-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-success-disabled";
-    value: "rgba(1, 136, 80, 0.4000)";
+    name: "--cui-border-promo";
+    value: "#c353f7";
     type: "color";
 } | {
-    name: "--cui-fg-success-hovered";
-    value: "#007a4e";
+    name: "--cui-border-promo-hovered";
+    value: "#c768f3";
     type: "color";
 } | {
-    name: "--cui-fg-success-pressed";
-    value: "#016c26";
+    name: "--cui-border-promo-pressed";
+    value: "#ce72f8";
     type: "color";
 } | {
-    name: "--cui-fg-warning";
-    value: "#f9d20a";
+    name: "--cui-border-promo-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-warning-disabled";
-    value: "rgba(226, 121, 0, 0.4000)";
+    name: "--cui-bg-overlay";
+    value: "rgba(0, 0, 0, 0.7000)";
     type: "color";
 } | {
-    name: "--cui-fg-warning-hovered";
-    value: "#cc6d00";
+    name: "--cui-bg-elevated";
+    value: "#2f3438";
     type: "color";
 } | {
-    name: "--cui-fg-warning-pressed";
-    value: "#b25c00";
+    name: "--cui-border-focus";
+    value: "#ffffff";
     type: "color";
 })[];

dist/cjs/themes/dark.js

@@ -19,677 +19,696 @@ "use strict";
 exports.dark = [
+    /* Neutral backgrounds */
     {
-        name: '--cui-border-accent',
-        value: '#ffffff',
+        name: '--cui-bg-normal',
+        value: '#171d24',
         type: 'color',
     },
     {
-        name: '--cui-border-danger',
-        value: '#de331d',
+        name: '--cui-bg-normal-hovered',
+        value: '#212831',
         type: 'color',
     },
     {
-        name: '--cui-border-divider',
-        value: '#454954',
+        name: '--cui-bg-normal-pressed',
+        value: '#28313c',
         type: 'color',
     },
     {
-        name: '--cui-border-focus',
-        value: '#ffffff',
+        name: '--cui-bg-normal-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-border-normal',
-        value: '#454954',
+        name: '--cui-bg-subtle',
+        value: '#0c0f12',
         type: 'color',
     },
     {
-        name: '--cui-border-promo',
-        value: '#ae49de',
+        name: '--cui-bg-subtle-hovered',
+        value: '#080b0d',
         type: 'color',
     },
     {
-        name: '--cui-border-strong',
-        value: '#4e5155',
+        name: '--cui-bg-subtle-pressed',
+        value: '#040607',
         type: 'color',
     },
     {
-        name: '--cui-border-subtle',
-        value: '#2c3038',
+        name: '--cui-bg-subtle-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-border-success',
-        value: '#39c57a',
+        name: '--cui-bg-highlight',
+        value: '#363c41',
         type: 'color',
     },
     {
-        name: '--cui-border-warning',
-        value: '#e87c00',
+        name: '--cui-bg-highlight-hovered',
+        value: '#3d4249',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent',
-        value: '#181d22',
+        name: '--cui-bg-highlight-pressed',
+        value: '#424950',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-disabled',
-        value: 'rgba(238, 240, 242, 0.4000)',
+        name: '--cui-bg-highlight-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-hovered',
-        value: '#e3e7eb',
+        name: '--cui-bg-strong',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-pressed',
-        value: '#e3e7eb',
+        name: '--cui-bg-strong-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-strong',
-        value: '#ffffff',
+        name: '--cui-bg-strong-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-strong-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-bg-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Accent backgrounds */
     {
-        name: '--cui-bg-accent-strong-hovered',
-        value: '#000000',
+        name: '--cui-bg-accent',
+        value: '#0C0F12',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-strong-pressed',
-        value: '#000000',
+        name: '--cui-bg-accent-hovered',
+        value: '#080B0D',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger',
-        value: '#5e181d',
+        name: '--cui-bg-accent-pressed',
+        value: '#040607',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-disabled',
-        value: 'rgba(251, 233, 231, 0.4000)',
+        name: '--cui-bg-accent-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-hovered',
-        value: '#fcddd9',
+        name: '--cui-bg-accent-strong',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-pressed',
-        value: '#f7ccc7',
+        name: '--cui-bg-accent-strong-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-strong',
-        value: '#de331d',
+        name: '--cui-bg-accent-strong-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-strong-disabled',
-        value: 'rgba(222, 51, 29, 0.4000)',
+        name: '--cui-bg-accent-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Success backgrounds */
     {
-        name: '--cui-bg-danger-strong-hovered',
-        value: '#bd2c19',
+        name: '--cui-bg-success',
+        value: 'rgba(12, 211, 104, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-strong-pressed',
-        value: '#9e2415',
+        name: '--cui-bg-success-hovered',
+        value: 'rgba(12, 211, 104, 0.2500)',
         type: 'color',
     },
     {
-        name: '--cui-bg-elevated',
-        value: '#2d343a',
+        name: '--cui-bg-success-pressed',
+        value: 'rgba(12, 211, 104, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-highlight',
-        value: '#383f46',
+        name: '--cui-bg-success-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-highlight-disabled',
-        value: 'rgba(227, 231, 235, 0.4000)',
+        name: '--cui-bg-success-strong',
+        value: '#0cd368',
         type: 'color',
     },
     {
-        name: '--cui-bg-highlight-hovered',
-        value: '#c2c9d1',
+        name: '--cui-bg-success-strong-hovered',
+        value: '#13e072',
         type: 'color',
     },
     {
-        name: '--cui-bg-highlight-pressed',
-        value: '#9da7b1',
+        name: '--cui-bg-success-strong-pressed',
+        value: '#25e980',
         type: 'color',
     },
     {
-        name: '--cui-bg-normal',
-        value: '#0a0e12',
+        name: '--cui-bg-success-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Warning backgrounds */
     {
-        name: '--cui-bg-normal-disabled',
-        value: 'rgba(255, 255, 255, 0.4000)',
+        name: '--cui-bg-warning',
+        value: 'rgba(245, 158, 28, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-normal-hovered',
-        value: '#e3e7eb',
+        name: '--cui-bg-warning-hovered',
+        value: 'rgba(245, 158, 28, 0.2500)',
         type: 'color',
     },
     {
-        name: '--cui-bg-normal-pressed',
-        value: '#e3e7eb',
+        name: '--cui-bg-warning-pressed',
+        value: 'rgba(245, 158, 28, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-overlay',
-        value: 'rgba(0, 0, 0, 0.4000)',
+        name: '--cui-bg-warning-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo',
-        value: '#f5edfe',
+        name: '--cui-bg-warning-strong',
+        value: '#f5b81c',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-disabled',
-        value: 'rgba(245, 237, 254, 0.4000)',
+        name: '--cui-bg-warning-strong-hovered',
+        value: '#f7c440',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-hovered',
-        value: '#ede0fc',
+        name: '--cui-bg-warning-strong-pressed',
+        value: '#f7cb59',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-pressed',
-        value: '#e0c9f8',
+        name: '--cui-bg-warning-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Danger backgrounds */
     {
-        name: '--cui-bg-promo-strong',
-        value: '#ae49de',
+        name: '--cui-bg-danger',
+        value: 'rgba(255, 76, 53, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-strong-disabled',
-        value: 'rgba(158, 51, 224, 0.4000)',
+        name: '--cui-bg-danger-hovered',
+        value: 'rgba(255, 76, 53, 0.2500)',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-strong-hovered',
-        value: '#8a1ecc',
+        name: '--cui-bg-danger-pressed',
+        value: 'rgba(255, 76, 53, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-strong-pressed',
-        value: '#7219a9',
+        name: '--cui-bg-danger-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-strong',
-        value: '#2d343a',
+        name: '--cui-bg-danger-strong',
+        value: '#ff4e37',
         type: 'color',
     },
     {
-        name: '--cui-bg-strong-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-bg-danger-strong-hovered',
+        value: '#ff5c47',
         type: 'color',
     },
     {
-        name: '--cui-bg-strong-hovered',
-        value: '#000000',
+        name: '--cui-bg-danger-strong-pressed',
+        value: '#ff6a57',
         type: 'color',
     },
     {
-        name: '--cui-bg-strong-pressed',
-        value: '#000000',
+        name: '--cui-bg-danger-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Promo backgrounds */
     {
-        name: '--cui-bg-subtle',
-        value: '#181d22',
+        name: '--cui-bg-promo',
+        value: 'rgba(195, 83, 247, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-subtle-disabled',
-        value: 'rgba(227, 231, 235, 0.4000)',
+        name: '--cui-bg-promo-hovered',
+        value: 'rgba(195, 83, 247, 0.2500)',
         type: 'color',
     },
     {
-        name: '--cui-bg-subtle-hovered',
-        value: '#e3e7eb',
+        name: '--cui-bg-promo-pressed',
+        value: 'rgba(195, 83, 247, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-subtle-pressed',
-        value: '#c2c9d1',
+        name: '--cui-bg-promo-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-success',
-        value: '#044022',
+        name: '--cui-bg-promo-strong',
+        value: '#c353f7',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-disabled',
-        value: 'rgba(233, 251, 233, 0.4000)',
+        name: '--cui-bg-promo-strong-hovered',
+        value: '#c768f3',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-hovered',
-        value: '#d7f8d7',
+        name: '--cui-bg-promo-strong-pressed',
+        value: '#ce72f8',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-pressed',
-        value: '#c1e8c1',
+        name: '--cui-bg-promo-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Neutral foregrounds */
     {
-        name: '--cui-bg-success-strong',
-        value: '#39c57a',
+        name: '--cui-fg-normal',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-strong-disabled',
-        value: 'rgba(1, 136, 80, 0.4000)',
+        name: '--cui-fg-normal-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-strong-hovered',
-        value: '#007a4e',
+        name: '--cui-fg-normal-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-strong-pressed',
-        value: '#016c26',
+        name: '--cui-fg-normal-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning',
-        value: '#593918',
+        name: '--cui-fg-subtle',
+        value: 'rgba(223, 232, 241, 0.6000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-disabled',
-        value: 'rgba(253, 244, 219, 0.4000)',
+        name: '--cui-fg-subtle-hovered',
+        value: 'rgba(223, 232, 241, 0.7000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-hovered',
-        value: '#faeec6',
+        name: '--cui-fg-subtle-pressed',
+        value: 'rgba(223, 232, 241, 0.8000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-pressed',
-        value: '#f5dea3',
+        name: '--cui-fg-subtle-disabled',
+        value: 'rgba(216, 232, 248, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-strong',
-        value: '#f9d20a',
+        name: '--cui-fg-placeholder',
+        value: 'rgba(223, 232, 241, 0.4000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-strong-disabled',
-        value: 'rgba(232, 124, 0, 0.4000)',
+        name: '--cui-fg-placeholder-hovered',
+        value: 'rgba(223, 232, 241, 0.4000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-strong-hovered',
-        value: '#cc6d00',
+        name: '--cui-fg-placeholder-pressed',
+        value: 'rgba(223, 232, 241, 0.4000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-strong-pressed',
-        value: '#b25c00',
+        name: '--cui-fg-placeholder-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
     {
-        name: '--cui-border-accent-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-fg-on-strong',
+        value: '#0f131a',
         type: 'color',
     },
     {
-        name: '--cui-border-accent-hovered',
-        value: '#000000',
+        name: '--cui-fg-on-strong-hovered',
+        value: '#0f131a',
         type: 'color',
     },
     {
-        name: '--cui-border-accent-pressed',
-        value: '#000000',
+        name: '--cui-fg-on-strong-pressed',
+        value: '#0f131a',
         type: 'color',
     },
     {
-        name: '--cui-border-danger-disabled',
-        value: 'rgba(222, 51, 29, 0.4000)',
+        name: '--cui-fg-on-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-border-danger-hovered',
-        value: '#bd2c19',
+        name: '--cui-fg-on-strong-subtle',
+        value: 'rgba(15, 19, 26, 0.7000)',
         type: 'color',
     },
     {
-        name: '--cui-border-danger-pressed',
-        value: '#9e2415',
+        name: '--cui-fg-on-strong-subtle-hovered',
+        value: 'rgba(15, 19, 26, 0.7000)',
         type: 'color',
     },
     {
-        name: '--cui-border-divider-disabled',
-        value: 'rgba(194, 201, 209, 0.4000)',
+        name: '--cui-fg-on-strong-subtle-pressed',
+        value: 'rgba(15, 19, 26, 0.7000)',
         type: 'color',
     },
     {
-        name: '--cui-border-divider-hovered',
-        value: '#9da7b1',
+        name: '--cui-fg-on-strong-subtle-disabled',
+        value: 'rgba(216, 232, 248, 0.2000)',
         type: 'color',
     },
+    /* Accent foregrounds */
     {
-        name: '--cui-border-divider-pressed',
-        value: '#6a737c',
+        name: '--cui-fg-accent',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-border-normal-disabled',
-        value: 'rgba(194, 201, 209, 0.4000)',
+        name: '--cui-fg-accent-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-border-normal-hovered',
-        value: '#9da7b1',
+        name: '--cui-fg-accent-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-border-normal-pressed',
-        value: '#6a737c',
+        name: '--cui-fg-accent-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
+    /* Success foregrounds */
     {
-        name: '--cui-border-promo-disabled',
-        value: 'rgba(158, 51, 224, 0.4000)',
+        name: '--cui-fg-success',
+        value: '#17db72',
         type: 'color',
     },
     {
-        name: '--cui-border-promo-hovered',
-        value: '#8a1ecc',
+        name: '--cui-fg-success-hovered',
+        value: '#13e072',
         type: 'color',
     },
     {
-        name: '--cui-border-promo-pressed',
-        value: '#7219a9',
+        name: '--cui-fg-success-pressed',
+        value: '#25e980',
         type: 'color',
     },
     {
-        name: '--cui-border-strong-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-fg-success-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
+    /* Warning foregrounds */
     {
-        name: '--cui-border-strong-hovered',
-        value: '#000000',
+        name: '--cui-fg-warning',
+        value: '#f5b81c',
         type: 'color',
     },
     {
-        name: '--cui-border-strong-pressed',
-        value: '#000000',
+        name: '--cui-fg-warning-hovered',
+        value: '#f7c440',
         type: 'color',
     },
     {
-        name: '--cui-border-subtle-disabled',
-        value: 'rgba(230, 230, 230, 0.4000)',
+        name: '--cui-fg-warning-pressed',
+        value: '#f7cb59',
         type: 'color',
     },
     {
-        name: '--cui-border-subtle-hovered',
-        value: '#c2c9d1',
+        name: '--cui-fg-warning-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
+    /* Danger foregrounds */
     {
-        name: '--cui-border-subtle-pressed',
-        value: '#9da7b1',
+        name: '--cui-fg-danger',
+        value: '#ff634e',
         type: 'color',
     },
     {
-        name: '--cui-border-success-disabled',
-        value: 'rgba(1, 136, 80, 0.4000)',
+        name: '--cui-fg-danger-hovered',
+        value: '#ff5c47',
         type: 'color',
     },
     {
-        name: '--cui-border-success-hovered',
-        value: '#007a4e',
+        name: '--cui-fg-danger-pressed',
+        value: '#ff6a57',
         type: 'color',
     },
     {
-        name: '--cui-border-success-pressed',
-        value: '#016c26',
+        name: '--cui-fg-danger-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
+    /* Promo foregrounds */
     {
-        name: '--cui-border-warning-disabled',
-        value: 'rgba(226, 121, 0, 0.4000)',
+        name: '--cui-fg-promo',
+        value: '#cf7bf6',
         type: 'color',
     },
     {
-        name: '--cui-border-warning-hovered',
-        value: '#cc6d00',
+        name: '--cui-fg-promo-hovered',
+        value: '#c768f3',
         type: 'color',
     },
     {
-        name: '--cui-border-warning-pressed',
-        value: '#b25c00',
+        name: '--cui-fg-promo-pressed',
+        value: '#ce72f8',
         type: 'color',
     },
     {
-        name: '--cui-fg-accent',
-        value: '#ffffff',
+        name: '--cui-fg-promo-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
+    /* Neutral borders */
     {
-        name: '--cui-fg-accent-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-border-normal',
+        value: 'rgba(223, 232, 241, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-accent-hovered',
-        value: '#000000',
+        name: '--cui-border-normal-hovered',
+        value: 'rgba(223, 232, 241, 0.3500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-accent-pressed',
-        value: '#000000',
+        name: '--cui-border-normal-pressed',
+        value: 'rgba(223, 232, 241, 0.4500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-danger',
-        value: '#de331d',
+        name: '--cui-border-normal-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-danger-disabled',
-        value: 'rgba(222, 51, 29, 0.4000)',
+        name: '--cui-border-subtle',
+        value: 'rgba(223, 232, 241, 0.1500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-danger-hovered',
-        value: '#bd2c19',
+        name: '--cui-border-subtle-hovered',
+        value: 'rgba(223, 232, 241, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-danger-pressed',
-        value: '#9e2415',
+        name: '--cui-border-subtle-pressed',
+        value: 'rgba(223, 232, 241, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-normal',
-        value: '#ffffff',
+        name: '--cui-border-subtle-disabled',
+        value: 'rgba(216, 232, 248, 0.1000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-normal-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-border-divider',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-normal-hovered',
-        value: '#0f131a',
+        name: '--cui-border-divider-hovered',
+        value: 'rgba(223, 232, 241, 0.3500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-normal-pressed',
-        value: '#0f131a',
+        name: '--cui-border-divider-pressed',
+        value: 'rgba(223, 232, 241, 0.4500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong',
-        value: '#0f131a',
+        name: '--cui-border-divider-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-disabled',
-        value: 'rgba(255, 255, 255, 0.4000)',
+        name: '--cui-border-strong',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-hovered',
-        value: '#ffffff',
+        name: '--cui-border-strong-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-pressed',
-        value: '#ffffff',
+        name: '--cui-border-strong-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-subtle',
-        value: 'rgba(15, 19, 26, 0.7000)',
+        name: '--cui-border-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Accent borders */
     {
-        name: '--cui-fg-on-strong-subtle-disabled',
-        value: 'rgba(255, 255, 255, 0.3000)',
+        name: '--cui-border-accent',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-subtle-hovered',
-        value: 'rgba(255, 255, 255, 0.8000)',
+        name: '--cui-border-accent-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-subtle-pressed',
-        value: 'rgba(255, 255, 255, 0.9000)',
+        name: '--cui-border-accent-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-fg-placeholder',
-        value: '#6e747a',
+        name: '--cui-border-accent-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Success borders */
     {
-        name: '--cui-fg-placeholder-disabled',
-        value: 'rgba(157, 167, 177, 0.4000)',
+        name: '--cui-border-success',
+        value: '#0cd368',
         type: 'color',
     },
     {
-        name: '--cui-fg-placeholder-hovered',
-        value: '#9da7b1',
+        name: '--cui-border-success-hovered',
+        value: '#13e072',
         type: 'color',
     },
     {
-        name: '--cui-fg-placeholder-pressed',
-        value: '#9da7b1',
+        name: '--cui-border-success-pressed',
+        value: '#25e980',
         type: 'color',
     },
     {
-        name: '--cui-fg-promo',
-        value: '#ae49de',
+        name: '--cui-border-success-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Warning borders */
     {
-        name: '--cui-fg-promo-disabled',
-        value: 'rgba(158, 51, 224, 0.4000)',
+        name: '--cui-border-warning',
+        value: '#f5b81c',
         type: 'color',
     },
     {
-        name: '--cui-fg-promo-hovered',
-        value: '#8a1ecc',
+        name: '--cui-border-warning-hovered',
+        value: '#f7c440',
         type: 'color',
     },
     {
-        name: '--cui-fg-promo-pressed',
-        value: '#7219a9',
+        name: '--cui-border-warning-pressed',
+        value: '#f7cb59',
         type: 'color',
     },
     {
-        name: '--cui-fg-subtle',
-        value: '#8f969d',
+        name: '--cui-border-warning-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Danger borders */
     {
-        name: '--cui-fg-subtle-disabled',
-        value: 'rgba(106, 115, 124, 0.4000)',
+        name: '--cui-border-danger',
+        value: '#ff4e37',
         type: 'color',
     },
     {
-        name: '--cui-fg-subtle-hovered',
-        value: '#33373e',
+        name: '--cui-border-danger-hovered',
+        value: '#ff5c47',
         type: 'color',
     },
     {
-        name: '--cui-fg-subtle-pressed',
-        value: '#0f131a',
+        name: '--cui-border-danger-pressed',
+        value: '#ff6a57',
         type: 'color',
     },
     {
-        name: '--cui-fg-success',
-        value: '#39c57a',
+        name: '--cui-border-danger-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Promo borders */
     {
-        name: '--cui-fg-success-disabled',
-        value: 'rgba(1, 136, 80, 0.4000)',
+        name: '--cui-border-promo',
+        value: '#c353f7',
         type: 'color',
     },
     {
-        name: '--cui-fg-success-hovered',
-        value: '#007a4e',
+        name: '--cui-border-promo-hovered',
+        value: '#c768f3',
         type: 'color',
     },
     {
-        name: '--cui-fg-success-pressed',
-        value: '#016c26',
+        name: '--cui-border-promo-pressed',
+        value: '#ce72f8',
         type: 'color',
     },
     {
-        name: '--cui-fg-warning',
-        value: '#f9d20a',
+        name: '--cui-border-promo-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Special colors */
     {
-        name: '--cui-fg-warning-disabled',
-        value: 'rgba(226, 121, 0, 0.4000)',
+        name: '--cui-bg-overlay',
+        value: 'rgba(0, 0, 0, 0.7000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-warning-hovered',
-        value: '#cc6d00',
+        name: '--cui-bg-elevated',
+        value: '#2f3438',
         type: 'color',
     },
     {
-        name: '--cui-fg-warning-pressed',
-        value: '#b25c00',
+        name: '--cui-border-focus',
+        value: '#ffffff',
         type: 'color',
     },
 ];

dist/cjs/types/index.d.ts

@@ -144,8 +144,8 @@ /**
 type ColorUsage = 'fg' | 'bg' | 'border';
-type ColorSentiment = 'normal' | 'subtle' | 'highlight' | 'accent' | 'placeholder' | 'promo' | 'divider' | 'success' | 'warning' | 'danger';
-type ColorVariant = 'strong' | 'on-strong';
+type ColorSentiment = 'accent' | 'promo' | 'success' | 'warning' | 'danger' | 'on-strong';
+type ColorVariant = 'normal' | 'subtle' | 'highlight' | 'strong' | 'placeholder' | 'elevated' | 'overlay' | 'divider' | 'focus';
 type ColorInteraction = 'hovered' | 'pressed' | 'disabled';
 interface ColorToken extends BaseToken {
     type: 'color';
-    name: `--cui-${ColorUsage}-${ColorSentiment}` | `--cui-${ColorUsage}-${ColorVariant}` | `--cui-${ColorUsage}-${ColorSentiment}-${ColorVariant | ColorInteraction}` | `--cui-${ColorUsage}-${ColorSentiment}-${ColorVariant}-${ColorInteraction}` | '--cui-bg-elevated' | '--cui-bg-overlay' | '--cui-border-focus' | `--cui-${ColorUsage}-${ColorVariant}-${ColorSentiment | ColorInteraction}` | `--cui-${ColorUsage}-${ColorVariant}-${ColorSentiment}-${ColorInteraction}`;
+    name: `--cui-${ColorUsage}-${ColorSentiment | ColorVariant}` | `--cui-${ColorUsage}-${ColorVariant}-${ColorInteraction}` | `--cui-${ColorUsage}-${ColorSentiment}-${ColorVariant | ColorInteraction}` | `--cui-${ColorUsage}-${ColorSentiment}-${ColorVariant}-${ColorInteraction}`;
     value: Color;
@@ -152,0 +152,0 @@ }

dist/es/themes/dark.d.ts

@@ -16,541 +16,541 @@ /**
 export declare const dark: ({
-    name: "--cui-border-accent";
-    value: "#ffffff";
+    name: "--cui-bg-normal";
+    value: "#171d24";
     type: "color";
 } | {
-    name: "--cui-border-danger";
-    value: "#de331d";
+    name: "--cui-bg-normal-hovered";
+    value: "#212831";
     type: "color";
 } | {
-    name: "--cui-border-divider";
-    value: "#454954";
+    name: "--cui-bg-normal-pressed";
+    value: "#28313c";
     type: "color";
 } | {
-    name: "--cui-border-focus";
-    value: "#ffffff";
+    name: "--cui-bg-normal-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-border-normal";
-    value: "#454954";
+    name: "--cui-bg-subtle";
+    value: "#0c0f12";
     type: "color";
 } | {
-    name: "--cui-border-promo";
-    value: "#ae49de";
+    name: "--cui-bg-subtle-hovered";
+    value: "#080b0d";
     type: "color";
 } | {
-    name: "--cui-border-strong";
-    value: "#4e5155";
+    name: "--cui-bg-subtle-pressed";
+    value: "#040607";
     type: "color";
 } | {
-    name: "--cui-border-subtle";
-    value: "#2c3038";
+    name: "--cui-bg-subtle-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-border-success";
-    value: "#39c57a";
+    name: "--cui-bg-highlight";
+    value: "#363c41";
     type: "color";
 } | {
-    name: "--cui-border-warning";
-    value: "#e87c00";
+    name: "--cui-bg-highlight-hovered";
+    value: "#3d4249";
     type: "color";
 } | {
-    name: "--cui-bg-accent";
-    value: "#181d22";
+    name: "--cui-bg-highlight-pressed";
+    value: "#424950";
     type: "color";
 } | {
-    name: "--cui-bg-accent-disabled";
-    value: "rgba(238, 240, 242, 0.4000)";
+    name: "--cui-bg-highlight-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-accent-hovered";
-    value: "#e3e7eb";
+    name: "--cui-bg-strong";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-bg-accent-pressed";
-    value: "#e3e7eb";
+    name: "--cui-bg-strong-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-bg-accent-strong";
-    value: "#ffffff";
+    name: "--cui-bg-strong-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-bg-accent-strong-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-bg-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-accent-strong-hovered";
-    value: "#000000";
+    name: "--cui-bg-accent";
+    value: "#0C0F12";
     type: "color";
 } | {
-    name: "--cui-bg-accent-strong-pressed";
-    value: "#000000";
+    name: "--cui-bg-accent-hovered";
+    value: "#080B0D";
     type: "color";
 } | {
-    name: "--cui-bg-danger";
-    value: "#5e181d";
+    name: "--cui-bg-accent-pressed";
+    value: "#040607";
     type: "color";
 } | {
-    name: "--cui-bg-danger-disabled";
-    value: "rgba(251, 233, 231, 0.4000)";
+    name: "--cui-bg-accent-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-danger-hovered";
-    value: "#fcddd9";
+    name: "--cui-bg-accent-strong";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-bg-danger-pressed";
-    value: "#f7ccc7";
+    name: "--cui-bg-accent-strong-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-bg-danger-strong";
-    value: "#de331d";
+    name: "--cui-bg-accent-strong-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-bg-danger-strong-disabled";
-    value: "rgba(222, 51, 29, 0.4000)";
+    name: "--cui-bg-accent-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-danger-strong-hovered";
-    value: "#bd2c19";
+    name: "--cui-bg-success";
+    value: "rgba(12, 211, 104, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-bg-danger-strong-pressed";
-    value: "#9e2415";
+    name: "--cui-bg-success-hovered";
+    value: "rgba(12, 211, 104, 0.2500)";
     type: "color";
 } | {
-    name: "--cui-bg-elevated";
-    value: "#2d343a";
+    name: "--cui-bg-success-pressed";
+    value: "rgba(12, 211, 104, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-bg-highlight";
-    value: "#383f46";
+    name: "--cui-bg-success-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-highlight-disabled";
-    value: "rgba(227, 231, 235, 0.4000)";
+    name: "--cui-bg-success-strong";
+    value: "#0cd368";
     type: "color";
 } | {
-    name: "--cui-bg-highlight-hovered";
-    value: "#c2c9d1";
+    name: "--cui-bg-success-strong-hovered";
+    value: "#13e072";
     type: "color";
 } | {
-    name: "--cui-bg-highlight-pressed";
-    value: "#9da7b1";
+    name: "--cui-bg-success-strong-pressed";
+    value: "#25e980";
     type: "color";
 } | {
-    name: "--cui-bg-normal";
-    value: "#0a0e12";
+    name: "--cui-bg-success-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-normal-disabled";
-    value: "rgba(255, 255, 255, 0.4000)";
+    name: "--cui-bg-warning";
+    value: "rgba(245, 158, 28, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-bg-normal-hovered";
-    value: "#e3e7eb";
+    name: "--cui-bg-warning-hovered";
+    value: "rgba(245, 158, 28, 0.2500)";
     type: "color";
 } | {
-    name: "--cui-bg-normal-pressed";
-    value: "#e3e7eb";
+    name: "--cui-bg-warning-pressed";
+    value: "rgba(245, 158, 28, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-bg-overlay";
-    value: "rgba(0, 0, 0, 0.4000)";
+    name: "--cui-bg-warning-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-promo";
-    value: "#f5edfe";
+    name: "--cui-bg-warning-strong";
+    value: "#f5b81c";
     type: "color";
 } | {
-    name: "--cui-bg-promo-disabled";
-    value: "rgba(245, 237, 254, 0.4000)";
+    name: "--cui-bg-warning-strong-hovered";
+    value: "#f7c440";
     type: "color";
 } | {
-    name: "--cui-bg-promo-hovered";
-    value: "#ede0fc";
+    name: "--cui-bg-warning-strong-pressed";
+    value: "#f7cb59";
     type: "color";
 } | {
-    name: "--cui-bg-promo-pressed";
-    value: "#e0c9f8";
+    name: "--cui-bg-warning-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-promo-strong";
-    value: "#ae49de";
+    name: "--cui-bg-danger";
+    value: "rgba(255, 76, 53, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-bg-promo-strong-disabled";
-    value: "rgba(158, 51, 224, 0.4000)";
+    name: "--cui-bg-danger-hovered";
+    value: "rgba(255, 76, 53, 0.2500)";
     type: "color";
 } | {
-    name: "--cui-bg-promo-strong-hovered";
-    value: "#8a1ecc";
+    name: "--cui-bg-danger-pressed";
+    value: "rgba(255, 76, 53, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-bg-promo-strong-pressed";
-    value: "#7219a9";
+    name: "--cui-bg-danger-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-strong";
-    value: "#2d343a";
+    name: "--cui-bg-danger-strong";
+    value: "#ff4e37";
     type: "color";
 } | {
-    name: "--cui-bg-strong-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-bg-danger-strong-hovered";
+    value: "#ff5c47";
     type: "color";
 } | {
-    name: "--cui-bg-strong-hovered";
-    value: "#000000";
+    name: "--cui-bg-danger-strong-pressed";
+    value: "#ff6a57";
     type: "color";
 } | {
-    name: "--cui-bg-strong-pressed";
-    value: "#000000";
+    name: "--cui-bg-danger-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-subtle";
-    value: "#181d22";
+    name: "--cui-bg-promo";
+    value: "rgba(195, 83, 247, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-bg-subtle-disabled";
-    value: "rgba(227, 231, 235, 0.4000)";
+    name: "--cui-bg-promo-hovered";
+    value: "rgba(195, 83, 247, 0.2500)";
     type: "color";
 } | {
-    name: "--cui-bg-subtle-hovered";
-    value: "#e3e7eb";
+    name: "--cui-bg-promo-pressed";
+    value: "rgba(195, 83, 247, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-bg-subtle-pressed";
-    value: "#c2c9d1";
+    name: "--cui-bg-promo-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-success";
-    value: "#044022";
+    name: "--cui-bg-promo-strong";
+    value: "#c353f7";
     type: "color";
 } | {
-    name: "--cui-bg-success-disabled";
-    value: "rgba(233, 251, 233, 0.4000)";
+    name: "--cui-bg-promo-strong-hovered";
+    value: "#c768f3";
     type: "color";
 } | {
-    name: "--cui-bg-success-hovered";
-    value: "#d7f8d7";
+    name: "--cui-bg-promo-strong-pressed";
+    value: "#ce72f8";
     type: "color";
 } | {
-    name: "--cui-bg-success-pressed";
-    value: "#c1e8c1";
+    name: "--cui-bg-promo-strong-disabled";
+    value: "rgba(216, 232, 248, 0.0800)";
     type: "color";
 } | {
-    name: "--cui-bg-success-strong";
-    value: "#39c57a";
+    name: "--cui-fg-normal";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-bg-success-strong-disabled";
-    value: "rgba(1, 136, 80, 0.4000)";
+    name: "--cui-fg-normal-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-bg-success-strong-hovered";
-    value: "#007a4e";
+    name: "--cui-fg-normal-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-bg-success-strong-pressed";
-    value: "#016c26";
+    name: "--cui-fg-normal-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning";
-    value: "#593918";
+    name: "--cui-fg-subtle";
+    value: "rgba(223, 232, 241, 0.6000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-disabled";
-    value: "rgba(253, 244, 219, 0.4000)";
+    name: "--cui-fg-subtle-hovered";
+    value: "rgba(223, 232, 241, 0.7000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-hovered";
-    value: "#faeec6";
+    name: "--cui-fg-subtle-pressed";
+    value: "rgba(223, 232, 241, 0.8000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-pressed";
-    value: "#f5dea3";
+    name: "--cui-fg-subtle-disabled";
+    value: "rgba(216, 232, 248, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-strong";
-    value: "#f9d20a";
+    name: "--cui-fg-placeholder";
+    value: "rgba(223, 232, 241, 0.4000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-strong-disabled";
-    value: "rgba(232, 124, 0, 0.4000)";
+    name: "--cui-fg-placeholder-hovered";
+    value: "rgba(223, 232, 241, 0.4000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-strong-hovered";
-    value: "#cc6d00";
+    name: "--cui-fg-placeholder-pressed";
+    value: "rgba(223, 232, 241, 0.4000)";
     type: "color";
 } | {
-    name: "--cui-bg-warning-strong-pressed";
-    value: "#b25c00";
+    name: "--cui-fg-placeholder-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-border-accent-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-fg-on-strong";
+    value: "#0f131a";
     type: "color";
 } | {
-    name: "--cui-border-accent-hovered";
-    value: "#000000";
+    name: "--cui-fg-on-strong-hovered";
+    value: "#0f131a";
     type: "color";
 } | {
-    name: "--cui-border-accent-pressed";
-    value: "#000000";
+    name: "--cui-fg-on-strong-pressed";
+    value: "#0f131a";
     type: "color";
 } | {
-    name: "--cui-border-danger-disabled";
-    value: "rgba(222, 51, 29, 0.4000)";
+    name: "--cui-fg-on-strong-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-border-danger-hovered";
-    value: "#bd2c19";
+    name: "--cui-fg-on-strong-subtle";
+    value: "rgba(15, 19, 26, 0.7000)";
     type: "color";
 } | {
-    name: "--cui-border-danger-pressed";
-    value: "#9e2415";
+    name: "--cui-fg-on-strong-subtle-hovered";
+    value: "rgba(15, 19, 26, 0.7000)";
     type: "color";
 } | {
-    name: "--cui-border-divider-disabled";
-    value: "rgba(194, 201, 209, 0.4000)";
+    name: "--cui-fg-on-strong-subtle-pressed";
+    value: "rgba(15, 19, 26, 0.7000)";
     type: "color";
 } | {
-    name: "--cui-border-divider-hovered";
-    value: "#9da7b1";
+    name: "--cui-fg-on-strong-subtle-disabled";
+    value: "rgba(216, 232, 248, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-border-divider-pressed";
-    value: "#6a737c";
+    name: "--cui-fg-accent";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-border-normal-disabled";
-    value: "rgba(194, 201, 209, 0.4000)";
+    name: "--cui-fg-accent-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-border-normal-hovered";
-    value: "#9da7b1";
+    name: "--cui-fg-accent-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-border-normal-pressed";
-    value: "#6a737c";
+    name: "--cui-fg-accent-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-border-promo-disabled";
-    value: "rgba(158, 51, 224, 0.4000)";
+    name: "--cui-fg-success";
+    value: "#17db72";
     type: "color";
 } | {
-    name: "--cui-border-promo-hovered";
-    value: "#8a1ecc";
+    name: "--cui-fg-success-hovered";
+    value: "#13e072";
     type: "color";
 } | {
-    name: "--cui-border-promo-pressed";
-    value: "#7219a9";
+    name: "--cui-fg-success-pressed";
+    value: "#25e980";
     type: "color";
 } | {
-    name: "--cui-border-strong-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-fg-success-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-border-strong-hovered";
-    value: "#000000";
+    name: "--cui-fg-warning";
+    value: "#f5b81c";
     type: "color";
 } | {
-    name: "--cui-border-strong-pressed";
-    value: "#000000";
+    name: "--cui-fg-warning-hovered";
+    value: "#f7c440";
     type: "color";
 } | {
-    name: "--cui-border-subtle-disabled";
-    value: "rgba(230, 230, 230, 0.4000)";
+    name: "--cui-fg-warning-pressed";
+    value: "#f7cb59";
     type: "color";
 } | {
-    name: "--cui-border-subtle-hovered";
-    value: "#c2c9d1";
+    name: "--cui-fg-warning-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-border-subtle-pressed";
-    value: "#9da7b1";
+    name: "--cui-fg-danger";
+    value: "#ff634e";
     type: "color";
 } | {
-    name: "--cui-border-success-disabled";
-    value: "rgba(1, 136, 80, 0.4000)";
+    name: "--cui-fg-danger-hovered";
+    value: "#ff5c47";
     type: "color";
 } | {
-    name: "--cui-border-success-hovered";
-    value: "#007a4e";
+    name: "--cui-fg-danger-pressed";
+    value: "#ff6a57";
     type: "color";
 } | {
-    name: "--cui-border-success-pressed";
-    value: "#016c26";
+    name: "--cui-fg-danger-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-border-warning-disabled";
-    value: "rgba(226, 121, 0, 0.4000)";
+    name: "--cui-fg-promo";
+    value: "#cf7bf6";
     type: "color";
 } | {
-    name: "--cui-border-warning-hovered";
-    value: "#cc6d00";
+    name: "--cui-fg-promo-hovered";
+    value: "#c768f3";
     type: "color";
 } | {
-    name: "--cui-border-warning-pressed";
-    value: "#b25c00";
+    name: "--cui-fg-promo-pressed";
+    value: "#ce72f8";
     type: "color";
 } | {
-    name: "--cui-fg-accent";
-    value: "#ffffff";
+    name: "--cui-fg-promo-disabled";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-fg-accent-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-border-normal";
+    value: "rgba(223, 232, 241, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-fg-accent-hovered";
-    value: "#000000";
+    name: "--cui-border-normal-hovered";
+    value: "rgba(223, 232, 241, 0.3500)";
     type: "color";
 } | {
-    name: "--cui-fg-accent-pressed";
-    value: "#000000";
+    name: "--cui-border-normal-pressed";
+    value: "rgba(223, 232, 241, 0.4500)";
     type: "color";
 } | {
-    name: "--cui-fg-danger";
-    value: "#de331d";
+    name: "--cui-border-normal-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-danger-disabled";
-    value: "rgba(222, 51, 29, 0.4000)";
+    name: "--cui-border-subtle";
+    value: "rgba(223, 232, 241, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-danger-hovered";
-    value: "#bd2c19";
+    name: "--cui-border-subtle-hovered";
+    value: "rgba(223, 232, 241, 0.2000)";
     type: "color";
 } | {
-    name: "--cui-fg-danger-pressed";
-    value: "#9e2415";
+    name: "--cui-border-subtle-pressed";
+    value: "rgba(223, 232, 241, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-fg-normal";
-    value: "#ffffff";
+    name: "--cui-border-subtle-disabled";
+    value: "rgba(216, 232, 248, 0.1000)";
     type: "color";
 } | {
-    name: "--cui-fg-normal-disabled";
-    value: "rgba(15, 19, 26, 0.4000)";
+    name: "--cui-border-divider";
+    value: "rgba(216, 232, 248, 0.3000)";
     type: "color";
 } | {
-    name: "--cui-fg-normal-hovered";
-    value: "#0f131a";
+    name: "--cui-border-divider-hovered";
+    value: "rgba(223, 232, 241, 0.3500)";
     type: "color";
 } | {
-    name: "--cui-fg-normal-pressed";
-    value: "#0f131a";
+    name: "--cui-border-divider-pressed";
+    value: "rgba(223, 232, 241, 0.4500)";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong";
-    value: "#0f131a";
+    name: "--cui-border-divider-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-disabled";
-    value: "rgba(255, 255, 255, 0.4000)";
+    name: "--cui-border-strong";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-hovered";
-    value: "#ffffff";
+    name: "--cui-border-strong-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-pressed";
-    value: "#ffffff";
+    name: "--cui-border-strong-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-subtle";
-    value: "rgba(15, 19, 26, 0.7000)";
+    name: "--cui-border-strong-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-subtle-disabled";
-    value: "rgba(255, 255, 255, 0.3000)";
+    name: "--cui-border-accent";
+    value: "#ffffff";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-subtle-hovered";
-    value: "rgba(255, 255, 255, 0.8000)";
+    name: "--cui-border-accent-hovered";
+    value: "#f6f8f9";
     type: "color";
 } | {
-    name: "--cui-fg-on-strong-subtle-pressed";
-    value: "rgba(255, 255, 255, 0.9000)";
+    name: "--cui-border-accent-pressed";
+    value: "#e3e7eb";
     type: "color";
 } | {
-    name: "--cui-fg-placeholder";
-    value: "#6e747a";
+    name: "--cui-border-accent-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-placeholder-disabled";
-    value: "rgba(157, 167, 177, 0.4000)";
+    name: "--cui-border-success";
+    value: "#0cd368";
     type: "color";
 } | {
-    name: "--cui-fg-placeholder-hovered";
-    value: "#9da7b1";
+    name: "--cui-border-success-hovered";
+    value: "#13e072";
     type: "color";
 } | {
-    name: "--cui-fg-placeholder-pressed";
-    value: "#9da7b1";
+    name: "--cui-border-success-pressed";
+    value: "#25e980";
     type: "color";
 } | {
-    name: "--cui-fg-promo";
-    value: "#ae49de";
+    name: "--cui-border-success-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-promo-disabled";
-    value: "rgba(158, 51, 224, 0.4000)";
+    name: "--cui-border-warning";
+    value: "#f5b81c";
     type: "color";
 } | {
-    name: "--cui-fg-promo-hovered";
-    value: "#8a1ecc";
+    name: "--cui-border-warning-hovered";
+    value: "#f7c440";
     type: "color";
 } | {
-    name: "--cui-fg-promo-pressed";
-    value: "#7219a9";
+    name: "--cui-border-warning-pressed";
+    value: "#f7cb59";
     type: "color";
 } | {
-    name: "--cui-fg-subtle";
-    value: "#8f969d";
+    name: "--cui-border-warning-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-subtle-disabled";
-    value: "rgba(106, 115, 124, 0.4000)";
+    name: "--cui-border-danger";
+    value: "#ff4e37";
     type: "color";
 } | {
-    name: "--cui-fg-subtle-hovered";
-    value: "#33373e";
+    name: "--cui-border-danger-hovered";
+    value: "#ff5c47";
     type: "color";
 } | {
-    name: "--cui-fg-subtle-pressed";
-    value: "#0f131a";
+    name: "--cui-border-danger-pressed";
+    value: "#ff6a57";
     type: "color";
 } | {
-    name: "--cui-fg-success";
-    value: "#39c57a";
+    name: "--cui-border-danger-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-success-disabled";
-    value: "rgba(1, 136, 80, 0.4000)";
+    name: "--cui-border-promo";
+    value: "#c353f7";
     type: "color";
 } | {
-    name: "--cui-fg-success-hovered";
-    value: "#007a4e";
+    name: "--cui-border-promo-hovered";
+    value: "#c768f3";
     type: "color";
 } | {
-    name: "--cui-fg-success-pressed";
-    value: "#016c26";
+    name: "--cui-border-promo-pressed";
+    value: "#ce72f8";
     type: "color";
 } | {
-    name: "--cui-fg-warning";
-    value: "#f9d20a";
+    name: "--cui-border-promo-disabled";
+    value: "rgba(216, 232, 248, 0.1500)";
     type: "color";
 } | {
-    name: "--cui-fg-warning-disabled";
-    value: "rgba(226, 121, 0, 0.4000)";
+    name: "--cui-bg-overlay";
+    value: "rgba(0, 0, 0, 0.7000)";
     type: "color";
 } | {
-    name: "--cui-fg-warning-hovered";
-    value: "#cc6d00";
+    name: "--cui-bg-elevated";
+    value: "#2f3438";
     type: "color";
 } | {
-    name: "--cui-fg-warning-pressed";
-    value: "#b25c00";
+    name: "--cui-border-focus";
+    value: "#ffffff";
     type: "color";
 })[];

dist/es/themes/dark.js

@@ -16,677 +16,696 @@ /**
 export const dark = [
+    /* Neutral backgrounds */
     {
-        name: '--cui-border-accent',
-        value: '#ffffff',
+        name: '--cui-bg-normal',
+        value: '#171d24',
         type: 'color',
     },
     {
-        name: '--cui-border-danger',
-        value: '#de331d',
+        name: '--cui-bg-normal-hovered',
+        value: '#212831',
         type: 'color',
     },
     {
-        name: '--cui-border-divider',
-        value: '#454954',
+        name: '--cui-bg-normal-pressed',
+        value: '#28313c',
         type: 'color',
     },
     {
-        name: '--cui-border-focus',
-        value: '#ffffff',
+        name: '--cui-bg-normal-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-border-normal',
-        value: '#454954',
+        name: '--cui-bg-subtle',
+        value: '#0c0f12',
         type: 'color',
     },
     {
-        name: '--cui-border-promo',
-        value: '#ae49de',
+        name: '--cui-bg-subtle-hovered',
+        value: '#080b0d',
         type: 'color',
     },
     {
-        name: '--cui-border-strong',
-        value: '#4e5155',
+        name: '--cui-bg-subtle-pressed',
+        value: '#040607',
         type: 'color',
     },
     {
-        name: '--cui-border-subtle',
-        value: '#2c3038',
+        name: '--cui-bg-subtle-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-border-success',
-        value: '#39c57a',
+        name: '--cui-bg-highlight',
+        value: '#363c41',
         type: 'color',
     },
     {
-        name: '--cui-border-warning',
-        value: '#e87c00',
+        name: '--cui-bg-highlight-hovered',
+        value: '#3d4249',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent',
-        value: '#181d22',
+        name: '--cui-bg-highlight-pressed',
+        value: '#424950',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-disabled',
-        value: 'rgba(238, 240, 242, 0.4000)',
+        name: '--cui-bg-highlight-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-hovered',
-        value: '#e3e7eb',
+        name: '--cui-bg-strong',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-pressed',
-        value: '#e3e7eb',
+        name: '--cui-bg-strong-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-strong',
-        value: '#ffffff',
+        name: '--cui-bg-strong-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-strong-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-bg-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Accent backgrounds */
     {
-        name: '--cui-bg-accent-strong-hovered',
-        value: '#000000',
+        name: '--cui-bg-accent',
+        value: '#0C0F12',
         type: 'color',
     },
     {
-        name: '--cui-bg-accent-strong-pressed',
-        value: '#000000',
+        name: '--cui-bg-accent-hovered',
+        value: '#080B0D',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger',
-        value: '#5e181d',
+        name: '--cui-bg-accent-pressed',
+        value: '#040607',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-disabled',
-        value: 'rgba(251, 233, 231, 0.4000)',
+        name: '--cui-bg-accent-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-hovered',
-        value: '#fcddd9',
+        name: '--cui-bg-accent-strong',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-pressed',
-        value: '#f7ccc7',
+        name: '--cui-bg-accent-strong-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-strong',
-        value: '#de331d',
+        name: '--cui-bg-accent-strong-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-strong-disabled',
-        value: 'rgba(222, 51, 29, 0.4000)',
+        name: '--cui-bg-accent-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Success backgrounds */
     {
-        name: '--cui-bg-danger-strong-hovered',
-        value: '#bd2c19',
+        name: '--cui-bg-success',
+        value: 'rgba(12, 211, 104, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-danger-strong-pressed',
-        value: '#9e2415',
+        name: '--cui-bg-success-hovered',
+        value: 'rgba(12, 211, 104, 0.2500)',
         type: 'color',
     },
     {
-        name: '--cui-bg-elevated',
-        value: '#2d343a',
+        name: '--cui-bg-success-pressed',
+        value: 'rgba(12, 211, 104, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-highlight',
-        value: '#383f46',
+        name: '--cui-bg-success-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-highlight-disabled',
-        value: 'rgba(227, 231, 235, 0.4000)',
+        name: '--cui-bg-success-strong',
+        value: '#0cd368',
         type: 'color',
     },
     {
-        name: '--cui-bg-highlight-hovered',
-        value: '#c2c9d1',
+        name: '--cui-bg-success-strong-hovered',
+        value: '#13e072',
         type: 'color',
     },
     {
-        name: '--cui-bg-highlight-pressed',
-        value: '#9da7b1',
+        name: '--cui-bg-success-strong-pressed',
+        value: '#25e980',
         type: 'color',
     },
     {
-        name: '--cui-bg-normal',
-        value: '#0a0e12',
+        name: '--cui-bg-success-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Warning backgrounds */
     {
-        name: '--cui-bg-normal-disabled',
-        value: 'rgba(255, 255, 255, 0.4000)',
+        name: '--cui-bg-warning',
+        value: 'rgba(245, 158, 28, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-normal-hovered',
-        value: '#e3e7eb',
+        name: '--cui-bg-warning-hovered',
+        value: 'rgba(245, 158, 28, 0.2500)',
         type: 'color',
     },
     {
-        name: '--cui-bg-normal-pressed',
-        value: '#e3e7eb',
+        name: '--cui-bg-warning-pressed',
+        value: 'rgba(245, 158, 28, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-overlay',
-        value: 'rgba(0, 0, 0, 0.4000)',
+        name: '--cui-bg-warning-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo',
-        value: '#f5edfe',
+        name: '--cui-bg-warning-strong',
+        value: '#f5b81c',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-disabled',
-        value: 'rgba(245, 237, 254, 0.4000)',
+        name: '--cui-bg-warning-strong-hovered',
+        value: '#f7c440',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-hovered',
-        value: '#ede0fc',
+        name: '--cui-bg-warning-strong-pressed',
+        value: '#f7cb59',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-pressed',
-        value: '#e0c9f8',
+        name: '--cui-bg-warning-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Danger backgrounds */
     {
-        name: '--cui-bg-promo-strong',
-        value: '#ae49de',
+        name: '--cui-bg-danger',
+        value: 'rgba(255, 76, 53, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-strong-disabled',
-        value: 'rgba(158, 51, 224, 0.4000)',
+        name: '--cui-bg-danger-hovered',
+        value: 'rgba(255, 76, 53, 0.2500)',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-strong-hovered',
-        value: '#8a1ecc',
+        name: '--cui-bg-danger-pressed',
+        value: 'rgba(255, 76, 53, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-promo-strong-pressed',
-        value: '#7219a9',
+        name: '--cui-bg-danger-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-strong',
-        value: '#2d343a',
+        name: '--cui-bg-danger-strong',
+        value: '#ff4e37',
         type: 'color',
     },
     {
-        name: '--cui-bg-strong-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-bg-danger-strong-hovered',
+        value: '#ff5c47',
         type: 'color',
     },
     {
-        name: '--cui-bg-strong-hovered',
-        value: '#000000',
+        name: '--cui-bg-danger-strong-pressed',
+        value: '#ff6a57',
         type: 'color',
     },
     {
-        name: '--cui-bg-strong-pressed',
-        value: '#000000',
+        name: '--cui-bg-danger-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Promo backgrounds */
     {
-        name: '--cui-bg-subtle',
-        value: '#181d22',
+        name: '--cui-bg-promo',
+        value: 'rgba(195, 83, 247, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-subtle-disabled',
-        value: 'rgba(227, 231, 235, 0.4000)',
+        name: '--cui-bg-promo-hovered',
+        value: 'rgba(195, 83, 247, 0.2500)',
         type: 'color',
     },
     {
-        name: '--cui-bg-subtle-hovered',
-        value: '#e3e7eb',
+        name: '--cui-bg-promo-pressed',
+        value: 'rgba(195, 83, 247, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-subtle-pressed',
-        value: '#c2c9d1',
+        name: '--cui-bg-promo-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
     {
-        name: '--cui-bg-success',
-        value: '#044022',
+        name: '--cui-bg-promo-strong',
+        value: '#c353f7',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-disabled',
-        value: 'rgba(233, 251, 233, 0.4000)',
+        name: '--cui-bg-promo-strong-hovered',
+        value: '#c768f3',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-hovered',
-        value: '#d7f8d7',
+        name: '--cui-bg-promo-strong-pressed',
+        value: '#ce72f8',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-pressed',
-        value: '#c1e8c1',
+        name: '--cui-bg-promo-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.0800)',
         type: 'color',
     },
+    /* Neutral foregrounds */
     {
-        name: '--cui-bg-success-strong',
-        value: '#39c57a',
+        name: '--cui-fg-normal',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-strong-disabled',
-        value: 'rgba(1, 136, 80, 0.4000)',
+        name: '--cui-fg-normal-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-strong-hovered',
-        value: '#007a4e',
+        name: '--cui-fg-normal-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-bg-success-strong-pressed',
-        value: '#016c26',
+        name: '--cui-fg-normal-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning',
-        value: '#593918',
+        name: '--cui-fg-subtle',
+        value: 'rgba(223, 232, 241, 0.6000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-disabled',
-        value: 'rgba(253, 244, 219, 0.4000)',
+        name: '--cui-fg-subtle-hovered',
+        value: 'rgba(223, 232, 241, 0.7000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-hovered',
-        value: '#faeec6',
+        name: '--cui-fg-subtle-pressed',
+        value: 'rgba(223, 232, 241, 0.8000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-pressed',
-        value: '#f5dea3',
+        name: '--cui-fg-subtle-disabled',
+        value: 'rgba(216, 232, 248, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-strong',
-        value: '#f9d20a',
+        name: '--cui-fg-placeholder',
+        value: 'rgba(223, 232, 241, 0.4000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-strong-disabled',
-        value: 'rgba(232, 124, 0, 0.4000)',
+        name: '--cui-fg-placeholder-hovered',
+        value: 'rgba(223, 232, 241, 0.4000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-strong-hovered',
-        value: '#cc6d00',
+        name: '--cui-fg-placeholder-pressed',
+        value: 'rgba(223, 232, 241, 0.4000)',
         type: 'color',
     },
     {
-        name: '--cui-bg-warning-strong-pressed',
-        value: '#b25c00',
+        name: '--cui-fg-placeholder-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
     {
-        name: '--cui-border-accent-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-fg-on-strong',
+        value: '#0f131a',
         type: 'color',
     },
     {
-        name: '--cui-border-accent-hovered',
-        value: '#000000',
+        name: '--cui-fg-on-strong-hovered',
+        value: '#0f131a',
         type: 'color',
     },
     {
-        name: '--cui-border-accent-pressed',
-        value: '#000000',
+        name: '--cui-fg-on-strong-pressed',
+        value: '#0f131a',
         type: 'color',
     },
     {
-        name: '--cui-border-danger-disabled',
-        value: 'rgba(222, 51, 29, 0.4000)',
+        name: '--cui-fg-on-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-border-danger-hovered',
-        value: '#bd2c19',
+        name: '--cui-fg-on-strong-subtle',
+        value: 'rgba(15, 19, 26, 0.7000)',
         type: 'color',
     },
     {
-        name: '--cui-border-danger-pressed',
-        value: '#9e2415',
+        name: '--cui-fg-on-strong-subtle-hovered',
+        value: 'rgba(15, 19, 26, 0.7000)',
         type: 'color',
     },
     {
-        name: '--cui-border-divider-disabled',
-        value: 'rgba(194, 201, 209, 0.4000)',
+        name: '--cui-fg-on-strong-subtle-pressed',
+        value: 'rgba(15, 19, 26, 0.7000)',
         type: 'color',
     },
     {
-        name: '--cui-border-divider-hovered',
-        value: '#9da7b1',
+        name: '--cui-fg-on-strong-subtle-disabled',
+        value: 'rgba(216, 232, 248, 0.2000)',
         type: 'color',
     },
+    /* Accent foregrounds */
     {
-        name: '--cui-border-divider-pressed',
-        value: '#6a737c',
+        name: '--cui-fg-accent',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-border-normal-disabled',
-        value: 'rgba(194, 201, 209, 0.4000)',
+        name: '--cui-fg-accent-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-border-normal-hovered',
-        value: '#9da7b1',
+        name: '--cui-fg-accent-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-border-normal-pressed',
-        value: '#6a737c',
+        name: '--cui-fg-accent-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
+    /* Success foregrounds */
     {
-        name: '--cui-border-promo-disabled',
-        value: 'rgba(158, 51, 224, 0.4000)',
+        name: '--cui-fg-success',
+        value: '#17db72',
         type: 'color',
     },
     {
-        name: '--cui-border-promo-hovered',
-        value: '#8a1ecc',
+        name: '--cui-fg-success-hovered',
+        value: '#13e072',
         type: 'color',
     },
     {
-        name: '--cui-border-promo-pressed',
-        value: '#7219a9',
+        name: '--cui-fg-success-pressed',
+        value: '#25e980',
         type: 'color',
     },
     {
-        name: '--cui-border-strong-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-fg-success-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
+    /* Warning foregrounds */
     {
-        name: '--cui-border-strong-hovered',
-        value: '#000000',
+        name: '--cui-fg-warning',
+        value: '#f5b81c',
         type: 'color',
     },
     {
-        name: '--cui-border-strong-pressed',
-        value: '#000000',
+        name: '--cui-fg-warning-hovered',
+        value: '#f7c440',
         type: 'color',
     },
     {
-        name: '--cui-border-subtle-disabled',
-        value: 'rgba(230, 230, 230, 0.4000)',
+        name: '--cui-fg-warning-pressed',
+        value: '#f7cb59',
         type: 'color',
     },
     {
-        name: '--cui-border-subtle-hovered',
-        value: '#c2c9d1',
+        name: '--cui-fg-warning-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
+    /* Danger foregrounds */
     {
-        name: '--cui-border-subtle-pressed',
-        value: '#9da7b1',
+        name: '--cui-fg-danger',
+        value: '#ff634e',
         type: 'color',
     },
     {
-        name: '--cui-border-success-disabled',
-        value: 'rgba(1, 136, 80, 0.4000)',
+        name: '--cui-fg-danger-hovered',
+        value: '#ff5c47',
         type: 'color',
     },
     {
-        name: '--cui-border-success-hovered',
-        value: '#007a4e',
+        name: '--cui-fg-danger-pressed',
+        value: '#ff6a57',
         type: 'color',
     },
     {
-        name: '--cui-border-success-pressed',
-        value: '#016c26',
+        name: '--cui-fg-danger-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
+    /* Promo foregrounds */
     {
-        name: '--cui-border-warning-disabled',
-        value: 'rgba(226, 121, 0, 0.4000)',
+        name: '--cui-fg-promo',
+        value: '#cf7bf6',
         type: 'color',
     },
     {
-        name: '--cui-border-warning-hovered',
-        value: '#cc6d00',
+        name: '--cui-fg-promo-hovered',
+        value: '#c768f3',
         type: 'color',
     },
     {
-        name: '--cui-border-warning-pressed',
-        value: '#b25c00',
+        name: '--cui-fg-promo-pressed',
+        value: '#ce72f8',
         type: 'color',
     },
     {
-        name: '--cui-fg-accent',
-        value: '#ffffff',
+        name: '--cui-fg-promo-disabled',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
+    /* Neutral borders */
     {
-        name: '--cui-fg-accent-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-border-normal',
+        value: 'rgba(223, 232, 241, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-accent-hovered',
-        value: '#000000',
+        name: '--cui-border-normal-hovered',
+        value: 'rgba(223, 232, 241, 0.3500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-accent-pressed',
-        value: '#000000',
+        name: '--cui-border-normal-pressed',
+        value: 'rgba(223, 232, 241, 0.4500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-danger',
-        value: '#de331d',
+        name: '--cui-border-normal-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-danger-disabled',
-        value: 'rgba(222, 51, 29, 0.4000)',
+        name: '--cui-border-subtle',
+        value: 'rgba(223, 232, 241, 0.1500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-danger-hovered',
-        value: '#bd2c19',
+        name: '--cui-border-subtle-hovered',
+        value: 'rgba(223, 232, 241, 0.2000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-danger-pressed',
-        value: '#9e2415',
+        name: '--cui-border-subtle-pressed',
+        value: 'rgba(223, 232, 241, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-normal',
-        value: '#ffffff',
+        name: '--cui-border-subtle-disabled',
+        value: 'rgba(216, 232, 248, 0.1000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-normal-disabled',
-        value: 'rgba(15, 19, 26, 0.4000)',
+        name: '--cui-border-divider',
+        value: 'rgba(216, 232, 248, 0.3000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-normal-hovered',
-        value: '#0f131a',
+        name: '--cui-border-divider-hovered',
+        value: 'rgba(223, 232, 241, 0.3500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-normal-pressed',
-        value: '#0f131a',
+        name: '--cui-border-divider-pressed',
+        value: 'rgba(223, 232, 241, 0.4500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong',
-        value: '#0f131a',
+        name: '--cui-border-divider-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-disabled',
-        value: 'rgba(255, 255, 255, 0.4000)',
+        name: '--cui-border-strong',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-hovered',
-        value: '#ffffff',
+        name: '--cui-border-strong-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-pressed',
-        value: '#ffffff',
+        name: '--cui-border-strong-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-subtle',
-        value: 'rgba(15, 19, 26, 0.7000)',
+        name: '--cui-border-strong-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Accent borders */
     {
-        name: '--cui-fg-on-strong-subtle-disabled',
-        value: 'rgba(255, 255, 255, 0.3000)',
+        name: '--cui-border-accent',
+        value: '#ffffff',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-subtle-hovered',
-        value: 'rgba(255, 255, 255, 0.8000)',
+        name: '--cui-border-accent-hovered',
+        value: '#f6f8f9',
         type: 'color',
     },
     {
-        name: '--cui-fg-on-strong-subtle-pressed',
-        value: 'rgba(255, 255, 255, 0.9000)',
+        name: '--cui-border-accent-pressed',
+        value: '#e3e7eb',
         type: 'color',
     },
     {
-        name: '--cui-fg-placeholder',
-        value: '#6e747a',
+        name: '--cui-border-accent-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Success borders */
     {
-        name: '--cui-fg-placeholder-disabled',
-        value: 'rgba(157, 167, 177, 0.4000)',
+        name: '--cui-border-success',
+        value: '#0cd368',
         type: 'color',
     },
     {
-        name: '--cui-fg-placeholder-hovered',
-        value: '#9da7b1',
+        name: '--cui-border-success-hovered',
+        value: '#13e072',
         type: 'color',
     },
     {
-        name: '--cui-fg-placeholder-pressed',
-        value: '#9da7b1',
+        name: '--cui-border-success-pressed',
+        value: '#25e980',
         type: 'color',
     },
     {
-        name: '--cui-fg-promo',
-        value: '#ae49de',
+        name: '--cui-border-success-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Warning borders */
     {
-        name: '--cui-fg-promo-disabled',
-        value: 'rgba(158, 51, 224, 0.4000)',
+        name: '--cui-border-warning',
+        value: '#f5b81c',
         type: 'color',
     },
     {
-        name: '--cui-fg-promo-hovered',
-        value: '#8a1ecc',
+        name: '--cui-border-warning-hovered',
+        value: '#f7c440',
         type: 'color',
     },
     {
-        name: '--cui-fg-promo-pressed',
-        value: '#7219a9',
+        name: '--cui-border-warning-pressed',
+        value: '#f7cb59',
         type: 'color',
     },
     {
-        name: '--cui-fg-subtle',
-        value: '#8f969d',
+        name: '--cui-border-warning-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Danger borders */
     {
-        name: '--cui-fg-subtle-disabled',
-        value: 'rgba(106, 115, 124, 0.4000)',
+        name: '--cui-border-danger',
+        value: '#ff4e37',
         type: 'color',
     },
     {
-        name: '--cui-fg-subtle-hovered',
-        value: '#33373e',
+        name: '--cui-border-danger-hovered',
+        value: '#ff5c47',
         type: 'color',
     },
     {
-        name: '--cui-fg-subtle-pressed',
-        value: '#0f131a',
+        name: '--cui-border-danger-pressed',
+        value: '#ff6a57',
         type: 'color',
     },
     {
-        name: '--cui-fg-success',
-        value: '#39c57a',
+        name: '--cui-border-danger-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Promo borders */
     {
-        name: '--cui-fg-success-disabled',
-        value: 'rgba(1, 136, 80, 0.4000)',
+        name: '--cui-border-promo',
+        value: '#c353f7',
         type: 'color',
     },
     {
-        name: '--cui-fg-success-hovered',
-        value: '#007a4e',
+        name: '--cui-border-promo-hovered',
+        value: '#c768f3',
         type: 'color',
     },
     {
-        name: '--cui-fg-success-pressed',
-        value: '#016c26',
+        name: '--cui-border-promo-pressed',
+        value: '#ce72f8',
         type: 'color',
     },
     {
-        name: '--cui-fg-warning',
-        value: '#f9d20a',
+        name: '--cui-border-promo-disabled',
+        value: 'rgba(216, 232, 248, 0.1500)',
         type: 'color',
     },
+    /* Special colors */
     {
-        name: '--cui-fg-warning-disabled',
-        value: 'rgba(226, 121, 0, 0.4000)',
+        name: '--cui-bg-overlay',
+        value: 'rgba(0, 0, 0, 0.7000)',
         type: 'color',
     },
     {
-        name: '--cui-fg-warning-hovered',
-        value: '#cc6d00',
+        name: '--cui-bg-elevated',
+        value: '#2f3438',
         type: 'color',
     },
     {
-        name: '--cui-fg-warning-pressed',
-        value: '#b25c00',
+        name: '--cui-border-focus',
+        value: '#ffffff',
         type: 'color',
     },
 ];

dist/es/types/index.d.ts

@@ -144,8 +144,8 @@ /**
 type ColorUsage = 'fg' | 'bg' | 'border';
-type ColorSentiment = 'normal' | 'subtle' | 'highlight' | 'accent' | 'placeholder' | 'promo' | 'divider' | 'success' | 'warning' | 'danger';
-type ColorVariant = 'strong' | 'on-strong';
+type ColorSentiment = 'accent' | 'promo' | 'success' | 'warning' | 'danger' | 'on-strong';
+type ColorVariant = 'normal' | 'subtle' | 'highlight' | 'strong' | 'placeholder' | 'elevated' | 'overlay' | 'divider' | 'focus';
 type ColorInteraction = 'hovered' | 'pressed' | 'disabled';
 interface ColorToken extends BaseToken {
     type: 'color';
-    name: `--cui-${ColorUsage}-${ColorSentiment}` | `--cui-${ColorUsage}-${ColorVariant}` | `--cui-${ColorUsage}-${ColorSentiment}-${ColorVariant | ColorInteraction}` | `--cui-${ColorUsage}-${ColorSentiment}-${ColorVariant}-${ColorInteraction}` | '--cui-bg-elevated' | '--cui-bg-overlay' | '--cui-border-focus' | `--cui-${ColorUsage}-${ColorVariant}-${ColorSentiment | ColorInteraction}` | `--cui-${ColorUsage}-${ColorVariant}-${ColorSentiment}-${ColorInteraction}`;
+    name: `--cui-${ColorUsage}-${ColorSentiment | ColorVariant}` | `--cui-${ColorUsage}-${ColorVariant}-${ColorInteraction}` | `--cui-${ColorUsage}-${ColorSentiment}-${ColorVariant | ColorInteraction}` | `--cui-${ColorUsage}-${ColorSentiment}-${ColorVariant}-${ColorInteraction}`;
     value: Color;
@@ -152,0 +152,0 @@ }

package.json

 {
   "name": "@sumup/design-tokens",
-  "version": "7.2.0-next.2",
+  "version": "7.2.0-next.3",
   "description": "Visual primitives such as typography, color, and spacing that are shared across platforms.",
@@ -5,0 +5,0 @@ "main": "dist/cjs/index.js",

No alert changes

Improved metrics

Total package byte prevSize

330390

increased by1.56%

Lines of code

11122

increased by0.34%

No dependency changes