Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@sumup/design-tokens

Package Overview
Dependencies
Maintainers
17
Versions
60
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@sumup/design-tokens - npm Package Compare versions

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

540

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";
})[];

559

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',
},
];

6

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 @@ }

540

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";
})[];

559

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',
},
];

6

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 @@ }

2

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",

dark-scoped.css

Sorry, the diff of this file is not supported yet

dark.css

Sorry, the diff of this file is not supported yet

dynamic.css

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc