diff --git a/scss/tokens/_component.scss b/scss/tokens/_component.scss
index d0743f2b9b..c0f00f899f 100644
--- a/scss/tokens/_component.scss
+++ b/scss/tokens/_component.scss
@@ -10,6 +10,7 @@
// $ouds-button-border-radius: $ouds-border-radius-none !default;
// $ouds-button-border-width-default: $ouds-border-width-default !default;
// $ouds-button-border-width-default-interaction: $ouds-border-width-medium !default;
+// $ouds-button-border-width-default-interaction-mono: $ouds-border-width-none !default;
// $ouds-button-border-width-minimal: $ouds-border-width-none !default;
// $ouds-button-border-width-minimal-interaction: $ouds-border-width-none !default;
// $ouds-button-color-bg-default-focus-mono: $ouds-color-repository-opacity-black-higher !default;
@@ -26,6 +27,7 @@
// $ouds-button-color-bg-strong-hover-mono: $ouds-color-repository-opacity-black-higher !default;
// $ouds-button-color-bg-strong-loading-mono: $ouds-color-repository-opacity-white-higher !default;
// $ouds-button-color-bg-strong-pressed-mono: $ouds-color-repository-opacity-white-higher !default;
+// $ouds-button-color-border-default-disabled-mono: $ouds-color-repository-opacity-black-medium !default;
// $ouds-button-color-border-default-enabled-mono: $ouds-color-repository-neutral-emphasized-black !default;
// $ouds-button-color-content-default-disabled-mono: $ouds-color-repository-opacity-black-medium !default;
// $ouds-button-color-content-default-enabled-mono: $ouds-color-repository-neutral-emphasized-black !default;
@@ -45,26 +47,26 @@
// $ouds-button-color-content-strong-hover-mono: $ouds-color-repository-neutral-muted-white !default;
// $ouds-button-color-content-strong-loading-mono: $ouds-color-repository-neutral-emphasized-black !default;
// $ouds-button-color-content-strong-pressed-mono: $ouds-color-repository-neutral-emphasized-black !default;
-// $ouds-button-color-bg-default-disabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-disabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-disabled-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-enabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-enabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-enabled-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-focus: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-focus-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-hover: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-hover-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-loading: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-loading-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-pressed: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-default-pressed-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-minimal-disabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-minimal-disabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-minimal-disabled-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-minimal-enabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-minimal-enabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-bg-minimal-enabled-mono: $ouds-color-opacity-invisible-black !default;
+// $ouds-button-color-bg-default-disabled: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-default-disabled-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-bg-default-disabled-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-default-enabled: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-default-enabled-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-bg-default-enabled-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-default-focus: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-default-focus-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-bg-default-hover: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-default-hover-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-bg-default-loading: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-default-loading-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-bg-default-pressed: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-default-pressed-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-bg-minimal-disabled: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-minimal-disabled-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-bg-minimal-disabled-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-minimal-enabled: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-bg-minimal-enabled-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-bg-minimal-enabled-mono: $ouds-color-opacity-transparent !default;
// $ouds-button-color-bg-minimal-focus: $ouds-color-action-support-focus !default;
// $ouds-button-color-bg-minimal-focus-inverse: $ouds-color-action-support-focus-inverse !default;
// $ouds-button-color-bg-minimal-hover: $ouds-color-action-support-hover !default;
@@ -75,45 +77,44 @@
// $ouds-button-color-bg-minimal-pressed-inverse: $ouds-color-action-support-pressed-inverse !default;
// $ouds-button-color-border-default-disabled: $ouds-color-action-disabled !default;
// $ouds-button-color-border-default-disabled-inverse: $ouds-color-action-disabled-inverse !default;
-// $ouds-button-color-border-default-disabled-mono: $ouds-color-opacity-invisible-black !default;
// $ouds-button-color-border-default-enabled: $ouds-color-action-enabled !default;
// $ouds-button-color-border-default-enabled-inverse: $ouds-color-action-enabled-inverse !default;
// $ouds-button-color-border-default-focus: $ouds-color-action-focus !default;
// $ouds-button-color-border-default-focus-inverse: $ouds-color-action-focus-inverse !default;
-// $ouds-button-color-border-default-focus-mono: $ouds-color-opacity-invisible-black !default;
+// $ouds-button-color-border-default-focus-mono: $ouds-color-opacity-transparent !default;
// $ouds-button-color-border-default-hover: $ouds-color-action-hover !default;
// $ouds-button-color-border-default-hover-inverse: $ouds-color-action-hover-inverse !default;
-// $ouds-button-color-border-default-hover-mono: $ouds-color-opacity-invisible-black !default;
+// $ouds-button-color-border-default-hover-mono: $ouds-color-opacity-transparent !default;
// $ouds-button-color-border-default-loading: $ouds-color-action-loading !default;
// $ouds-button-color-border-default-loading-inverse: $ouds-color-action-loading-inverse !default;
-// $ouds-button-color-border-default-loading-mono: $ouds-color-opacity-invisible-black !default;
+// $ouds-button-color-border-default-loading-mono: $ouds-color-opacity-transparent !default;
// $ouds-button-color-border-default-pressed: $ouds-color-action-pressed !default;
// $ouds-button-color-border-default-pressed-inverse: $ouds-color-action-pressed-inverse !default;
-// $ouds-button-color-border-default-pressed-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-disabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-disabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-disabled-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-enabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-enabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-enabled-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-focus: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-focus-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-focus-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-hover: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-hover-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-hover-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-loading: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-loading-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-loading-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-pressed: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-pressed-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-minimal-pressed-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-strong-disabled-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-strong-enabled-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-strong-focus-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-strong-hover-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-strong-loading-mono: $ouds-color-opacity-invisible-black !default;
-// $ouds-button-color-border-strong-pressed-mono: $ouds-color-opacity-invisible-black !default;
+// $ouds-button-color-border-default-pressed-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-disabled: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-disabled-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-border-minimal-disabled-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-enabled: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-enabled-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-border-minimal-enabled-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-focus: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-focus-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-border-minimal-focus-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-hover: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-hover-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-border-minimal-hover-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-loading: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-loading-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-border-minimal-loading-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-pressed: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-minimal-pressed-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-button-color-border-minimal-pressed-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-strong-disabled-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-strong-enabled-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-strong-focus-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-strong-hover-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-strong-loading-mono: $ouds-color-opacity-transparent !default;
+// $ouds-button-color-border-strong-pressed-mono: $ouds-color-opacity-transparent !default;
// $ouds-button-color-content-default-disabled: $ouds-color-action-disabled !default;
// $ouds-button-color-content-default-disabled-inverse: $ouds-color-action-disabled-inverse !default;
// $ouds-button-color-content-default-enabled: $ouds-color-action-enabled !default;
@@ -138,24 +139,12 @@
// $ouds-button-color-content-minimal-loading-inverse: $ouds-color-action-loading-inverse !default;
// $ouds-button-color-content-minimal-pressed: $ouds-color-action-pressed !default;
// $ouds-button-color-content-minimal-pressed-inverse: $ouds-color-action-pressed-inverse !default;
-// $ouds-button-color-content-strong-disabled: $ouds-color-action-disabled !default;
-// $ouds-button-color-content-strong-disabled-inverse: $ouds-color-action-disabled-inverse !default;
-// $ouds-button-color-content-strong-enabled: $ouds-color-action-enabled !default;
-// $ouds-button-color-content-strong-enabled-inverse: $ouds-color-action-enabled-inverse !default;
-// $ouds-button-color-content-strong-focus: $ouds-color-action-focus !default;
-// $ouds-button-color-content-strong-focus-inverse: $ouds-color-action-focus-inverse !default;
-// $ouds-button-color-content-strong-hover: $ouds-color-action-hover !default;
-// $ouds-button-color-content-strong-hover-inverse: $ouds-color-action-hover-inverse !default;
-// $ouds-button-color-content-strong-loading: $ouds-color-action-loading !default;
-// $ouds-button-color-content-strong-loading-inverse: $ouds-color-action-loading-inverse !default;
-// $ouds-button-color-content-strong-pressed: $ouds-color-action-pressed !default;
-// $ouds-button-color-content-strong-pressed-inverse: $ouds-color-action-pressed-inverse !default;
// $ouds-button-size-icon: $ouds-size-icon-with-label-large-size-xs !default;
// $ouds-button-size-icon-only: $ouds-size-icon-with-label-large-size-sm !default;
// $ouds-button-size-loader: $ouds-size-icon-with-label-large-size-xs !default;
// $ouds-button-space-column-gap-arrow: $ouds-space-column-gap-shorter !default;
// $ouds-button-space-column-gap-icon: $ouds-space-column-gap-short !default;
-// $ouds-button-space-inset-icon-alone: $ouds-space-inset-medium !default;
+// $ouds-button-space-inset-icon-only: $ouds-space-inset-medium !default;
// $ouds-button-space-padding-block: $ouds-space-padding-block-medium !default;
// $ouds-button-space-padding-inline-arrow-end: $ouds-space-padding-inline-tall !default;
// $ouds-button-space-padding-inline-arrow-start: $ouds-space-padding-inline-tall !default;
@@ -168,90 +157,30 @@
// Indicator
// scss-docs-start ouds-component-indicator
-// $ouds-indicator-skeleton-color-bg: $ouds-color-repository-opacity-black-lowest !default;
-// $ouds-indicator-skeleton-color-bg-inverse: $ouds-color-repository-opacity-white-lowest !default;
-// $ouds-indicator-skeleton-color-gradient-middle: $ouds-color-repository-opacity-black-lower !default;
-// $ouds-indicator-skeleton-color-gradient-middle-inverse: $ouds-color-repository-opacity-white-lower !default;
-// $ouds-indicator-skeleton-color-gradient-start-end: $ouds-color-opacity-invisible-black !default;
-// $ouds-indicator-skeleton-color-gradient-start-end-inverse: $ouds-color-opacity-invisible-black-inverse !default;
+// $ouds-indicator-skeleton-color-bg: $ouds-color-opacity-lowest !default;
+// $ouds-indicator-skeleton-color-bg-inverse: $ouds-color-opacity-lowest-inverse !default;
+// $ouds-indicator-skeleton-color-gradient-middle: $ouds-color-opacity-lower !default;
+// $ouds-indicator-skeleton-color-gradient-middle-inverse: $ouds-color-opacity-lower-inverse !default;
+// $ouds-indicator-skeleton-color-gradient-start-end: $ouds-color-opacity-transparent !default;
+// $ouds-indicator-skeleton-color-gradient-start-end-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-indicator-tag-color-bg-reminder: $ouds-color-opacity-lower !default;
+// $ouds-indicator-tag-color-bg-reminder-inverse: $ouds-color-opacity-lower-inverse !default;
// scss-docs-end ouds-component-indicator
// Input
// scss-docs-start ouds-component-input
-// $ouds-input-checkbox-size-max-height-container-icon: $ouds-dimension-600 !default;
-// $ouds-input-checkbox-size-min-height: $ouds-dimension-600 !default;
-// $ouds-input-checkbox-size-min-height-icon-only: $ouds-dimension-600 !default;
-// $ouds-input-checkbox-size-min-width: $ouds-dimension-600 !default;
-// $ouds-input-checkbox-size-min-width-icon-only: $ouds-dimension-600 !default;
// $ouds-input-input-text-size-max-height: $ouds-dimension-600 !default;
// $ouds-input-input-text-size-min-height: $ouds-dimension-600 !default;
// $ouds-input-input-text-size-min-width: $ouds-dimension-600 !default;
-// $ouds-input-radio-button-size-max-height-container-icon: $ouds-dimension-600 !default;
-// $ouds-input-radio-button-size-min-height: $ouds-dimension-600 !default;
-// $ouds-input-radio-button-size-min-height-icon-only: $ouds-dimension-600 !default;
-// $ouds-input-radio-button-size-min-width: $ouds-dimension-600 !default;
-// $ouds-input-radio-button-size-min-width-icon-only: $ouds-dimension-600 !default;
-// $ouds-input-checkbox-border-radius: $ouds-border-radius-none !default;
-// $ouds-input-checkbox-border-width: $ouds-border-width-none !default;
-// $ouds-input-input-text-border-radius: $ouds-border-radius-none !default;
-// $ouds-input-input-text-border-width-default: $ouds-border-width-default !default;
-// $ouds-input-input-text-border-width-default-interaction: $ouds-border-width-medium !default;
-// $ouds-input-radio-button-border-radius: $ouds-border-radius-none !default;
-// $ouds-input-radio-button-border-width: $ouds-border-width-none !default;
-// $ouds-input-radio-button-border-width-highlight: $ouds-border-width-default !default;
-// $ouds-input-checkbox-color-bg-disabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-bg-disabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-bg-enabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-bg-enabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-bg-focus: $ouds-color-action-support-focus !default;
-// $ouds-input-checkbox-color-bg-focus-inverse: $ouds-color-action-support-focus-inverse !default;
-// $ouds-input-checkbox-color-bg-hover: $ouds-color-action-support-hover !default;
-// $ouds-input-checkbox-color-bg-hover-inverse: $ouds-color-action-support-hover-inverse !default;
-// $ouds-input-checkbox-color-bg-loading: $ouds-color-action-support-loading !default;
-// $ouds-input-checkbox-color-bg-loading-inverse: $ouds-color-action-support-loading-inverse !default;
-// $ouds-input-checkbox-color-bg-pressed: $ouds-color-action-support-pressed !default;
-// $ouds-input-checkbox-color-bg-pressed-inverse: $ouds-color-action-support-pressed-inverse !default;
-// $ouds-input-checkbox-color-border-disabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-border-disabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-border-enabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-border-enabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-border-hover: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-border-hover-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-border-loading: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-border-loading-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-border-pressed: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-border-pressed-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-checkbox-color-content-content-disabled: $ouds-color-content-disabled !default;
-// $ouds-input-checkbox-color-content-content-disabled-inverse: $ouds-color-content-disabled-inverse !default;
-// $ouds-input-checkbox-color-content-content-enabled: $ouds-color-content-default !default;
-// $ouds-input-checkbox-color-content-content-enabled-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-checkbox-color-content-content-focus: $ouds-color-content-default !default;
-// $ouds-input-checkbox-color-content-content-focus-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-checkbox-color-content-content-hover: $ouds-color-content-default !default;
-// $ouds-input-checkbox-color-content-content-hover-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-checkbox-color-content-content-loading: $ouds-color-content-default !default;
-// $ouds-input-checkbox-color-content-content-loading-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-checkbox-color-content-content-pressed: $ouds-color-content-default !default;
-// $ouds-input-checkbox-color-content-content-pressed-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-checkbox-color-content-helper-text-disabled: $ouds-color-content-disabled !default;
-// $ouds-input-checkbox-color-content-helper-text-disabled-inverse: $ouds-color-content-disabled-inverse !default;
-// $ouds-input-checkbox-color-content-helper-text-enabled: $ouds-color-content-muted !default;
-// $ouds-input-checkbox-color-content-helper-text-enabled-inverse: $ouds-color-content-muted-inverse !default;
-// $ouds-input-checkbox-color-content-helper-text-focus: $ouds-color-content-muted !default;
-// $ouds-input-checkbox-color-content-helper-text-focus-inverse: $ouds-color-content-muted-inverse !default;
-// $ouds-input-checkbox-color-content-helper-text-hover: $ouds-color-content-muted !default;
-// $ouds-input-checkbox-color-content-helper-text-hover-inverse: $ouds-color-content-muted-inverse !default;
-// $ouds-input-checkbox-color-content-helper-text-loading: $ouds-color-content-muted !default;
-// $ouds-input-checkbox-color-content-helper-text-loading-inverse: $ouds-color-content-muted-inverse !default;
-// $ouds-input-checkbox-color-content-helper-text-pressed: $ouds-color-content-muted !default;
-// $ouds-input-checkbox-color-content-helper-text-pressed-inverse: $ouds-color-content-muted-inverse !default;
-// $ouds-input-checkbox-size-check-box: $ouds-size-icon-with-label-large-size-sm !default;
-// $ouds-input-checkbox-size-icon: $ouds-size-icon-with-label-large-size-xs !default;
-// $ouds-input-checkbox-size-loader: $ouds-size-icon-with-label-large-size-xs !default;
-// $ouds-input-checkbox-space-column-gap: $ouds-space-column-gap-tall !default;
-// $ouds-input-checkbox-space-padding-inset: $ouds-space-inset-medium !default;
-// $ouds-input-checkbox-space-row-gap: $ouds-space-row-gap-none !default;
+// $ouds-input-input-text-size-text-height: $ouds-dimension-600 !default;
+// $ouds-input-select-size-max-height-container-icon: $ouds-dimension-600 !default;
+// $ouds-input-select-size-min-height: $ouds-dimension-600 !default;
+// $ouds-input-select-size-min-height-icon-only: $ouds-dimension-600 !default;
+// $ouds-input-select-size-min-width: $ouds-dimension-600 !default;
+// $ouds-input-select-size-min-width-icon-only: $ouds-dimension-600 !default;
+// $ouds-input-input-text-size-icon-height: $ouds-size-icon-decorative-lg !default;
+// $ouds-input-input-text-size-suffix-text-height: $ouds-font-line-height-heading-xlarge-desktop !default;
// $ouds-input-input-text-color-bg-default-disabled: $ouds-color-action-support-enabled !default;
// $ouds-input-input-text-color-bg-default-disabled-inverse: $ouds-color-action-support-enabled-inverse !default;
// $ouds-input-input-text-color-bg-default-enabled: $ouds-color-action-support-enabled !default;
@@ -264,16 +193,6 @@
// $ouds-input-input-text-color-bg-default-loading-inverse: $ouds-color-action-support-loading-inverse !default;
// $ouds-input-input-text-color-bg-default-pressed: $ouds-color-action-support-pressed !default;
// $ouds-input-input-text-color-bg-default-pressed-inverse: $ouds-color-action-support-pressed-inverse !default;
-// $ouds-input-input-text-color-border-default-disabled: $ouds-color-action-disabled !default;
-// $ouds-input-input-text-color-border-default-disabled-inverse: $ouds-color-action-disabled-inverse !default;
-// $ouds-input-input-text-color-border-default-loading: $ouds-color-action-loading !default;
-// $ouds-input-input-text-color-border-default-loading-inverse: $ouds-color-action-loading-inverse !default;
-// $ouds-input-input-text-color-border-default-pressed: $ouds-color-action-pressed !default;
-// $ouds-input-input-text-color-border-default-pressed-inverse: $ouds-color-action-pressed-inverse !default;
-// $ouds-input-input-text-color-border-default-enabled: $ouds-color-border-default-inverse !default;
-// $ouds-input-input-text-color-border-default-enabled-inverse: $ouds-color-action-enabled-inverse !default;
-// $ouds-input-input-text-color-border-default-hover: $ouds-color-action-enabled !default;
-// $ouds-input-input-text-color-border-default-hover-inverse: $ouds-color-action-hover-inverse !default;
// $ouds-input-input-text-color-content-default-disabled: $ouds-color-content-disabled !default;
// $ouds-input-input-text-color-content-default-disabled-inverse: $ouds-color-content-disabled-inverse !default;
// $ouds-input-input-text-color-content-default-enabled: $ouds-color-content-default !default;
@@ -281,90 +200,72 @@
// $ouds-input-input-text-color-content-default-focus: $ouds-color-content-default !default;
// $ouds-input-input-text-color-content-default-focus-inverse: $ouds-color-content-default-inverse !default;
// $ouds-input-input-text-color-content-default-hover: $ouds-color-content-default !default;
-// $ouds-input-input-text-color-content-default-hover-2: $ouds-color-content-default !default;
// $ouds-input-input-text-color-content-default-hover-inverse: $ouds-color-content-default-inverse !default;
// $ouds-input-input-text-color-content-default-loading: $ouds-color-content-default !default;
// $ouds-input-input-text-color-content-default-loading-inverse: $ouds-color-content-default-inverse !default;
// $ouds-input-input-text-color-content-default-pressed: $ouds-color-content-default !default;
// $ouds-input-input-text-color-content-default-pressed-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-input-text-size-icon: $ouds-size-icon-with-label-large-size-xs !default;
-// $ouds-input-input-text-size-loader: $ouds-size-icon-with-label-large-size-xs !default;
// $ouds-input-input-text-size-prefix-text-height: $ouds-size-icon-with-label-large-size-sm !default;
-// $ouds-input-input-text-size-suffix-text-height: $ouds-size-icon-with-label-large-size-sm !default;
-// $ouds-input-input-text-space-column-gap-arrow: $ouds-space-column-gap-shorter !default;
-// $ouds-input-input-text-space-column-gap-icon: $ouds-space-column-gap-short !default;
// $ouds-input-input-text-space-inset-icon-alone: $ouds-space-inset-medium !default;
// $ouds-input-input-text-space-padding-block: $ouds-space-padding-block-medium !default;
-// $ouds-input-input-text-space-padding-inline-arrow-end: $ouds-space-padding-inline-tall !default;
-// $ouds-input-input-text-space-padding-inline-arrow-start: $ouds-space-padding-inline-tall !default;
-// $ouds-input-input-text-space-padding-inline-end-icon-start: $ouds-space-padding-inline-spacious !default;
-// $ouds-input-input-text-space-padding-inline-icon-none: $ouds-space-padding-inline-huge !default;
-// $ouds-input-input-text-space-padding-inline-icon-start: $ouds-space-padding-inline-taller !default;
-// $ouds-input-input-text-space-padding-inline-start-icon-end: $ouds-space-padding-inline-spacious !default;
-// $ouds-input-radio-button-color-bg-disabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-bg-disabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-bg-enabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-bg-enabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-bg-focus: $ouds-color-action-support-focus !default;
-// $ouds-input-radio-button-color-bg-focus-inverse: $ouds-color-action-support-focus-inverse !default;
-// $ouds-input-radio-button-color-bg-hover: $ouds-color-action-support-hover !default;
-// $ouds-input-radio-button-color-bg-hover-inverse: $ouds-color-action-support-hover-inverse !default;
-// $ouds-input-radio-button-color-bg-loading: $ouds-color-action-support-loading !default;
-// $ouds-input-radio-button-color-bg-loading-inverse: $ouds-color-action-support-loading-inverse !default;
-// $ouds-input-radio-button-color-bg-pressed: $ouds-color-action-support-pressed !default;
-// $ouds-input-radio-button-color-bg-pressed-inverse: $ouds-color-action-support-pressed-inverse !default;
-// $ouds-input-radio-button-color-border-disabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-border-disabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-border-enabled: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-border-enabled-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-border-hover: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-border-hover-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-border-loading: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-border-loading-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-border-pressed: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-border-pressed-inverse: $ouds-color-opacity-invisible-black !default;
-// $ouds-input-radio-button-color-content-content-disabled: $ouds-color-content-disabled !default;
-// $ouds-input-radio-button-color-content-content-disabled-inverse: $ouds-color-content-disabled-inverse !default;
-// $ouds-input-radio-button-color-content-content-enabled: $ouds-color-content-default !default;
-// $ouds-input-radio-button-color-content-content-enabled-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-radio-button-color-content-content-focus: $ouds-color-content-default !default;
-// $ouds-input-radio-button-color-content-content-focus-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-radio-button-color-content-content-hover: $ouds-color-content-default !default;
-// $ouds-input-radio-button-color-content-content-hover-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-radio-button-color-content-content-loading: $ouds-color-content-default !default;
-// $ouds-input-radio-button-color-content-content-loading-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-radio-button-color-content-content-pressed: $ouds-color-content-default !default;
-// $ouds-input-radio-button-color-content-content-pressed-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-radio-button-color-content-helper-text-disabled: $ouds-color-content-disabled !default;
-// $ouds-input-radio-button-color-content-helper-text-disabled-inverse: $ouds-color-content-disabled-inverse !default;
-// $ouds-input-radio-button-color-content-helper-text-enabled: $ouds-color-content-muted !default;
-// $ouds-input-radio-button-color-content-helper-text-enabled-inverse: $ouds-color-content-muted-inverse !default;
-// $ouds-input-radio-button-color-content-helper-text-focus: $ouds-color-content-muted !default;
-// $ouds-input-radio-button-color-content-helper-text-focus-inverse: $ouds-color-content-muted-inverse !default;
-// $ouds-input-radio-button-color-content-helper-text-hover: $ouds-color-content-muted !default;
-// $ouds-input-radio-button-color-content-helper-text-hover-inverse: $ouds-color-content-muted-inverse !default;
-// $ouds-input-radio-button-color-content-helper-text-loading: $ouds-color-content-muted !default;
-// $ouds-input-radio-button-color-content-helper-text-loading-inverse: $ouds-color-content-muted-inverse !default;
-// $ouds-input-radio-button-color-content-helper-text-pressed: $ouds-color-content-muted !default;
-// $ouds-input-radio-button-color-content-helper-text-pressed-inverse: $ouds-color-content-muted-inverse !default;
-// $ouds-input-radio-button-color-content-price-disabled: $ouds-color-content-disabled !default;
-// $ouds-input-radio-button-color-content-price-disabled-inverse: $ouds-color-content-disabled-inverse !default;
-// $ouds-input-radio-button-color-content-price-enabled: $ouds-color-content-default !default;
-// $ouds-input-radio-button-color-content-price-enabled-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-radio-button-color-content-price-focus: $ouds-color-content-default !default;
-// $ouds-input-radio-button-color-content-price-focus-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-radio-button-color-content-price-hover: $ouds-color-content-default !default;
-// $ouds-input-radio-button-color-content-price-hover-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-radio-button-color-content-price-loading: $ouds-color-content-default !default;
-// $ouds-input-radio-button-color-content-price-loading-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-radio-button-color-content-price-pressed: $ouds-color-content-default !default;
-// $ouds-input-radio-button-color-content-price-pressed-inverse: $ouds-color-content-default-inverse !default;
-// $ouds-input-radio-button-size-check-box: $ouds-size-icon-with-label-large-size-sm !default;
-// $ouds-input-radio-button-size-icon: $ouds-size-icon-with-label-large-size-xs !default;
-// $ouds-input-radio-button-size-loader: $ouds-size-icon-with-label-large-size-xs !default;
-// $ouds-input-radio-button-space-column-gap: $ouds-space-column-gap-tall !default;
-// $ouds-input-radio-button-space-padding-inset: $ouds-space-inset-medium !default;
-// $ouds-input-radio-button-space-row-gap: $ouds-space-row-gap-none !default;
+// $ouds-input-input-text-space-padding-inline-container-end: $ouds-space-padding-inline-shorter !default;
+// $ouds-input-input-text-space-padding-inline-container-start: $ouds-space-padding-inline-medium !default;
+// $ouds-input-input-text-space-padding-inline-icon-end: $ouds-space-padding-inline-shorter !default;
+// $ouds-input-input-text-space-padding-inline-prefix-text-end: $ouds-space-padding-inline-short !default;
+// $ouds-input-input-text-space-padding-inline-suffix-text-end: $ouds-space-padding-inline-shortest !default;
+// $ouds-input-input-text-space-padding-inline-text-end: $ouds-space-padding-inline-short !default;
+// $ouds-input-select-color-bg-disabled: $ouds-color-opacity-transparent !default;
+// $ouds-input-select-color-bg-disabled-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-input-select-color-bg-enabled: $ouds-color-opacity-transparent !default;
+// $ouds-input-select-color-bg-enabled-inverse: $ouds-color-opacity-transparent-inverse !default;
+// $ouds-input-select-color-bg-focus: $ouds-color-action-support-focus !default;
+// $ouds-input-select-color-bg-focus-inverse: $ouds-color-action-support-focus-inverse !default;
+// $ouds-input-select-color-bg-hover: $ouds-color-action-support-hover !default;
+// $ouds-input-select-color-bg-hover-inverse: $ouds-color-action-support-hover-inverse !default;
+// $ouds-input-select-color-bg-loading: $ouds-color-action-support-loading !default;
+// $ouds-input-select-color-bg-loading-inverse: $ouds-color-action-support-loading-inverse !default;
+// $ouds-input-select-color-bg-pressed: $ouds-color-action-support-pressed !default;
+// $ouds-input-select-color-bg-pressed-inverse: $ouds-color-action-support-pressed-inverse !default;
+// $ouds-input-select-color-border-disabled: $ouds-color-action-disabled !default;
+// $ouds-input-select-color-border-disabled-inverse: $ouds-color-action-disabled-inverse !default;
+// $ouds-input-select-color-border-enabled: $ouds-color-action-selected !default;
+// $ouds-input-select-color-border-enabled-inverse: $ouds-color-action-selected-inverse !default;
+// $ouds-input-select-color-border-hover: $ouds-color-action-hover !default;
+// $ouds-input-select-color-border-hover-inverse: $ouds-color-action-hover-inverse !default;
+// $ouds-input-select-color-border-loading: $ouds-color-action-loading !default;
+// $ouds-input-select-color-border-loading-inverse: $ouds-color-action-loading-inverse !default;
+// $ouds-input-select-color-border-pressed: $ouds-color-action-pressed !default;
+// $ouds-input-select-color-border-pressed-inverse: $ouds-color-action-pressed-inverse !default;
+// $ouds-input-select-color-content-disabled: $ouds-color-content-disabled !default;
+// $ouds-input-select-color-content-disabled-inverse: $ouds-color-content-disabled-inverse !default;
+// $ouds-input-select-color-content-enabled: $ouds-color-content-default !default;
+// $ouds-input-select-color-content-enabled-inverse: $ouds-color-content-default-inverse !default;
+// $ouds-input-select-color-content-focus: $ouds-color-content-default !default;
+// $ouds-input-select-color-content-focus-inverse: $ouds-color-content-default-inverse !default;
+// $ouds-input-select-color-content-helper-text-disabled: $ouds-color-content-disabled !default;
+// $ouds-input-select-color-content-helper-text-disabled-inverse: $ouds-color-content-disabled-inverse !default;
+// $ouds-input-select-color-content-helper-text-enabled: $ouds-color-content-muted !default;
+// $ouds-input-select-color-content-helper-text-enabled-inverse: $ouds-color-content-muted-inverse !default;
+// $ouds-input-select-color-content-helper-text-focus: $ouds-color-content-muted !default;
+// $ouds-input-select-color-content-helper-text-focus-inverse: $ouds-color-content-muted-inverse !default;
+// $ouds-input-select-color-content-helper-text-hover: $ouds-color-content-muted !default;
+// $ouds-input-select-color-content-helper-text-hover-inverse: $ouds-color-content-muted-inverse !default;
+// $ouds-input-select-color-content-helper-text-loading: $ouds-color-content-muted !default;
+// $ouds-input-select-color-content-helper-text-loading-inverse: $ouds-color-content-muted-inverse !default;
+// $ouds-input-select-color-content-helper-text-pressed: $ouds-color-content-muted !default;
+// $ouds-input-select-color-content-helper-text-pressed-inverse: $ouds-color-content-muted-inverse !default;
+// $ouds-input-select-color-content-hover: $ouds-color-content-default !default;
+// $ouds-input-select-color-content-hover-inverse: $ouds-color-content-default-inverse !default;
+// $ouds-input-select-color-content-loading: $ouds-color-content-default !default;
+// $ouds-input-select-color-content-loading-inverse: $ouds-color-content-default-inverse !default;
+// $ouds-input-select-color-content-pressed: $ouds-color-content-default !default;
+// $ouds-input-select-color-content-pressed-inverse: $ouds-color-content-default-inverse !default;
+// $ouds-input-select-size-check-box: $ouds-size-icon-with-label-large-size-sm !default;
+// $ouds-input-select-size-icon: $ouds-size-icon-with-label-large-size-md !default;
+// $ouds-input-select-size-loader: $ouds-size-icon-with-label-large-size-sm !default;
+// $ouds-input-select-space-column-gap: $ouds-space-column-gap-tall !default;
+// $ouds-input-select-space-padding-inset: $ouds-space-inset-medium !default;
+// $ouds-input-select-space-row-gap: $ouds-space-row-gap-none !default;
// scss-docs-end ouds-component-input
// Navigation
diff --git a/scss/tokens/_semantic.scss b/scss/tokens/_semantic.scss
index e4e12dfe94..77d0df3c93 100644
--- a/scss/tokens/_semantic.scss
+++ b/scss/tokens/_semantic.scss
@@ -25,10 +25,12 @@ $ouds-border-width-thin: $ouds-border-width-25 !default;
// Color
// scss-docs-start ouds-semantic-color
-$ouds-color-opacity-invisible-black-light: $ouds-color-opacity-black-0 !default;
-$ouds-color-opacity-invisible-white-light: $ouds-color-opacity-white-0 !default;
-$ouds-color-opacity-invisible-black-dark: $ouds-color-opacity-white-0 !default;
-$ouds-color-opacity-invisible-white-dark: $ouds-color-opacity-white-0 !default;
+$ouds-color-opacity-lower-light: $ouds-color-opacity-black-80 !default;
+$ouds-color-opacity-lowest-light: $ouds-color-opacity-black-40 !default;
+$ouds-color-opacity-transparent-light: $ouds-color-opacity-black-0 !default;
+$ouds-color-opacity-lower-dark: $ouds-color-opacity-white-80 !default;
+$ouds-color-opacity-lowest-dark: $ouds-color-opacity-white-40 !default;
+$ouds-color-opacity-transparent-dark: $ouds-color-opacity-white-0 !default;
$ouds-color-action-disabled-light: $ouds-color-opacity-black-200 !default;
$ouds-color-action-enabled-light: $ouds-color-functional-black !default;
$ouds-color-action-focus-light: $ouds-color-opacity-black-680 !default;
@@ -105,7 +107,6 @@ $ouds-color-content-on-action-focus-light: $ouds-color-functional-white !default
$ouds-color-content-on-action-highlighted-light: $ouds-color-functional-white !default;
$ouds-color-content-on-action-hover-light: $ouds-color-functional-white !default;
$ouds-color-content-on-action-loading-light: $ouds-color-functional-white !default;
-$ouds-color-content-on-action-negative-light: $ouds-color-functional-white !default;
$ouds-color-content-on-action-pressed-light: $ouds-color-functional-white !default;
$ouds-color-content-on-action-disabled-dark: $ouds-color-functional-black !default;
$ouds-color-content-on-action-enabled-dark: $ouds-color-functional-black !default;
@@ -113,17 +114,16 @@ $ouds-color-content-on-action-focus-dark: $ouds-color-functional-black !default;
$ouds-color-content-on-action-highlighted-dark: $ouds-color-functional-black !default;
$ouds-color-content-on-action-hover-dark: $ouds-color-functional-black !default;
$ouds-color-content-on-action-loading-dark: $ouds-color-functional-black !default;
-$ouds-color-content-on-action-negative-dark: $ouds-color-functional-black !default;
$ouds-color-content-on-action-pressed-dark: $ouds-color-functional-black !default;
$ouds-color-content-on-brand-primary-light: $ouds-color-functional-black !default;
$ouds-color-content-on-brand-primary-dark: $ouds-color-functional-black !default;
$ouds-color-content-on-overlay-emphasized-light: $ouds-color-functional-white !default;
$ouds-color-content-on-overlay-emphasized-dark: $ouds-color-functional-black !default;
$ouds-color-content-on-status-emphasized-light: $ouds-color-functional-black !default;
-$ouds-color-content-on-status-emphasized-neutral-light: $ouds-color-functional-white !default;
+$ouds-color-content-on-status-emphasized-alt-light: $ouds-color-functional-white !default;
$ouds-color-content-on-status-muted-light: $ouds-color-functional-black !default;
$ouds-color-content-on-status-emphasized-dark: $ouds-color-functional-black !default;
-$ouds-color-content-on-status-emphasized-neutral-dark: $ouds-color-functional-black !default;
+$ouds-color-content-on-status-emphasized-alt-dark: $ouds-color-functional-black !default;
$ouds-color-content-on-status-muted-dark: $ouds-color-functional-light-gray-160 !default;
$ouds-color-content-status-info-light: $ouds-color-functional-dodger-blue-500 !default;
$ouds-color-content-status-negative-light: $ouds-color-functional-scarlet-600 !default;
@@ -611,9 +611,11 @@ $ouds-size-icon-with-label-large-size-xs: $ouds-dimension-4xs !default;
$ouds-size-icon-with-label-medium-size-lg: $ouds-dimension-3xs !default;
$ouds-size-icon-with-label-medium-size-md: $ouds-dimension-4xs !default;
$ouds-size-icon-with-label-medium-size-sm: $ouds-dimension-5xs !default;
+$ouds-size-icon-with-label-medium-size-xs: $ouds-dimension-6xs !default;
$ouds-size-icon-with-label-small-size-lg: $ouds-dimension-4xs !default;
$ouds-size-icon-with-label-small-size-md: $ouds-dimension-5xs !default;
$ouds-size-icon-with-label-small-size-sm: $ouds-dimension-6xs !default;
+$ouds-size-icon-with-label-small-size-xs: $ouds-dimension-7xs !default;
$ouds-size-icon-with-label-xlarge-size-lg: $ouds-dimension-lg !default;
$ouds-size-icon-with-label-xlarge-size-md: $ouds-dimension-md !default;
$ouds-size-icon-with-label-xlarge-size-sm: $ouds-dimension-xs !default;
diff --git a/site/content/docs/0.0/migration-from-boosted.md b/site/content/docs/0.0/migration-from-boosted.md
index e38f5ef057..5bd306be74 100644
--- a/site/content/docs/0.0/migration-from-boosted.md
+++ b/site/content/docs/0.0/migration-from-boosted.md
@@ -755,9 +755,11 @@ All responsive classes, helpers, and utilities have been updated accordingly to
$ouds-size-icon-with-label-medium-size-lg
$ouds-size-icon-with-label-medium-size-md
$ouds-size-icon-with-label-medium-size-sm
+ $ouds-size-icon-with-label-medium-size-xs
$ouds-size-icon-with-label-small-size-lg
$ouds-size-icon-with-label-small-size-md
$ouds-size-icon-with-label-small-size-sm
+ $ouds-size-icon-with-label-small-size-xs
$ouds-size-icon-with-label-xlarge-size-lg
$ouds-size-icon-with-label-xlarge-size-md
$ouds-size-icon-with-label-xlarge-size-sm
diff --git a/site/content/docs/0.0/migration.md b/site/content/docs/0.0/migration.md
index 66e7a8cbf3..791326da3f 100644
--- a/site/content/docs/0.0/migration.md
+++ b/site/content/docs/0.0/migration.md
@@ -666,9 +666,11 @@ toc: true
$ouds-size-icon-with-label-medium-size-lg
$ouds-size-icon-with-label-medium-size-md
$ouds-size-icon-with-label-medium-size-sm
+ $ouds-size-icon-with-label-medium-size-xs
$ouds-size-icon-with-label-small-size-lg
$ouds-size-icon-with-label-small-size-md
$ouds-size-icon-with-label-small-size-sm
+ $ouds-size-icon-with-label-small-size-xs
$ouds-size-icon-with-label-xlarge-size-lg
$ouds-size-icon-with-label-xlarge-size-md
$ouds-size-icon-with-label-xlarge-size-sm