@splunk/themes 0.23.0 → 1.0.0-beta.2

package/types/design-tokens/colors.d.ts

@@ -0,0 +1,875 @@
+/**
+ * #### Action colors
+ *
+ * Action colors are used **exclusively** for Button borders and backgrounds.
+ * They define interaction states for primary, secondary, subtle, and destructive buttons.
+ *
+ * @categoryColor
+ */
+declare const actionColors: {
+    /**
+     * Default background for Primary Buttons.
+     */
+    actionColorBackgroundPrimary: string;
+    /**
+     * Active (pressed) background for Primary Buttons.
+     */
+    actionColorBackgroundPrimaryActive: string;
+    /**
+     * Disabled background for Primary Buttons.
+     */
+    actionColorBackgroundPrimaryDisabled: string;
+    /**
+     * Hover background for Primary Buttons.
+     */
+    actionColorBackgroundPrimaryHover: string;
+    /**
+     * Default background for Secondary Buttons.
+     */
+    actionColorBackgroundSecondary: string;
+    /**
+     * Active (pressed) background for Secondary Buttons.
+     */
+    actionColorBackgroundSecondaryActive: string;
+    /**
+     * Disabled background for Secondary Buttons.
+     */
+    actionColorBackgroundSecondaryDisabled: string;
+    /**
+     * Hover background for Secondary Buttons.
+     */
+    actionColorBackgroundSecondaryHover: string;
+    /**
+     * Default background for Subtle Buttons.
+     */
+    actionColorBackgroundSubtle: string;
+    /**
+     * Active (pressed) background for Subtle Buttons.
+     */
+    actionColorBackgroundSubtleActive: string;
+    /**
+     * Disabled background for Subtle Buttons.
+     */
+    actionColorBackgroundSubtleDisabled: string;
+    /**
+     * Hover background for Subtle Buttons.
+     */
+    actionColorBackgroundSubtleHover: string;
+    /**
+     * Default background for Destructive Buttons.
+     */
+    actionColorBackgroundDestructive: string;
+    /**
+     * Active (pressed) background for Destructive Buttons.
+     */
+    actionColorBackgroundDestructiveActive: string;
+    /**
+     * Disabled background for Destructive Buttons.
+     */
+    actionColorBackgroundDestructiveDisabled: string;
+    /**
+     * Hover background for Destructive Buttons.
+     */
+    actionColorBackgroundDestructiveHover: string;
+    /**
+     * Default background for Destructive Secondary Buttons.
+     */
+    actionColorBackgroundDestructiveSecondary: string;
+    /**
+     * Active (pressed) background for Destructive Secondary Buttons
+     */
+    actionColorBackgroundDestructiveSecondaryActive: string;
+    /**
+     * Disabled background for Destructive Secondary Buttons.
+     */
+    actionColorBackgroundDestructiveSecondaryDisabled: string;
+    /**
+     * Hover background for Destructive Secondary Buttons.
+     */
+    actionColorBackgroundDestructiveSecondaryHover: string;
+    /**
+     * Default border color for Secondary Buttons.
+     */
+    actionColorBorderSecondary: string;
+    /**
+     * Active (pressed) border color for Secondary Buttons.
+     */
+    actionColorBorderSecondaryActive: string;
+    /**
+     * Disabled border color for Secondary Buttons.
+     */
+    actionColorBorderSecondaryDisabled: string;
+    /**
+     * Hover border color for Secondary Buttons.
+     */
+    actionColorBorderSecondaryHover: string;
+    /**
+     * Default border color for Destructive Secondary Buttons.
+     */
+    actionColorBorderDestructiveSecondary: string;
+    /**
+     * Active (pressed) border color for Destructive Secondary Buttons.
+     */
+    actionColorBorderDestructiveSecondaryActive: string;
+    /**
+     * Disabled border color for Destructive Secondary Buttons.
+     */
+    actionColorBorderDestructiveSecondaryDisabled: string;
+    /**
+     * Hover border color for Destructive Secondary Buttons.
+     */
+    actionColorBorderDestructiveSecondaryHover: string;
+};
+/**
+ * #### Interactive colors
+ *
+ * Interactive colors should be used **exclusively** for styling Data Entry components: Input, Select, etc.
+ *
+ * @categoryColor
+ */
+declare const interactiveColors: {
+    /**
+     * Primary color for interactive elements in Data entry components.
+     */
+    interactiveColorPrimary: string;
+    /**
+     * Default border color for Data entry components.
+     */
+    interactiveColorBorder: string;
+    /**
+     * Active (pressed) border color for Data entry components.
+     */
+    interactiveColorBorderActive: string;
+    /**
+     * Hover border color for Data entry components.
+     */
+    interactiveColorBorderHover: string;
+    /**
+     * Disabled border color for Data entry components.
+     */
+    interactiveColorBorderDisabled: string;
+    /**
+     * Background overlay color for selected in Data entry components.
+     */
+    interactiveColorOverlaySelected: string;
+    /**
+     * Background overlay color for hover in Data entry components.
+     */
+    interactiveColorOverlayHover: string;
+    /**
+     * Background overlay color for active (pressed) in Data entry components.
+     */
+    interactiveColorOverlayActive: string;
+    /**
+     * Background overlay color for drag in Data entry components.
+     */
+    interactiveColorOverlayDrag: string;
+    /**
+     * Default background color for Data entry components.
+     */
+    interactiveColorBackground: string;
+    /**
+     * Background color for disabled Data entry components.
+     */
+    interactiveColorBackgroundDisabled: string;
+    /**
+     * Brand accent color for Data entry components.
+     */
+    interactiveColorAccent: string;
+    /**
+     * Error color for Data entry components.
+     */
+    interactiveColorAccentError: string;
+    /**
+     * Stronger error color for emphasis in Data Entry components. Used for hover interaction.
+     */
+    interactiveColorAccentErrorStrong: string;
+};
+/**
+ * #### Neutral colors
+ *
+ * Neutral colors should be used sparingly. Prefer to use more semantic tokens for backgrounds and borders.
+ * These colors must not be used for content as they will not pass the required contrast ratio (instead, use [Content colors](#Content Colors)).
+ *
+ * @categoryColor
+ */
+declare const neutralColors: {
+    /**
+     * Alternate background color in dark color schemes and inverted background in light color schemes.
+     */
+    black: string;
+    /**
+     * Least visually emphasized. Do not use this as the background for Data Entry components, does not pass 3:1 graphical contrast.
+     */
+    neutral100: string;
+    /**
+     * Not for text, does not pass 3:1 graphical contrast in light & dark color schemes.
+     */
+    neutral200: string;
+    /**
+     * Not for text, does not pass 3:1 graphical contrast in light & dark color schemes.
+     */
+    neutral300: string;
+    /**
+     * Not for text, does not pass 3:1 graphical contrast in light color schemes.
+     */
+    neutral400: string;
+    /**
+     * Most visually emphasized, not for text, does not pass 3:1 graphical contrast in light color schemes.
+     */
+    neutral500: string;
+    /**
+     * Alternate background color in light color schemes and inverted background in dark color schemes.
+     */
+    white: string;
+    /**
+     * Transparent background color.
+     */
+    transparent: string;
+};
+/**
+ * #### Background colors
+ * Use background colors for page backgrounds and containers such as cards, modals, panels or popups.
+ *
+ * @categoryColor
+ */
+declare const backgroundColors: {
+    /**
+     * Default background color for the navigation headers.
+     */
+    backgroundColorNavigation: string;
+    /**
+     * Primary background color for pages.
+     */
+    backgroundColorPage: string;
+    /**
+     * Background color for side panels and navigation panels.
+     */
+    backgroundColorSidebar: string;
+    /**
+     * Used for cards or to create visual separation in the UI.
+     */
+    backgroundColorSection: string;
+    /**
+     * Default background color for modals.
+     */
+    backgroundColorDialog: string;
+    /**
+     * Default background color for popovers and tooltips.
+     */
+    backgroundColorPopup: string;
+    /**
+     * Background color for inverted color schemes.
+     */
+    backgroundColorFloating: string;
+    /**
+     * Used for page overlays under modals or when masking UI.
+     */
+    backgroundColorScrim: string;
+};
+/**
+ * #### Content colors
+ * Use content colors to create visual hierarchy, convey status or importance for plain text content.
+ *
+ * @categoryFont
+ */
+declare const contentColors: {
+    contentBackgroundColorNegativeWeak: string;
+    /**
+     * Text color for links.
+     */
+    contentColorLink: string;
+    /**
+     * Brand accent text color.
+     */
+    contentColorAccent: string;
+    /**
+     * Brighter brand accent text color for emphasis.
+     */
+    contentColorAccentStrong: string;
+    /**
+     * Brand accent text color that does not pass 4.5:1 contrast ratio.
+     */
+    contentColorAccentWeak: string;
+    /**
+     * Text color for headings, titles, and prominent text content.
+     */
+    contentColorActive: string;
+    /**
+     * Text color for paragraphs and standard content.
+     */
+    contentColorDefault: string;
+    /**
+     * Text color for disabled content that does not pass 4.5:1 contrast.
+     */
+    contentColorDisabled: string;
+    /**
+     * Text color used to convey informational context or status.
+     */
+    contentColorInfo: string;
+    /**
+     * Text color used on top of inverted backgrounds.
+     */
+    contentColorInverted: string;
+    /**
+     * Subdued text color for less prominent content (use sparingly).
+     */
+    contentColorMuted: string;
+    /**
+     * Text color for error or negative status messaging.
+     */
+    contentColorNegative: string;
+    /**
+     * Stronger negative text color for greater emphasis.
+     */
+    contentColorNegativeStrong: string;
+    /**
+     * Disabled negative text color that does not pass 4.5:1 contrast.
+     */
+    contentColorNegativeWeak: string;
+    /**
+     * Text color for success or positive status messaging.
+     */
+    contentColorPositive: string;
+    /**
+     * Text color for cautionary or warning status messaging.
+     */
+    contentColorWarning: string;
+};
+/**
+ * #### UI Colors
+ *
+ * @categoryColor
+ */
+declare const uiColors: {
+    /**
+     * Visual focus ring color used for focus box-shadow. Should not be directly applied to UI elements.
+     */
+    focusColor: string;
+};
+/**
+ * #### Status colors
+ * * Use status colors to convey informative, positive, caution or negative content status. Weak variants do not meet graphical or text contrast and should only be used as decorative.
+ *
+ * @categoryColor
+ */
+declare const statusColors: {
+    /**
+     * Default color for informational messages and notifications.
+     */
+    statusColorInfo: string;
+    /**
+     * Weaker, less prominent informational color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorInfoWeak: string;
+    /**
+     * Brighter, more prominent informational color.
+     */
+    statusColorInfoStrong: string;
+    /**
+     * Default color for neutral or standard status messages.
+     */
+    statusColorNormal: string;
+    /**
+     * Weaker, less prominent normal color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorNormalWeak: string;
+    /**
+     * Brighter, more prominent normal color.
+     */
+    statusColorNormalStrong: string;
+    /**
+     * Default color for low-priority status messages.
+     */
+    statusColorLow: string;
+    /**
+     * Weaker, less prominent low-priority color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorLowWeak: string;
+    /**
+     * Brighter, more prominent low-priority color.
+     */
+    statusColorLowStrong: string;
+    /**
+     * Default color for medium-priority status messages.
+     */
+    statusColorMedium: string;
+    /**
+     * Weaker, less prominent medium-priority color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorMediumWeak: string;
+    /**
+     * Brighter, more prominent medium-priority color.
+     */
+    statusColorMediumStrong: string;
+    /**
+     * Default color for high-priority status messages.
+     */
+    statusColorHigh: string;
+    /**
+     * Weaker, less prominent high-priority color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorHighWeak: string;
+    /**
+     * Brighter, more prominent high-priority color.
+     */
+    statusColorHighStrong: string;
+    /**
+     * Default color for critical alerts or urgent messages.
+     */
+    statusColorCritical: string;
+    /**
+     * Weaker, less prominent critical color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorCriticalWeak: string;
+    /**
+     * Brighter, more prominent critical color.
+     */
+    statusColorCriticalStrong: string;
+};
+/**
+ * #### Syntax colors
+ *
+ * These colors should be used for syntax highlighting in programming languages.
+ * The colors chosen for tokens depend on the language, its features, and aesthetics.
+ * Prefer to use the `Code` component rather than these tokens directly as it does this mapping automatically.
+ * See [Content Colors](#Content Colors)
+ *
+ * @categoryFont
+ */
+declare const syntaxColors: {
+    syntaxBlue: string;
+    syntaxBrown: string;
+    syntaxGray: string;
+    syntaxGreen: string;
+    syntaxOrange: string;
+    syntaxPink: string;
+    syntaxPurple: string;
+    syntaxRed: string;
+    syntaxTeal: string;
+};
+/**
+ * #### Border colors
+ *
+ * Border color should be used to outline or divide content and UI elements.
+ *
+ * @categoryColor
+ */
+declare const borderColors: {
+    /**
+     * Default border color for elements that meets 3:1 graphical contrast (e.g., menu dividers).
+     */
+    borderColor: string;
+    /**
+     * Decorative-only border color that does not meet 3:1 graphical contrast.
+     */
+    borderColorWeak: string;
+    /**
+     * Border color with stronger visual emphasis that meets 3:1 graphical contrast.
+     */
+    borderColorStrong: string;
+};
+declare const colors: {
+    /**
+     * Default border color for elements that meets 3:1 graphical contrast (e.g., menu dividers).
+     */
+    borderColor: string;
+    /**
+     * Decorative-only border color that does not meet 3:1 graphical contrast.
+     */
+    borderColorWeak: string;
+    /**
+     * Border color with stronger visual emphasis that meets 3:1 graphical contrast.
+     */
+    borderColorStrong: string;
+    syntaxBlue: string;
+    syntaxBrown: string;
+    syntaxGray: string;
+    syntaxGreen: string;
+    syntaxOrange: string;
+    syntaxPink: string;
+    syntaxPurple: string;
+    syntaxRed: string;
+    syntaxTeal: string;
+    /**
+     * Default color for informational messages and notifications.
+     */
+    statusColorInfo: string;
+    /**
+     * Weaker, less prominent informational color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorInfoWeak: string;
+    /**
+     * Brighter, more prominent informational color.
+     */
+    statusColorInfoStrong: string;
+    /**
+     * Default color for neutral or standard status messages.
+     */
+    statusColorNormal: string;
+    /**
+     * Weaker, less prominent normal color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorNormalWeak: string;
+    /**
+     * Brighter, more prominent normal color.
+     */
+    statusColorNormalStrong: string;
+    /**
+     * Default color for low-priority status messages.
+     */
+    statusColorLow: string;
+    /**
+     * Weaker, less prominent low-priority color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorLowWeak: string;
+    /**
+     * Brighter, more prominent low-priority color.
+     */
+    statusColorLowStrong: string;
+    /**
+     * Default color for medium-priority status messages.
+     */
+    statusColorMedium: string;
+    /**
+     * Weaker, less prominent medium-priority color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorMediumWeak: string;
+    /**
+     * Brighter, more prominent medium-priority color.
+     */
+    statusColorMediumStrong: string;
+    /**
+     * Default color for high-priority status messages.
+     */
+    statusColorHigh: string;
+    /**
+     * Weaker, less prominent high-priority color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorHighWeak: string;
+    /**
+     * Brighter, more prominent high-priority color.
+     */
+    statusColorHighStrong: string;
+    /**
+     * Default color for critical alerts or urgent messages.
+     */
+    statusColorCritical: string;
+    /**
+     * Weaker, less prominent critical color, does not pass 3:1 graphical or 4.5:1 text contrast.
+     */
+    statusColorCriticalWeak: string;
+    /**
+     * Brighter, more prominent critical color.
+     */
+    statusColorCriticalStrong: string;
+    /**
+     * Visual focus ring color used for focus box-shadow. Should not be directly applied to UI elements.
+     */
+    focusColor: string;
+    contentBackgroundColorNegativeWeak: string;
+    /**
+     * Text color for links.
+     */
+    contentColorLink: string;
+    /**
+     * Brand accent text color.
+     */
+    contentColorAccent: string;
+    /**
+     * Brighter brand accent text color for emphasis.
+     */
+    contentColorAccentStrong: string;
+    /**
+     * Brand accent text color that does not pass 4.5:1 contrast ratio.
+     */
+    contentColorAccentWeak: string;
+    /**
+     * Text color for headings, titles, and prominent text content.
+     */
+    contentColorActive: string;
+    /**
+     * Text color for paragraphs and standard content.
+     */
+    contentColorDefault: string;
+    /**
+     * Text color for disabled content that does not pass 4.5:1 contrast.
+     */
+    contentColorDisabled: string;
+    /**
+     * Text color used to convey informational context or status.
+     */
+    contentColorInfo: string;
+    /**
+     * Text color used on top of inverted backgrounds.
+     */
+    contentColorInverted: string;
+    /**
+     * Subdued text color for less prominent content (use sparingly).
+     */
+    contentColorMuted: string;
+    /**
+     * Text color for error or negative status messaging.
+     */
+    contentColorNegative: string;
+    /**
+     * Stronger negative text color for greater emphasis.
+     */
+    contentColorNegativeStrong: string;
+    /**
+     * Disabled negative text color that does not pass 4.5:1 contrast.
+     */
+    contentColorNegativeWeak: string;
+    /**
+     * Text color for success or positive status messaging.
+     */
+    contentColorPositive: string;
+    /**
+     * Text color for cautionary or warning status messaging.
+     */
+    contentColorWarning: string;
+    /**
+     * Default background color for the navigation headers.
+     */
+    backgroundColorNavigation: string;
+    /**
+     * Primary background color for pages.
+     */
+    backgroundColorPage: string;
+    /**
+     * Background color for side panels and navigation panels.
+     */
+    backgroundColorSidebar: string;
+    /**
+     * Used for cards or to create visual separation in the UI.
+     */
+    backgroundColorSection: string;
+    /**
+     * Default background color for modals.
+     */
+    backgroundColorDialog: string;
+    /**
+     * Default background color for popovers and tooltips.
+     */
+    backgroundColorPopup: string;
+    /**
+     * Background color for inverted color schemes.
+     */
+    backgroundColorFloating: string;
+    /**
+     * Used for page overlays under modals or when masking UI.
+     */
+    backgroundColorScrim: string;
+    /**
+     * Alternate background color in dark color schemes and inverted background in light color schemes.
+     */
+    black: string;
+    /**
+     * Least visually emphasized. Do not use this as the background for Data Entry components, does not pass 3:1 graphical contrast.
+     */
+    neutral100: string;
+    /**
+     * Not for text, does not pass 3:1 graphical contrast in light & dark color schemes.
+     */
+    neutral200: string;
+    /**
+     * Not for text, does not pass 3:1 graphical contrast in light & dark color schemes.
+     */
+    neutral300: string;
+    /**
+     * Not for text, does not pass 3:1 graphical contrast in light color schemes.
+     */
+    neutral400: string;
+    /**
+     * Most visually emphasized, not for text, does not pass 3:1 graphical contrast in light color schemes.
+     */
+    neutral500: string;
+    /**
+     * Alternate background color in light color schemes and inverted background in dark color schemes.
+     */
+    white: string;
+    /**
+     * Transparent background color.
+     */
+    transparent: string;
+    /**
+     * Primary color for interactive elements in Data entry components.
+     */
+    interactiveColorPrimary: string;
+    /**
+     * Default border color for Data entry components.
+     */
+    interactiveColorBorder: string;
+    /**
+     * Active (pressed) border color for Data entry components.
+     */
+    interactiveColorBorderActive: string;
+    /**
+     * Hover border color for Data entry components.
+     */
+    interactiveColorBorderHover: string;
+    /**
+     * Disabled border color for Data entry components.
+     */
+    interactiveColorBorderDisabled: string;
+    /**
+     * Background overlay color for selected in Data entry components.
+     */
+    interactiveColorOverlaySelected: string;
+    /**
+     * Background overlay color for hover in Data entry components.
+     */
+    interactiveColorOverlayHover: string;
+    /**
+     * Background overlay color for active (pressed) in Data entry components.
+     */
+    interactiveColorOverlayActive: string;
+    /**
+     * Background overlay color for drag in Data entry components.
+     */
+    interactiveColorOverlayDrag: string;
+    /**
+     * Default background color for Data entry components.
+     */
+    interactiveColorBackground: string;
+    /**
+     * Background color for disabled Data entry components.
+     */
+    interactiveColorBackgroundDisabled: string;
+    /**
+     * Brand accent color for Data entry components.
+     */
+    interactiveColorAccent: string;
+    /**
+     * Error color for Data entry components.
+     */
+    interactiveColorAccentError: string;
+    /**
+     * Stronger error color for emphasis in Data Entry components. Used for hover interaction.
+     */
+    interactiveColorAccentErrorStrong: string;
+    /**
+     * Default background for Primary Buttons.
+     */
+    actionColorBackgroundPrimary: string;
+    /**
+     * Active (pressed) background for Primary Buttons.
+     */
+    actionColorBackgroundPrimaryActive: string;
+    /**
+     * Disabled background for Primary Buttons.
+     */
+    actionColorBackgroundPrimaryDisabled: string;
+    /**
+     * Hover background for Primary Buttons.
+     */
+    actionColorBackgroundPrimaryHover: string;
+    /**
+     * Default background for Secondary Buttons.
+     */
+    actionColorBackgroundSecondary: string;
+    /**
+     * Active (pressed) background for Secondary Buttons.
+     */
+    actionColorBackgroundSecondaryActive: string;
+    /**
+     * Disabled background for Secondary Buttons.
+     */
+    actionColorBackgroundSecondaryDisabled: string;
+    /**
+     * Hover background for Secondary Buttons.
+     */
+    actionColorBackgroundSecondaryHover: string;
+    /**
+     * Default background for Subtle Buttons.
+     */
+    actionColorBackgroundSubtle: string;
+    /**
+     * Active (pressed) background for Subtle Buttons.
+     */
+    actionColorBackgroundSubtleActive: string;
+    /**
+     * Disabled background for Subtle Buttons.
+     */
+    actionColorBackgroundSubtleDisabled: string;
+    /**
+     * Hover background for Subtle Buttons.
+     */
+    actionColorBackgroundSubtleHover: string;
+    /**
+     * Default background for Destructive Buttons.
+     */
+    actionColorBackgroundDestructive: string;
+    /**
+     * Active (pressed) background for Destructive Buttons.
+     */
+    actionColorBackgroundDestructiveActive: string;
+    /**
+     * Disabled background for Destructive Buttons.
+     */
+    actionColorBackgroundDestructiveDisabled: string;
+    /**
+     * Hover background for Destructive Buttons.
+     */
+    actionColorBackgroundDestructiveHover: string;
+    /**
+     * Default background for Destructive Secondary Buttons.
+     */
+    actionColorBackgroundDestructiveSecondary: string;
+    /**
+     * Active (pressed) background for Destructive Secondary Buttons
+     */
+    actionColorBackgroundDestructiveSecondaryActive: string;
+    /**
+     * Disabled background for Destructive Secondary Buttons.
+     */
+    actionColorBackgroundDestructiveSecondaryDisabled: string;
+    /**
+     * Hover background for Destructive Secondary Buttons.
+     */
+    actionColorBackgroundDestructiveSecondaryHover: string;
+    /**
+     * Default border color for Secondary Buttons.
+     */
+    actionColorBorderSecondary: string;
+    /**
+     * Active (pressed) border color for Secondary Buttons.
+     */
+    actionColorBorderSecondaryActive: string;
+    /**
+     * Disabled border color for Secondary Buttons.
+     */
+    actionColorBorderSecondaryDisabled: string;
+    /**
+     * Hover border color for Secondary Buttons.
+     */
+    actionColorBorderSecondaryHover: string;
+    /**
+     * Default border color for Destructive Secondary Buttons.
+     */
+    actionColorBorderDestructiveSecondary: string;
+    /**
+     * Active (pressed) border color for Destructive Secondary Buttons.
+     */
+    actionColorBorderDestructiveSecondaryActive: string;
+    /**
+     * Disabled border color for Destructive Secondary Buttons.
+     */
+    actionColorBorderDestructiveSecondaryDisabled: string;
+    /**
+     * Hover border color for Destructive Secondary Buttons.
+     */
+    actionColorBorderDestructiveSecondaryHover: string;
+};
+type ActionColors = typeof actionColors;
+type InteractiveColors = typeof interactiveColors;
+type NeutralColors = typeof neutralColors;
+type BackgroundColors = typeof backgroundColors;
+type ContentColors = typeof contentColors;
+type UIColors = typeof uiColors;
+type StatusColors = typeof statusColors;
+type SyntaxColors = typeof syntaxColors;
+type BorderColors = typeof borderColors;
+type Colors = typeof colors;
+export default colors;
+export type { ActionColors, InteractiveColors, NeutralColors, BackgroundColors, ContentColors, UIColors, StatusColors, SyntaxColors, BorderColors, Colors, };