aha-components 1.7.5 → 1.7.7

package/dist/tokens.d.ts

@@ -0,0 +1,1253 @@
+/**
+ * Aha Components — Design Tokens (TypeScript)
+ * Source: Untitled UI (Tokens Studio export), brand: Orange (#fb6011)
+ * Synced with tokens.json / theme.css
+ */
+export declare const colorBase: {
+    readonly white: "#ffffff";
+    readonly black: "#000000";
+};
+export declare const colorBrandScale: {
+    readonly 25: "#fff9f2";
+    readonly 50: "#fff6ed";
+    readonly 100: "#ffead5";
+    readonly 200: "#ffd1a9";
+    readonly 300: "#feb073";
+    readonly 400: "#fd843a";
+    readonly 500: "#fb6011";
+    readonly 600: "#ec470a";
+    readonly 700: "#c4330a";
+    readonly 800: "#9b2911";
+    readonly 900: "#7d2511";
+    readonly 950: "#441006";
+};
+export declare const colorErrorScale: {
+    readonly 25: "#fffbfa";
+    readonly 50: "#fef3f2";
+    readonly 100: "#fee4e2";
+    readonly 200: "#fecdca";
+    readonly 300: "#fda29b";
+    readonly 400: "#f97066";
+    readonly 500: "#f04438";
+    readonly 600: "#d92d20";
+    readonly 700: "#b42318";
+    readonly 800: "#912018";
+    readonly 900: "#7a271a";
+    readonly 950: "#55160c";
+};
+export declare const colorWarningScale: {
+    readonly 25: "#fffcf5";
+    readonly 50: "#fffaeb";
+    readonly 100: "#fef0c7";
+    readonly 200: "#fedf89";
+    readonly 300: "#fec84b";
+    readonly 400: "#fdb022";
+    readonly 500: "#f79009";
+    readonly 600: "#dc6803";
+    readonly 700: "#b54708";
+    readonly 800: "#93370d";
+    readonly 900: "#7a2e0e";
+    readonly 950: "#4e1d09";
+};
+export declare const colorSuccessScale: {
+    readonly 25: "#f6fef9";
+    readonly 50: "#ecfdf3";
+    readonly 100: "#dcfae6";
+    readonly 200: "#abefc6";
+    readonly 300: "#75e0a7";
+    readonly 400: "#47cd89";
+    readonly 500: "#17b26a";
+    readonly 600: "#079455";
+    readonly 700: "#067647";
+    readonly 800: "#085d3a";
+    readonly 900: "#074d31";
+    readonly 950: "#053321";
+};
+export declare const colorGray: {
+    readonly 25: "#fdfdfc";
+    readonly 50: "#fafaf9";
+    readonly 100: "#f5f5f4";
+    readonly 200: "#e7e5e4";
+    readonly 300: "#d7d3d0";
+    readonly 400: "#a9a29d";
+    readonly 500: "#79716b";
+    readonly 600: "#57534e";
+    readonly 700: "#44403c";
+    readonly 800: "#292524";
+    readonly 900: "#1c1917";
+    readonly 950: "#171412";
+};
+export declare const colorNeutral: {
+    readonly 25: "#fdfdfc";
+    readonly 50: "#fafaf9";
+    readonly 100: "#f5f5f4";
+    readonly 200: "#e7e5e4";
+    readonly 300: "#d7d3d0";
+    readonly 400: "#a9a29d";
+    readonly 500: "#79716b";
+    readonly 600: "#57534e";
+    readonly 700: "#44403c";
+    readonly 800: "#292524";
+    readonly 900: "#1c1917";
+    readonly 950: "#171412";
+};
+export declare const colorMoss: {
+    readonly 25: "#fafdf7";
+    readonly 50: "#f5fbee";
+    readonly 100: "#e6f4d7";
+    readonly 200: "#ceeab0";
+    readonly 300: "#acdc79";
+    readonly 400: "#86cb3c";
+    readonly 500: "#669f2a";
+    readonly 600: "#4f7a21";
+    readonly 700: "#3f621a";
+    readonly 800: "#335015";
+    readonly 900: "#2b4212";
+    readonly 950: "#1a280b";
+};
+export declare const colorGreenLight: {
+    readonly 25: "#fafef5";
+    readonly 50: "#f3fee7";
+    readonly 100: "#e3fbcc";
+    readonly 200: "#d0f8ab";
+    readonly 300: "#a6ef67";
+    readonly 400: "#85e13a";
+    readonly 500: "#66c61c";
+    readonly 600: "#4ca30d";
+    readonly 700: "#3b7c0f";
+    readonly 800: "#326212";
+    readonly 900: "#2b5314";
+    readonly 950: "#15290a";
+};
+export declare const colorGreen: {
+    readonly 25: "#f6fef9";
+    readonly 50: "#edfcf2";
+    readonly 100: "#d3f8df";
+    readonly 200: "#aaf0c4";
+    readonly 300: "#73e2a3";
+    readonly 400: "#3ccb7f";
+    readonly 500: "#16b364";
+    readonly 600: "#099250";
+    readonly 700: "#087443";
+    readonly 800: "#095c37";
+    readonly 900: "#084c2e";
+    readonly 950: "#052e1c";
+};
+export declare const colorTeal: {
+    readonly 25: "#f6fefc";
+    readonly 50: "#f0fdf9";
+    readonly 100: "#ccfbef";
+    readonly 200: "#99f6e0";
+    readonly 300: "#5fe9d0";
+    readonly 400: "#2ed3b7";
+    readonly 500: "#15b79e";
+    readonly 600: "#0e9384";
+    readonly 700: "#107569";
+    readonly 800: "#125d56";
+    readonly 900: "#134e48";
+    readonly 950: "#0a2926";
+};
+export declare const colorCyan: {
+    readonly 25: "#f5feff";
+    readonly 50: "#ecfdff";
+    readonly 100: "#cff9fe";
+    readonly 200: "#a5f0fc";
+    readonly 300: "#67e3f9";
+    readonly 400: "#22ccee";
+    readonly 500: "#06aed4";
+    readonly 600: "#088ab2";
+    readonly 700: "#0e7090";
+    readonly 800: "#155b75";
+    readonly 900: "#164c63";
+    readonly 950: "#0d2d3a";
+};
+export declare const colorBlueLight: {
+    readonly 25: "#f5fbff";
+    readonly 50: "#f0f9ff";
+    readonly 100: "#e0f2fe";
+    readonly 200: "#b9e6fe";
+    readonly 300: "#7cd4fd";
+    readonly 400: "#36bffa";
+    readonly 500: "#0ba5ec";
+    readonly 600: "#0086c9";
+    readonly 700: "#026aa2";
+    readonly 800: "#065986";
+    readonly 900: "#0b4a6f";
+    readonly 950: "#062c41";
+};
+export declare const colorBlue: {
+    readonly 25: "#f5faff";
+    readonly 50: "#eff8ff";
+    readonly 100: "#d1e9ff";
+    readonly 200: "#b2ddff";
+    readonly 300: "#84caff";
+    readonly 400: "#53b1fd";
+    readonly 500: "#2e90fa";
+    readonly 600: "#1570ef";
+    readonly 700: "#175cd3";
+    readonly 800: "#1849a9";
+    readonly 900: "#194185";
+    readonly 950: "#102a56";
+};
+export declare const colorBlueDark: {
+    readonly 25: "#f5f8ff";
+    readonly 50: "#eff4ff";
+    readonly 100: "#d1e0ff";
+    readonly 200: "#b2ccff";
+    readonly 300: "#84adff";
+    readonly 400: "#528bff";
+    readonly 500: "#2970ff";
+    readonly 600: "#155eef";
+    readonly 700: "#004eeb";
+    readonly 800: "#0040c1";
+    readonly 900: "#00359e";
+    readonly 950: "#002266";
+};
+export declare const colorIndigo: {
+    readonly 25: "#f5f8ff";
+    readonly 50: "#eef4ff";
+    readonly 100: "#e0eaff";
+    readonly 200: "#c7d7fe";
+    readonly 300: "#a4bcfd";
+    readonly 400: "#8098f9";
+    readonly 500: "#6172f3";
+    readonly 600: "#444ce7";
+    readonly 700: "#3538cd";
+    readonly 800: "#2d31a6";
+    readonly 900: "#2d3282";
+    readonly 950: "#1f235b";
+};
+export declare const colorViolet: {
+    readonly 25: "#fbfaff";
+    readonly 50: "#f5f3ff";
+    readonly 100: "#ece9fe";
+    readonly 200: "#ddd6fe";
+    readonly 300: "#c3b5fd";
+    readonly 400: "#a48afb";
+    readonly 500: "#875bf7";
+    readonly 600: "#7839ee";
+    readonly 700: "#6927da";
+    readonly 800: "#5720b7";
+    readonly 900: "#491c96";
+    readonly 950: "#2e125e";
+};
+export declare const colorPurple: {
+    readonly 25: "#fafaff";
+    readonly 50: "#f4f3ff";
+    readonly 100: "#ebe9fe";
+    readonly 200: "#d9d6fe";
+    readonly 300: "#bdb4fe";
+    readonly 400: "#9b8afb";
+    readonly 500: "#7a5af8";
+    readonly 600: "#6938ef";
+    readonly 700: "#5925dc";
+    readonly 800: "#4a1fb8";
+    readonly 900: "#3e1c96";
+    readonly 950: "#27115f";
+};
+export declare const colorFuchsia: {
+    readonly 25: "#fefaff";
+    readonly 50: "#fdf4ff";
+    readonly 100: "#fbe8ff";
+    readonly 200: "#f6d0fe";
+    readonly 300: "#eeaafd";
+    readonly 400: "#e478fa";
+    readonly 500: "#d444f1";
+    readonly 600: "#ba24d5";
+    readonly 700: "#9f1ab1";
+    readonly 800: "#821890";
+    readonly 900: "#6f1877";
+    readonly 950: "#47104c";
+};
+export declare const colorPink: {
+    readonly 25: "#fef6fb";
+    readonly 50: "#fdf2fa";
+    readonly 100: "#fce7f6";
+    readonly 200: "#fcceee";
+    readonly 300: "#faa7e0";
+    readonly 400: "#f670c7";
+    readonly 500: "#ee46bc";
+    readonly 600: "#dd2590";
+    readonly 700: "#c11574";
+    readonly 800: "#9e165f";
+    readonly 900: "#851651";
+    readonly 950: "#4e0d30";
+};
+export declare const colorRose: {
+    readonly 25: "#fff5f6";
+    readonly 50: "#fff1f3";
+    readonly 100: "#ffe4e8";
+    readonly 200: "#fecdd6";
+    readonly 300: "#fea3b4";
+    readonly 400: "#fd6f8e";
+    readonly 500: "#f63d68";
+    readonly 600: "#e31b54";
+    readonly 700: "#c01048";
+    readonly 800: "#a11043";
+    readonly 900: "#89123e";
+    readonly 950: "#510b24";
+};
+export declare const colorOrangeDark: {
+    readonly 25: "#fff9f5";
+    readonly 50: "#fff4ed";
+    readonly 100: "#ffe6d5";
+    readonly 200: "#ffd6ae";
+    readonly 300: "#ff9c66";
+    readonly 400: "#ff692e";
+    readonly 500: "#ff4405";
+    readonly 600: "#e62e05";
+    readonly 700: "#bc1b06";
+    readonly 800: "#97180c";
+    readonly 900: "#771a0d";
+    readonly 950: "#57130a";
+};
+export declare const colorOrange: {
+    readonly 25: "#fefaf5";
+    readonly 50: "#fef6ee";
+    readonly 100: "#fdead7";
+    readonly 200: "#f9dbaf";
+    readonly 300: "#f7b27a";
+    readonly 400: "#f38744";
+    readonly 500: "#ef6820";
+    readonly 600: "#e04f16";
+    readonly 700: "#b93815";
+    readonly 800: "#932f19";
+    readonly 900: "#772917";
+    readonly 950: "#511c10";
+};
+export declare const colorYellow: {
+    readonly 25: "#fefdf0";
+    readonly 50: "#fefbe8";
+    readonly 100: "#fef7c3";
+    readonly 200: "#feee95";
+    readonly 300: "#fde272";
+    readonly 400: "#fac515";
+    readonly 500: "#eaaa08";
+    readonly 600: "#ca8504";
+    readonly 700: "#a15c07";
+    readonly 800: "#854a0e";
+    readonly 900: "#713b12";
+    readonly 950: "#542c0d";
+};
+export declare const colorBrand: {
+    readonly primary: "#fb6011";
+    readonly hover: "#fd843a";
+    readonly pressed: "#ec470a";
+};
+export declare const colorSemantic: {
+    readonly success: {
+        readonly bg: "#ecfdf3";
+        readonly text: "#079455";
+        readonly border: "#abefc6";
+        readonly fill: "#17b26a";
+        readonly icon: "#079455";
+    };
+    readonly error: {
+        readonly bg: "#fef3f2";
+        readonly text: "#b42318";
+        readonly border: "#fecdca";
+        readonly strong: "#f04438";
+        readonly fill: "#d92d20";
+        readonly icon: "#f04438";
+    };
+    readonly warning: {
+        readonly bg: "#fffaeb";
+        readonly text: "#dc6803";
+        readonly border: "#fedf89";
+        readonly fill: "#fdb022";
+        readonly icon: "#dc6803";
+    };
+    readonly info: {
+        readonly bg: "#eff8ff";
+        readonly text: "#175cd3";
+        readonly border: "#b2ddff";
+        readonly fill: "#2e90fa";
+        readonly icon: "#1570ef";
+    };
+};
+export declare const colorDecorative: {
+    readonly Green: {
+        readonly bg: "#ecfdf3";
+        readonly text: "#067647";
+        readonly border: "#abefc6";
+        readonly fill: "#17b26a";
+        readonly icon: "#079455";
+    };
+    readonly Red: {
+        readonly bg: "#fef3f2";
+        readonly text: "#912018";
+        readonly border: "#fecdca";
+        readonly fill: "#f04438";
+        readonly icon: "#d92d20";
+    };
+    readonly Orange: {
+        readonly bg: "#fff6ed";
+        readonly text: "#9b2911";
+        readonly border: "#ffd1a9";
+        readonly fill: "#fb6011";
+        readonly icon: "#c4330a";
+    };
+    readonly Cyan: {
+        readonly bg: "#ecfdff";
+        readonly text: "#0e7090";
+        readonly border: "#a5f0fc";
+        readonly fill: "#06aed4";
+        readonly icon: "#088ab2";
+    };
+    readonly Violet: {
+        readonly bg: "#f5f3ff";
+        readonly text: "#6927da";
+        readonly border: "#ddd6fe";
+        readonly fill: "#875bf7";
+        readonly icon: "#7839ee";
+    };
+    readonly Pink: {
+        readonly bg: "#fdf2fa";
+        readonly text: "#c11574";
+        readonly border: "#fcceee";
+        readonly fill: "#ee46bc";
+        readonly icon: "#dd2590";
+    };
+    readonly Yellow: {
+        readonly bg: "#fffaeb";
+        readonly text: "#b54708";
+        readonly border: "#fedf89";
+        readonly fill: "#fdb022";
+        readonly icon: "#dc6803";
+    };
+    readonly Blue: {
+        readonly bg: "#eff8ff";
+        readonly text: "#175cd3";
+        readonly border: "#b2ddff";
+        readonly fill: "#2e90fa";
+        readonly icon: "#1570ef";
+    };
+    readonly Gray: {
+        readonly bg: "#f5f5f4";
+        readonly text: "#44403c";
+        readonly border: "#e7e5e4";
+        readonly fill: "#44403c";
+        readonly icon: "#57534e";
+    };
+};
+export type DecorativeColor = keyof typeof colorDecorative;
+export declare const semanticText: {
+    readonly primary: "#1c1917";
+    readonly secondary: "#44403c";
+    readonly tertiary: "#57534e";
+    readonly quaternary: "#79716b";
+    readonly disabled: "#79716b";
+    readonly placeholder: "#79716b";
+    readonly placeholderSubtle: "#d7d3d0";
+    readonly white: "#ffffff";
+    readonly brandPrimary: "#7d2511";
+    readonly brandSecondary: "#ec470a";
+    readonly brandTertiary: "#fb6011";
+    readonly errorPrimary: "#d92d20";
+    readonly warningPrimary: "#dc6803";
+    readonly successPrimary: "#079455";
+};
+export declare const semanticBorder: {
+    readonly primary: "#d7d3d0";
+    readonly secondary: "#e7e5e4";
+    readonly tertiary: "#f5f5f4";
+    readonly brand: "#fb6011";
+    readonly error: "#f04438";
+    readonly errorSubtle: "#fda29b";
+    readonly disabled: "#d7d3d0";
+    readonly disabledSubtle: "#e7e5e4";
+};
+export declare const semanticBg: {
+    readonly primary: "#ffffff";
+    readonly secondary: "#fafaf9";
+    readonly tertiary: "#f5f5f4";
+    readonly quaternary: "#e7e5e4";
+    readonly disabled: "#f5f5f4";
+    readonly disabledSubtle: "#fafaf9";
+    readonly overlay: "#171412";
+    readonly brandPrimary: "#fff6ed";
+    readonly brandSecondary: "#ffead5";
+    readonly brandSolid: "#fb6011";
+    readonly brandSolidHover: "#ec470a";
+    readonly errorPrimary: "#fef3f2";
+    readonly errorSolid: "#d92d20";
+    readonly warningPrimary: "#fffaeb";
+    readonly warningSolid: "#dc6803";
+    readonly successPrimary: "#ecfdf3";
+    readonly successSolid: "#079455";
+};
+export declare const semanticFg: {
+    readonly primary: "#1c1917";
+    readonly secondary: "#44403c";
+    readonly tertiary: "#57534e";
+    readonly quaternary: "#a9a29d";
+    readonly disabled: "#a9a29d";
+    readonly disabledSubtle: "#d7d3d0";
+    readonly white: "#ffffff";
+    readonly brandPrimary: "#fb6011";
+    readonly brandSecondary: "#fb6011";
+    readonly errorPrimary: "#d92d20";
+    readonly errorSecondary: "#f04438";
+    readonly warningPrimary: "#dc6803";
+    readonly warningSecondary: "#f79009";
+    readonly successPrimary: "#079455";
+    readonly successSecondary: "#17b26a";
+};
+export declare const typography: {
+    readonly fontFamily: {
+        readonly display: "\"DM Sans\", system-ui, -apple-system, sans-serif";
+        readonly body: "\"DM Sans\", system-ui, -apple-system, sans-serif";
+        readonly base: "\"DM Sans\", system-ui, -apple-system, sans-serif";
+    };
+    readonly fontSize: {
+        readonly xs: "12px";
+        readonly sm: "14px";
+        readonly base: "16px";
+        readonly md: "16px";
+        readonly lg: "18px";
+        readonly xl: "20px";
+        readonly displayXs: "24px";
+        readonly displaySm: "30px";
+        readonly displayMd: "36px";
+        readonly displayLg: "48px";
+        readonly displayXl: "60px";
+        readonly display2xl: "72px";
+    };
+    readonly fontWeight: {
+        readonly regular: 400;
+        readonly medium: 500;
+        readonly semibold: 600;
+        readonly bold: 700;
+    };
+    readonly lineHeight: {
+        readonly xs: "18px";
+        readonly sm: "20px";
+        readonly base: "24px";
+        readonly md: "24px";
+        readonly lg: "28px";
+        readonly xl: "30px";
+        readonly displayXs: "32px";
+        readonly displaySm: "38px";
+        readonly displayMd: "44px";
+        readonly displayLg: "60px";
+        readonly displayXl: "72px";
+        readonly display2xl: "90px";
+    };
+};
+export declare const spacing: {
+    readonly none: "0px";
+    readonly xxs: "2px";
+    readonly xs: "4px";
+    readonly sm: "6px";
+    readonly md: "8px";
+    readonly lg: "12px";
+    readonly xl: "16px";
+    readonly '2xl': "20px";
+    readonly '3xl': "24px";
+    readonly '4xl': "32px";
+    readonly '5xl': "40px";
+    readonly '6xl': "48px";
+    readonly '7xl': "64px";
+    readonly '8xl': "80px";
+    readonly '9xl': "96px";
+    readonly '10xl': "128px";
+    readonly '11xl': "160px";
+    readonly 0: "0px";
+    readonly 1: "4px";
+    readonly 2: "8px";
+    readonly 3: "12px";
+    readonly 4: "16px";
+    readonly 5: "20px";
+};
+export declare const radius: {
+    readonly none: "0px";
+    readonly xxs: "2px";
+    readonly xs: "4px";
+    readonly sm: "6px";
+    readonly md: "8px";
+    readonly lg: "10px";
+    readonly xl: "12px";
+    readonly '2xl': "16px";
+    readonly '3xl': "20px";
+    readonly '4xl': "24px";
+    readonly full: "9999px";
+};
+export declare const sizing: {
+    readonly tag: {
+        readonly sm: "20px";
+        readonly lg: "24px";
+    };
+    readonly field: {
+        readonly sm: "32px";
+        readonly ms: "36px";
+        readonly md: "40px";
+        readonly lg: "48px";
+    };
+    readonly icon: {
+        readonly sm: "14px";
+        readonly md: "16px";
+        readonly lg: "18px";
+        readonly xl: "20px";
+    };
+};
+export declare const border: {
+    readonly radius: {
+        readonly sm: "6px";
+        readonly md: "8px";
+        readonly lg: "10px";
+        readonly xl: "12px";
+        readonly full: "9999px";
+    };
+    readonly width: "1px";
+    readonly color: {
+        readonly default: "#e7e5e4";
+        readonly hover: "#d7d3d0";
+        readonly focus: "#fb6011";
+        readonly error: "#f04438";
+        readonly disabled: "#d7d3d0";
+    };
+};
+export declare const shadow: {
+    readonly xs: "0px 1px 2px 0px #0a0d120d";
+    readonly xsSkeuomorphic: "inset 0px 0px 0px 1px #0a0d122e, inset 0px -2px 0px 0px #0a0d120d, 0px 1px 2px 0px #0a0d120d";
+    readonly sm: "0px 1px 3px 0px #0a0d121a, 0px 1px 2px -1px #0a0d121a";
+    readonly md: "0px 4px 6px -1px #0a0d121a, 0px 2px 4px -2px #0a0d120f";
+    readonly lg: "0px 12px 16px -4px #0a0d1214, 0px 4px 6px -2px #0a0d1208, 0px 2px 2px -1px #0a0d120a";
+    readonly xl: "0px 20px 24px -4px #0a0d1214, 0px 8px 8px -4px #0a0d1208, 0px 3px 3px -1.5px #0a0d120a";
+    readonly '2xl': "0px 24px 48px -12px #0a0d122e, 0px 4px 4px -2px #0a0d120a";
+    readonly '3xl': "0px 32px 64px -12px #0a0d1224, 0px 5px 5px -2.5px #0a0d120a";
+};
+export declare const focusRing: {
+    readonly default: "0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-brand-500)";
+    readonly shadowXs: "0px 1px 2px 0px #0a0d120d, 0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-brand-500)";
+    readonly shadowXsSkeuomorphic: "inset 0px 0px 0px 1px #0a0d122e, inset 0px -2px 0px 0px #0a0d120d, 0px 1px 2px 0px #0a0d120d, 0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-brand-500)";
+    readonly shadowSm: "0px 1px 3px 0px #0a0d121a, 0px 1px 2px 0px #0a0d121a, 0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-brand-500)";
+    readonly error: "0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-error-500)";
+    readonly errorShadowXs: "0px 1px 2px 0px #0a0d120d, 0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-error-500)";
+};
+export declare const backdropBlur: {
+    readonly sm: "blur(8px)";
+    readonly md: "blur(16px)";
+    readonly lg: "blur(24px)";
+    readonly xl: "blur(40px)";
+};
+export declare const motion: {
+    readonly duration: {
+        readonly base: "0.2s";
+    };
+    readonly easing: {
+        readonly base: "ease";
+    };
+    readonly transition: {
+        readonly base: "all 0.2s ease";
+    };
+};
+declare const tokens: {
+    readonly color: {
+        readonly base: {
+            readonly white: "#ffffff";
+            readonly black: "#000000";
+        };
+        readonly brand: {
+            readonly 25: "#fff9f2";
+            readonly 50: "#fff6ed";
+            readonly 100: "#ffead5";
+            readonly 200: "#ffd1a9";
+            readonly 300: "#feb073";
+            readonly 400: "#fd843a";
+            readonly 500: "#fb6011";
+            readonly 600: "#ec470a";
+            readonly 700: "#c4330a";
+            readonly 800: "#9b2911";
+            readonly 900: "#7d2511";
+            readonly 950: "#441006";
+        };
+        readonly error: {
+            readonly 25: "#fffbfa";
+            readonly 50: "#fef3f2";
+            readonly 100: "#fee4e2";
+            readonly 200: "#fecdca";
+            readonly 300: "#fda29b";
+            readonly 400: "#f97066";
+            readonly 500: "#f04438";
+            readonly 600: "#d92d20";
+            readonly 700: "#b42318";
+            readonly 800: "#912018";
+            readonly 900: "#7a271a";
+            readonly 950: "#55160c";
+        };
+        readonly warning: {
+            readonly 25: "#fffcf5";
+            readonly 50: "#fffaeb";
+            readonly 100: "#fef0c7";
+            readonly 200: "#fedf89";
+            readonly 300: "#fec84b";
+            readonly 400: "#fdb022";
+            readonly 500: "#f79009";
+            readonly 600: "#dc6803";
+            readonly 700: "#b54708";
+            readonly 800: "#93370d";
+            readonly 900: "#7a2e0e";
+            readonly 950: "#4e1d09";
+        };
+        readonly success: {
+            readonly 25: "#f6fef9";
+            readonly 50: "#ecfdf3";
+            readonly 100: "#dcfae6";
+            readonly 200: "#abefc6";
+            readonly 300: "#75e0a7";
+            readonly 400: "#47cd89";
+            readonly 500: "#17b26a";
+            readonly 600: "#079455";
+            readonly 700: "#067647";
+            readonly 800: "#085d3a";
+            readonly 900: "#074d31";
+            readonly 950: "#053321";
+        };
+        readonly gray: {
+            readonly 25: "#fdfdfc";
+            readonly 50: "#fafaf9";
+            readonly 100: "#f5f5f4";
+            readonly 200: "#e7e5e4";
+            readonly 300: "#d7d3d0";
+            readonly 400: "#a9a29d";
+            readonly 500: "#79716b";
+            readonly 600: "#57534e";
+            readonly 700: "#44403c";
+            readonly 800: "#292524";
+            readonly 900: "#1c1917";
+            readonly 950: "#171412";
+        };
+        readonly moss: {
+            readonly 25: "#fafdf7";
+            readonly 50: "#f5fbee";
+            readonly 100: "#e6f4d7";
+            readonly 200: "#ceeab0";
+            readonly 300: "#acdc79";
+            readonly 400: "#86cb3c";
+            readonly 500: "#669f2a";
+            readonly 600: "#4f7a21";
+            readonly 700: "#3f621a";
+            readonly 800: "#335015";
+            readonly 900: "#2b4212";
+            readonly 950: "#1a280b";
+        };
+        readonly greenLight: {
+            readonly 25: "#fafef5";
+            readonly 50: "#f3fee7";
+            readonly 100: "#e3fbcc";
+            readonly 200: "#d0f8ab";
+            readonly 300: "#a6ef67";
+            readonly 400: "#85e13a";
+            readonly 500: "#66c61c";
+            readonly 600: "#4ca30d";
+            readonly 700: "#3b7c0f";
+            readonly 800: "#326212";
+            readonly 900: "#2b5314";
+            readonly 950: "#15290a";
+        };
+        readonly green: {
+            readonly 25: "#f6fef9";
+            readonly 50: "#edfcf2";
+            readonly 100: "#d3f8df";
+            readonly 200: "#aaf0c4";
+            readonly 300: "#73e2a3";
+            readonly 400: "#3ccb7f";
+            readonly 500: "#16b364";
+            readonly 600: "#099250";
+            readonly 700: "#087443";
+            readonly 800: "#095c37";
+            readonly 900: "#084c2e";
+            readonly 950: "#052e1c";
+        };
+        readonly teal: {
+            readonly 25: "#f6fefc";
+            readonly 50: "#f0fdf9";
+            readonly 100: "#ccfbef";
+            readonly 200: "#99f6e0";
+            readonly 300: "#5fe9d0";
+            readonly 400: "#2ed3b7";
+            readonly 500: "#15b79e";
+            readonly 600: "#0e9384";
+            readonly 700: "#107569";
+            readonly 800: "#125d56";
+            readonly 900: "#134e48";
+            readonly 950: "#0a2926";
+        };
+        readonly cyan: {
+            readonly 25: "#f5feff";
+            readonly 50: "#ecfdff";
+            readonly 100: "#cff9fe";
+            readonly 200: "#a5f0fc";
+            readonly 300: "#67e3f9";
+            readonly 400: "#22ccee";
+            readonly 500: "#06aed4";
+            readonly 600: "#088ab2";
+            readonly 700: "#0e7090";
+            readonly 800: "#155b75";
+            readonly 900: "#164c63";
+            readonly 950: "#0d2d3a";
+        };
+        readonly blueLight: {
+            readonly 25: "#f5fbff";
+            readonly 50: "#f0f9ff";
+            readonly 100: "#e0f2fe";
+            readonly 200: "#b9e6fe";
+            readonly 300: "#7cd4fd";
+            readonly 400: "#36bffa";
+            readonly 500: "#0ba5ec";
+            readonly 600: "#0086c9";
+            readonly 700: "#026aa2";
+            readonly 800: "#065986";
+            readonly 900: "#0b4a6f";
+            readonly 950: "#062c41";
+        };
+        readonly blue: {
+            readonly 25: "#f5faff";
+            readonly 50: "#eff8ff";
+            readonly 100: "#d1e9ff";
+            readonly 200: "#b2ddff";
+            readonly 300: "#84caff";
+            readonly 400: "#53b1fd";
+            readonly 500: "#2e90fa";
+            readonly 600: "#1570ef";
+            readonly 700: "#175cd3";
+            readonly 800: "#1849a9";
+            readonly 900: "#194185";
+            readonly 950: "#102a56";
+        };
+        readonly blueDark: {
+            readonly 25: "#f5f8ff";
+            readonly 50: "#eff4ff";
+            readonly 100: "#d1e0ff";
+            readonly 200: "#b2ccff";
+            readonly 300: "#84adff";
+            readonly 400: "#528bff";
+            readonly 500: "#2970ff";
+            readonly 600: "#155eef";
+            readonly 700: "#004eeb";
+            readonly 800: "#0040c1";
+            readonly 900: "#00359e";
+            readonly 950: "#002266";
+        };
+        readonly indigo: {
+            readonly 25: "#f5f8ff";
+            readonly 50: "#eef4ff";
+            readonly 100: "#e0eaff";
+            readonly 200: "#c7d7fe";
+            readonly 300: "#a4bcfd";
+            readonly 400: "#8098f9";
+            readonly 500: "#6172f3";
+            readonly 600: "#444ce7";
+            readonly 700: "#3538cd";
+            readonly 800: "#2d31a6";
+            readonly 900: "#2d3282";
+            readonly 950: "#1f235b";
+        };
+        readonly violet: {
+            readonly 25: "#fbfaff";
+            readonly 50: "#f5f3ff";
+            readonly 100: "#ece9fe";
+            readonly 200: "#ddd6fe";
+            readonly 300: "#c3b5fd";
+            readonly 400: "#a48afb";
+            readonly 500: "#875bf7";
+            readonly 600: "#7839ee";
+            readonly 700: "#6927da";
+            readonly 800: "#5720b7";
+            readonly 900: "#491c96";
+            readonly 950: "#2e125e";
+        };
+        readonly purple: {
+            readonly 25: "#fafaff";
+            readonly 50: "#f4f3ff";
+            readonly 100: "#ebe9fe";
+            readonly 200: "#d9d6fe";
+            readonly 300: "#bdb4fe";
+            readonly 400: "#9b8afb";
+            readonly 500: "#7a5af8";
+            readonly 600: "#6938ef";
+            readonly 700: "#5925dc";
+            readonly 800: "#4a1fb8";
+            readonly 900: "#3e1c96";
+            readonly 950: "#27115f";
+        };
+        readonly fuchsia: {
+            readonly 25: "#fefaff";
+            readonly 50: "#fdf4ff";
+            readonly 100: "#fbe8ff";
+            readonly 200: "#f6d0fe";
+            readonly 300: "#eeaafd";
+            readonly 400: "#e478fa";
+            readonly 500: "#d444f1";
+            readonly 600: "#ba24d5";
+            readonly 700: "#9f1ab1";
+            readonly 800: "#821890";
+            readonly 900: "#6f1877";
+            readonly 950: "#47104c";
+        };
+        readonly pink: {
+            readonly 25: "#fef6fb";
+            readonly 50: "#fdf2fa";
+            readonly 100: "#fce7f6";
+            readonly 200: "#fcceee";
+            readonly 300: "#faa7e0";
+            readonly 400: "#f670c7";
+            readonly 500: "#ee46bc";
+            readonly 600: "#dd2590";
+            readonly 700: "#c11574";
+            readonly 800: "#9e165f";
+            readonly 900: "#851651";
+            readonly 950: "#4e0d30";
+        };
+        readonly rose: {
+            readonly 25: "#fff5f6";
+            readonly 50: "#fff1f3";
+            readonly 100: "#ffe4e8";
+            readonly 200: "#fecdd6";
+            readonly 300: "#fea3b4";
+            readonly 400: "#fd6f8e";
+            readonly 500: "#f63d68";
+            readonly 600: "#e31b54";
+            readonly 700: "#c01048";
+            readonly 800: "#a11043";
+            readonly 900: "#89123e";
+            readonly 950: "#510b24";
+        };
+        readonly orangeDark: {
+            readonly 25: "#fff9f5";
+            readonly 50: "#fff4ed";
+            readonly 100: "#ffe6d5";
+            readonly 200: "#ffd6ae";
+            readonly 300: "#ff9c66";
+            readonly 400: "#ff692e";
+            readonly 500: "#ff4405";
+            readonly 600: "#e62e05";
+            readonly 700: "#bc1b06";
+            readonly 800: "#97180c";
+            readonly 900: "#771a0d";
+            readonly 950: "#57130a";
+        };
+        readonly orange: {
+            readonly 25: "#fefaf5";
+            readonly 50: "#fef6ee";
+            readonly 100: "#fdead7";
+            readonly 200: "#f9dbaf";
+            readonly 300: "#f7b27a";
+            readonly 400: "#f38744";
+            readonly 500: "#ef6820";
+            readonly 600: "#e04f16";
+            readonly 700: "#b93815";
+            readonly 800: "#932f19";
+            readonly 900: "#772917";
+            readonly 950: "#511c10";
+        };
+        readonly yellow: {
+            readonly 25: "#fefdf0";
+            readonly 50: "#fefbe8";
+            readonly 100: "#fef7c3";
+            readonly 200: "#feee95";
+            readonly 300: "#fde272";
+            readonly 400: "#fac515";
+            readonly 500: "#eaaa08";
+            readonly 600: "#ca8504";
+            readonly 700: "#a15c07";
+            readonly 800: "#854a0e";
+            readonly 900: "#713b12";
+            readonly 950: "#542c0d";
+        };
+        readonly semantic: {
+            readonly text: {
+                readonly primary: "#1c1917";
+                readonly secondary: "#44403c";
+                readonly tertiary: "#57534e";
+                readonly quaternary: "#79716b";
+                readonly disabled: "#79716b";
+                readonly placeholder: "#79716b";
+                readonly placeholderSubtle: "#d7d3d0";
+                readonly white: "#ffffff";
+                readonly brandPrimary: "#7d2511";
+                readonly brandSecondary: "#ec470a";
+                readonly brandTertiary: "#fb6011";
+                readonly errorPrimary: "#d92d20";
+                readonly warningPrimary: "#dc6803";
+                readonly successPrimary: "#079455";
+            };
+            readonly border: {
+                readonly primary: "#d7d3d0";
+                readonly secondary: "#e7e5e4";
+                readonly tertiary: "#f5f5f4";
+                readonly brand: "#fb6011";
+                readonly error: "#f04438";
+                readonly errorSubtle: "#fda29b";
+                readonly disabled: "#d7d3d0";
+                readonly disabledSubtle: "#e7e5e4";
+            };
+            readonly bg: {
+                readonly primary: "#ffffff";
+                readonly secondary: "#fafaf9";
+                readonly tertiary: "#f5f5f4";
+                readonly quaternary: "#e7e5e4";
+                readonly disabled: "#f5f5f4";
+                readonly disabledSubtle: "#fafaf9";
+                readonly overlay: "#171412";
+                readonly brandPrimary: "#fff6ed";
+                readonly brandSecondary: "#ffead5";
+                readonly brandSolid: "#fb6011";
+                readonly brandSolidHover: "#ec470a";
+                readonly errorPrimary: "#fef3f2";
+                readonly errorSolid: "#d92d20";
+                readonly warningPrimary: "#fffaeb";
+                readonly warningSolid: "#dc6803";
+                readonly successPrimary: "#ecfdf3";
+                readonly successSolid: "#079455";
+            };
+            readonly fg: {
+                readonly primary: "#1c1917";
+                readonly secondary: "#44403c";
+                readonly tertiary: "#57534e";
+                readonly quaternary: "#a9a29d";
+                readonly disabled: "#a9a29d";
+                readonly disabledSubtle: "#d7d3d0";
+                readonly white: "#ffffff";
+                readonly brandPrimary: "#fb6011";
+                readonly brandSecondary: "#fb6011";
+                readonly errorPrimary: "#d92d20";
+                readonly errorSecondary: "#f04438";
+                readonly warningPrimary: "#dc6803";
+                readonly warningSecondary: "#f79009";
+                readonly successPrimary: "#079455";
+                readonly successSecondary: "#17b26a";
+            };
+        };
+        readonly neutral: {
+            readonly 25: "#fdfdfc";
+            readonly 50: "#fafaf9";
+            readonly 100: "#f5f5f4";
+            readonly 200: "#e7e5e4";
+            readonly 300: "#d7d3d0";
+            readonly 400: "#a9a29d";
+            readonly 500: "#79716b";
+            readonly 600: "#57534e";
+            readonly 700: "#44403c";
+            readonly 800: "#292524";
+            readonly 900: "#1c1917";
+            readonly 950: "#171412";
+        };
+        readonly decorative: {
+            readonly Green: {
+                readonly bg: "#ecfdf3";
+                readonly text: "#067647";
+                readonly border: "#abefc6";
+                readonly fill: "#17b26a";
+                readonly icon: "#079455";
+            };
+            readonly Red: {
+                readonly bg: "#fef3f2";
+                readonly text: "#912018";
+                readonly border: "#fecdca";
+                readonly fill: "#f04438";
+                readonly icon: "#d92d20";
+            };
+            readonly Orange: {
+                readonly bg: "#fff6ed";
+                readonly text: "#9b2911";
+                readonly border: "#ffd1a9";
+                readonly fill: "#fb6011";
+                readonly icon: "#c4330a";
+            };
+            readonly Cyan: {
+                readonly bg: "#ecfdff";
+                readonly text: "#0e7090";
+                readonly border: "#a5f0fc";
+                readonly fill: "#06aed4";
+                readonly icon: "#088ab2";
+            };
+            readonly Violet: {
+                readonly bg: "#f5f3ff";
+                readonly text: "#6927da";
+                readonly border: "#ddd6fe";
+                readonly fill: "#875bf7";
+                readonly icon: "#7839ee";
+            };
+            readonly Pink: {
+                readonly bg: "#fdf2fa";
+                readonly text: "#c11574";
+                readonly border: "#fcceee";
+                readonly fill: "#ee46bc";
+                readonly icon: "#dd2590";
+            };
+            readonly Yellow: {
+                readonly bg: "#fffaeb";
+                readonly text: "#b54708";
+                readonly border: "#fedf89";
+                readonly fill: "#fdb022";
+                readonly icon: "#dc6803";
+            };
+            readonly Blue: {
+                readonly bg: "#eff8ff";
+                readonly text: "#175cd3";
+                readonly border: "#b2ddff";
+                readonly fill: "#2e90fa";
+                readonly icon: "#1570ef";
+            };
+            readonly Gray: {
+                readonly bg: "#f5f5f4";
+                readonly text: "#44403c";
+                readonly border: "#e7e5e4";
+                readonly fill: "#44403c";
+                readonly icon: "#57534e";
+            };
+        };
+    };
+    readonly typography: {
+        readonly fontFamily: {
+            readonly display: "\"DM Sans\", system-ui, -apple-system, sans-serif";
+            readonly body: "\"DM Sans\", system-ui, -apple-system, sans-serif";
+            readonly base: "\"DM Sans\", system-ui, -apple-system, sans-serif";
+        };
+        readonly fontSize: {
+            readonly xs: "12px";
+            readonly sm: "14px";
+            readonly base: "16px";
+            readonly md: "16px";
+            readonly lg: "18px";
+            readonly xl: "20px";
+            readonly displayXs: "24px";
+            readonly displaySm: "30px";
+            readonly displayMd: "36px";
+            readonly displayLg: "48px";
+            readonly displayXl: "60px";
+            readonly display2xl: "72px";
+        };
+        readonly fontWeight: {
+            readonly regular: 400;
+            readonly medium: 500;
+            readonly semibold: 600;
+            readonly bold: 700;
+        };
+        readonly lineHeight: {
+            readonly xs: "18px";
+            readonly sm: "20px";
+            readonly base: "24px";
+            readonly md: "24px";
+            readonly lg: "28px";
+            readonly xl: "30px";
+            readonly displayXs: "32px";
+            readonly displaySm: "38px";
+            readonly displayMd: "44px";
+            readonly displayLg: "60px";
+            readonly displayXl: "72px";
+            readonly display2xl: "90px";
+        };
+    };
+    readonly spacing: {
+        readonly none: "0px";
+        readonly xxs: "2px";
+        readonly xs: "4px";
+        readonly sm: "6px";
+        readonly md: "8px";
+        readonly lg: "12px";
+        readonly xl: "16px";
+        readonly '2xl': "20px";
+        readonly '3xl': "24px";
+        readonly '4xl': "32px";
+        readonly '5xl': "40px";
+        readonly '6xl': "48px";
+        readonly '7xl': "64px";
+        readonly '8xl': "80px";
+        readonly '9xl': "96px";
+        readonly '10xl': "128px";
+        readonly '11xl': "160px";
+        readonly 0: "0px";
+        readonly 1: "4px";
+        readonly 2: "8px";
+        readonly 3: "12px";
+        readonly 4: "16px";
+        readonly 5: "20px";
+    };
+    readonly radius: {
+        readonly none: "0px";
+        readonly xxs: "2px";
+        readonly xs: "4px";
+        readonly sm: "6px";
+        readonly md: "8px";
+        readonly lg: "10px";
+        readonly xl: "12px";
+        readonly '2xl': "16px";
+        readonly '3xl': "20px";
+        readonly '4xl': "24px";
+        readonly full: "9999px";
+    };
+    readonly sizing: {
+        readonly tag: {
+            readonly sm: "20px";
+            readonly lg: "24px";
+        };
+        readonly field: {
+            readonly sm: "32px";
+            readonly ms: "36px";
+            readonly md: "40px";
+            readonly lg: "48px";
+        };
+        readonly icon: {
+            readonly sm: "14px";
+            readonly md: "16px";
+            readonly lg: "18px";
+            readonly xl: "20px";
+        };
+    };
+    readonly border: {
+        readonly radius: {
+            readonly sm: "6px";
+            readonly md: "8px";
+            readonly lg: "10px";
+            readonly xl: "12px";
+            readonly full: "9999px";
+        };
+        readonly width: "1px";
+        readonly color: {
+            readonly default: "#e7e5e4";
+            readonly hover: "#d7d3d0";
+            readonly focus: "#fb6011";
+            readonly error: "#f04438";
+            readonly disabled: "#d7d3d0";
+        };
+    };
+    readonly shadow: {
+        readonly xs: "0px 1px 2px 0px #0a0d120d";
+        readonly xsSkeuomorphic: "inset 0px 0px 0px 1px #0a0d122e, inset 0px -2px 0px 0px #0a0d120d, 0px 1px 2px 0px #0a0d120d";
+        readonly sm: "0px 1px 3px 0px #0a0d121a, 0px 1px 2px -1px #0a0d121a";
+        readonly md: "0px 4px 6px -1px #0a0d121a, 0px 2px 4px -2px #0a0d120f";
+        readonly lg: "0px 12px 16px -4px #0a0d1214, 0px 4px 6px -2px #0a0d1208, 0px 2px 2px -1px #0a0d120a";
+        readonly xl: "0px 20px 24px -4px #0a0d1214, 0px 8px 8px -4px #0a0d1208, 0px 3px 3px -1.5px #0a0d120a";
+        readonly '2xl': "0px 24px 48px -12px #0a0d122e, 0px 4px 4px -2px #0a0d120a";
+        readonly '3xl': "0px 32px 64px -12px #0a0d1224, 0px 5px 5px -2.5px #0a0d120a";
+    };
+    readonly focusRing: {
+        readonly default: "0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-brand-500)";
+        readonly shadowXs: "0px 1px 2px 0px #0a0d120d, 0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-brand-500)";
+        readonly shadowXsSkeuomorphic: "inset 0px 0px 0px 1px #0a0d122e, inset 0px -2px 0px 0px #0a0d120d, 0px 1px 2px 0px #0a0d120d, 0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-brand-500)";
+        readonly shadowSm: "0px 1px 3px 0px #0a0d121a, 0px 1px 2px 0px #0a0d121a, 0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-brand-500)";
+        readonly error: "0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-error-500)";
+        readonly errorShadowXs: "0px 1px 2px 0px #0a0d120d, 0px 0px 0px 2px #ffffff, 0px 0px 0px 4px var(--color-error-500)";
+    };
+    readonly backdropBlur: {
+        readonly sm: "blur(8px)";
+        readonly md: "blur(16px)";
+        readonly lg: "blur(24px)";
+        readonly xl: "blur(40px)";
+    };
+    readonly motion: {
+        readonly duration: {
+            readonly base: "0.2s";
+        };
+        readonly easing: {
+            readonly base: "ease";
+        };
+        readonly transition: {
+            readonly base: "all 0.2s ease";
+        };
+    };
+};
+export default tokens;