diff --git a/scss/_variables.scss b/scss/_variables.scss
index 77c0dd27c9..2c8a312f72 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -10,11 +10,11 @@
 $white:    $ouds-color-functional-white !default; // OUDS mod: instead of `#fff`
 $gray-100: $ouds-color-functional-light-gray-80 !default; // OUDS mod: instead of `#f8f9fa`
 $gray-200: $ouds-color-functional-light-gray-160 !default; // OUDS mod: instead of `#e9ecef`
-$gray-300: $ouds-color-functional-light-gray-400 !default; // OUDS mod: instead of `#dee2e6`
+$gray-300: $ouds-color-functional-light-gray-560 !default; // OUDS mod: instead of `#dee2e6`
 $gray-400: $ouds-color-functional-light-gray-560 !default; // OUDS mod: instead of `#ced4da`
-$gray-500: $ouds-color-functional-light-gray-880 !default; // OUDS mod: instead of `#adb5bd`
-$gray-600: $ouds-color-functional-dark-gray-240 !default; // OUDS mod: instead of `#6c757d`
-$gray-700: $ouds-color-functional-dark-gray-640 !default; // OUDS mod: instead of `#495057`
+$gray-500: $ouds-color-functional-dark-gray-400 !default; // OUDS mod: instead of `#adb5bd`
+$gray-600: $ouds-color-functional-dark-gray-640 !default; // OUDS mod: instead of `#6c757d`
+$gray-700: $ouds-color-functional-dark-gray-720 !default; // OUDS mod: instead of `#495057`
 $gray-800: $ouds-color-functional-dark-gray-800 !default; // OUDS mod: instead of `#343a40`
 $gray-900: $ouds-color-functional-dark-gray-880 !default; // OUDS mod: instead of `#212529`
 $black:    $ouds-color-functional-black !default; // OUDS mod: instead of `#000`
@@ -612,7 +612,7 @@ $border-widths: (
   5: $ouds-border-width-thicker * 1.25 // OUDS mod: instead of `$border-width * 2.5`
 ) !default;
 $border-style:                $ouds-border-style-default !default; // OUDS mod: instead of `solid`
-$border-color:                $ouds-color-border-default-light !default; // OUDS mod: instead of `$gray-300`
+$border-color:                $ouds-color-border-default-light !default; // OUDS mod: instead of `$gray-300` // TODO LM: Decide whether to use default in here or in translucent
 $border-color-translucent:    rgba($black, .175) !default;
 // scss-docs-end border-variables
 
diff --git a/scss/tests/customize/_ouds-web-bootstrap-utilities.test.scss b/scss/tests/customize/_ouds-web-bootstrap-utilities.test.scss
index e2ad54c05e..19686e2129 100644
--- a/scss/tests/customize/_ouds-web-bootstrap-utilities.test.scss
+++ b/scss/tests/customize/_ouds-web-bootstrap-utilities.test.scss
@@ -1046,12 +1046,12 @@ $utilities: ();
 
         .border-light {
           --bs-border-opacity: 1;
-          border-color: rgba(143, 143, 143, var(--bs-border-opacity)) !important;
+          border-color: rgba(85, 85, 85, var(--bs-border-opacity)) !important;
         }
 
         .border-dark {
           --bs-border-opacity: 1;
-          border-color: rgba(51, 51, 51, var(--bs-border-opacity)) !important;
+          border-color: rgba(39, 39, 39, var(--bs-border-opacity)) !important;
         }
 
         .border-black {
@@ -10835,12 +10835,12 @@ $utilities: ();
 
         .border-light {
           --bs-border-opacity: 1;
-          border-color: rgba(143, 143, 143, var(--bs-border-opacity)) !important;
+          border-color: rgba(85, 85, 85, var(--bs-border-opacity)) !important;
         }
 
         .border-dark {
           --bs-border-opacity: 1;
-          border-color: rgba(51, 51, 51, var(--bs-border-opacity)) !important;
+          border-color: rgba(39, 39, 39, var(--bs-border-opacity)) !important;
         }
 
         .border-black {
diff --git a/scss/tokens/_component.scss b/scss/tokens/_component.scss
index 60b4c2d7f6..f80f84dcf4 100644
--- a/scss/tokens/_component.scss
+++ b/scss/tokens/_component.scss
@@ -46,67 +46,43 @@ $ouds-button-border-width-minimal-interaction: $ouds-border-width-none !default;
 // $ouds-button-color-content-strong-loading-mono: var(--#{$prefix}color-repository-neutral-emphasized-black) !default;
 // $ouds-button-color-content-strong-pressed-mono: var(--#{$prefix}color-repository-neutral-emphasized-black) !default;
 $ouds-button-color-bg-default-disabled: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-bg-default-disabled-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-bg-default-disabled-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-bg-default-enabled: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-bg-default-enabled-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-bg-default-enabled-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-bg-default-focus: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-bg-default-focus-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-bg-default-hover: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-bg-default-hover-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-bg-default-loading: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-bg-default-loading-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-bg-default-pressed: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-bg-default-pressed-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-bg-minimal-disabled: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-bg-minimal-disabled-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-bg-minimal-disabled-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-bg-minimal-enabled: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-bg-minimal-enabled-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-bg-minimal-enabled-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-bg-minimal-focus: var(--#{$prefix}color-action-support-focus) !default;
-// $ouds-button-color-bg-minimal-focus-inverse: var(--#{$prefix}color-action-support-focus-inverse) !default;
 $ouds-button-color-bg-minimal-hover: var(--#{$prefix}color-action-support-hover) !default;
-// $ouds-button-color-bg-minimal-hover-inverse: var(--#{$prefix}color-action-support-hover-inverse) !default;
 $ouds-button-color-bg-minimal-loading: var(--#{$prefix}color-action-support-loading) !default;
-// $ouds-button-color-bg-minimal-loading-inverse: var(--#{$prefix}color-action-support-loading-inverse) !default;
 $ouds-button-color-bg-minimal-pressed: var(--#{$prefix}color-action-support-pressed) !default;
-// $ouds-button-color-bg-minimal-pressed-inverse: var(--#{$prefix}color-action-support-pressed-inverse) !default;
 $ouds-button-color-border-default-disabled: var(--#{$prefix}color-action-disabled) !default;
-// $ouds-button-color-border-default-disabled-inverse: var(--#{$prefix}color-action-disabled-inverse) !default;
 // $ouds-button-color-border-default-disabled-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-default-enabled: var(--#{$prefix}color-action-enabled) !default;
-// $ouds-button-color-border-default-enabled-inverse: var(--#{$prefix}color-action-enabled-inverse) !default;
 $ouds-button-color-border-default-focus: var(--#{$prefix}color-action-focus) !default;
-// $ouds-button-color-border-default-focus-inverse: var(--#{$prefix}color-action-focus-inverse) !default;
 // $ouds-button-color-border-default-focus-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-default-hover: var(--#{$prefix}color-action-hover) !default;
-// $ouds-button-color-border-default-hover-inverse: var(--#{$prefix}color-action-hover-inverse) !default;
 // $ouds-button-color-border-default-hover-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-default-loading: var(--#{$prefix}color-action-loading) !default;
-// $ouds-button-color-border-default-loading-inverse: var(--#{$prefix}color-action-loading-inverse) !default;
 // $ouds-button-color-border-default-loading-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-default-pressed: var(--#{$prefix}color-action-pressed) !default;
-// $ouds-button-color-border-default-pressed-inverse: var(--#{$prefix}color-action-pressed-inverse) !default;
 // $ouds-button-color-border-default-pressed-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-minimal-disabled: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-border-minimal-disabled-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-border-minimal-disabled-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-minimal-enabled: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-border-minimal-enabled-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-border-minimal-enabled-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-minimal-focus: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-border-minimal-focus-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-border-minimal-focus-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-minimal-hover: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-border-minimal-hover-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-border-minimal-hover-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-minimal-loading: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-border-minimal-loading-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-border-minimal-loading-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-minimal-pressed: var(--#{$prefix}color-opacity-invisible-black) !default;
-// $ouds-button-color-border-minimal-pressed-inverse: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-border-minimal-pressed-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-border-strong-disabled-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 // $ouds-button-color-border-strong-enabled-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
@@ -115,41 +91,23 @@ $ouds-button-color-border-minimal-pressed: var(--#{$prefix}color-opacity-invisib
 // $ouds-button-color-border-strong-loading-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-border-strong-pressed-mono: var(--#{$prefix}color-opacity-invisible-black) !default;
 $ouds-button-color-content-default-disabled: var(--#{$prefix}color-action-disabled) !default;
-// $ouds-button-color-content-default-disabled-inverse: var(--#{$prefix}color-action-disabled-inverse) !default;
 $ouds-button-color-content-default-enabled: var(--#{$prefix}color-action-enabled) !default;
-// $ouds-button-color-content-default-enabled-inverse: var(--#{$prefix}color-action-enabled-inverse) !default;
 $ouds-button-color-content-default-focus: var(--#{$prefix}color-action-focus) !default;
-// $ouds-button-color-content-default-focus-inverse: var(--#{$prefix}color-action-focus-inverse) !default;
 $ouds-button-color-content-default-hover: var(--#{$prefix}color-action-hover) !default;
-// $ouds-button-color-content-default-hover-inverse: var(--#{$prefix}color-action-hover-inverse) !default;
 $ouds-button-color-content-default-loading: var(--#{$prefix}color-action-loading) !default;
-// $ouds-button-color-content-default-loading-inverse: var(--#{$prefix}color-action-loading-inverse) !default;
 $ouds-button-color-content-default-pressed: var(--#{$prefix}color-action-pressed) !default;
-// $ouds-button-color-content-default-pressed-inverse: var(--#{$prefix}color-action-pressed-inverse) !default;
 $ouds-button-color-content-minimal-disabled: var(--#{$prefix}color-action-disabled) !default;
-// $ouds-button-color-content-minimal-disabled-inverse: var(--#{$prefix}color-action-disabled-inverse) !default;
 $ouds-button-color-content-minimal-enabled: var(--#{$prefix}color-action-enabled) !default;
-// $ouds-button-color-content-minimal-enabled-inverse: var(--#{$prefix}color-action-enabled-inverse) !default;
 $ouds-button-color-content-minimal-focus: var(--#{$prefix}color-action-focus) !default;
-// $ouds-button-color-content-minimal-focus-inverse: var(--#{$prefix}color-action-focus-inverse) !default;
 $ouds-button-color-content-minimal-hover: var(--#{$prefix}color-action-hover) !default;
-// $ouds-button-color-content-minimal-hover-inverse: var(--#{$prefix}color-action-hover-inverse) !default;
 $ouds-button-color-content-minimal-loading: var(--#{$prefix}color-action-loading) !default;
-// $ouds-button-color-content-minimal-loading-inverse: var(--#{$prefix}color-action-loading-inverse) !default;
 $ouds-button-color-content-minimal-pressed: var(--#{$prefix}color-action-pressed) !default;
-// $ouds-button-color-content-minimal-pressed-inverse: var(--#{$prefix}color-action-pressed-inverse) !default;
 $ouds-button-color-content-strong-disabled: var(--#{$prefix}color-action-disabled) !default;
-// $ouds-button-color-content-strong-disabled-inverse: var(--#{$prefix}color-action-disabled-inverse) !default;
 $ouds-button-color-content-strong-enabled: var(--#{$prefix}color-action-enabled) !default;
-// $ouds-button-color-content-strong-enabled-inverse: var(--#{$prefix}color-action-enabled-inverse) !default;
 $ouds-button-color-content-strong-focus: var(--#{$prefix}color-action-focus) !default;
-// $ouds-button-color-content-strong-focus-inverse: var(--#{$prefix}color-action-focus-inverse) !default;
 $ouds-button-color-content-strong-hover: var(--#{$prefix}color-action-hover) !default;
-// $ouds-button-color-content-strong-hover-inverse: var(--#{$prefix}color-action-hover-inverse) !default;
 $ouds-button-color-content-strong-loading: var(--#{$prefix}color-action-loading) !default;
-// $ouds-button-color-content-strong-loading-inverse: var(--#{$prefix}color-action-loading-inverse) !default;
 $ouds-button-color-content-strong-pressed: var(--#{$prefix}color-action-pressed) !default;
-// $ouds-button-color-content-strong-pressed-inverse: var(--#{$prefix}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;
@@ -169,11 +127,8 @@ $ouds-button-space-padding-inline-start-icon-end: $ouds-space-padding-inline-spa
 
 // 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;
 // scss-docs-end ouds-component-indicator
 
 // Input
@@ -201,51 +156,28 @@ $ouds-button-space-padding-inline-start-icon-end: $ouds-space-padding-inline-spa
 // $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;
@@ -253,40 +185,23 @@ $ouds-button-space-padding-inline-start-icon-end: $ouds-space-padding-inline-spa
 // $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-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;
-// $ouds-input-input-text-color-bg-default-enabled-inverse: $ouds-color-action-support-enabled-inverse !default;
 // $ouds-input-input-text-color-bg-default-focus: $ouds-color-action-support-focus !default;
-// $ouds-input-input-text-color-bg-default-focus-inverse: $ouds-color-action-support-focus-inverse !default;
 // $ouds-input-input-text-color-bg-default-hover: $ouds-color-action-support-hover !default;
-// $ouds-input-input-text-color-bg-default-hover-inverse: $ouds-color-action-support-hover-inverse !default;
 // $ouds-input-input-text-color-bg-default-loading: $ouds-color-action-support-loading !default;
-// $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;
-// $ouds-input-input-text-color-content-default-enabled-inverse: $ouds-color-content-default-inverse !default;
 // $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;
@@ -302,63 +217,34 @@ $ouds-button-space-padding-inline-start-icon-end: $ouds-space-padding-inline-spa
 // $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;
@@ -380,21 +266,13 @@ $ouds-button-space-padding-inline-start-icon-end: $ouds-space-padding-inline-spa
 // $ouds-navigation-link-color-content-hover-mono: $ouds-color-repository-neutral-emphasized-black !default;
 // $ouds-navigation-link-color-content-pressed-mono: $ouds-color-repository-opacity-black-higher !default;
 // $ouds-navigation-link-color-arrow-enabled: $ouds-color-content-brand-primary !default;
-// $ouds-navigation-link-color-arrow-enabled-inverse: $ouds-color-content-brand-primary-inverse !default;
 // $ouds-navigation-link-color-arrow-focus: $ouds-color-content-brand-primary !default;
-// $ouds-navigation-link-color-arrow-focus-inverse: $ouds-color-content-brand-primary-inverse !default;
 // $ouds-navigation-link-color-arrow-hover: $ouds-color-content-brand-primary !default;
-// $ouds-navigation-link-color-arrow-hover-inverse: $ouds-color-content-brand-primary-inverse !default;
 // $ouds-navigation-link-color-arrow-pressed: $ouds-color-content-brand-primary !default;
-// $ouds-navigation-link-color-arrow-pressed-inverse: $ouds-color-content-brand-primary-inverse !default;
 // $ouds-navigation-link-color-content-enabled: $ouds-color-action-enabled !default;
-// $ouds-navigation-link-color-content-enabled-inverse: $ouds-color-action-enabled-inverse !default;
 // $ouds-navigation-link-color-content-focus: $ouds-color-action-focus !default;
-// $ouds-navigation-link-color-content-focus-inverse: $ouds-color-action-focus-inverse !default;
 // $ouds-navigation-link-color-content-hover: $ouds-color-action-hover !default;
-// $ouds-navigation-link-color-content-hover-inverse: $ouds-color-action-hover-inverse !default;
 // $ouds-navigation-link-color-content-pressed: $ouds-color-action-pressed !default;
-// $ouds-navigation-link-color-content-pressed-inverse: $ouds-color-action-pressed-inverse !default;
 // $ouds-navigation-link-size-icon-medium: $ouds-size-icon-with-label-large-size-xs !default;
 // $ouds-navigation-link-size-icon-small: $ouds-size-icon-with-label-medium-size-sm !default;
 // $ouds-navigation-link-space-column-gap-arrow-medium: $ouds-space-column-gap-shorter !default;
diff --git a/scss/tokens/_raw.scss b/scss/tokens/_raw.scss
index 6e495f027b..70a9efb61b 100644
--- a/scss/tokens/_raw.scss
+++ b/scss/tokens/_raw.scss
@@ -92,7 +92,7 @@ $ouds-color-decorative-sky-900: #06202d !default;
 $ouds-color-functional-black: #000 !default;
 // $ouds-color-functional-dark-gray-80: #7a7a7a !default;
 // $ouds-color-functional-dark-gray-160: #707070 !default;
-$ouds-color-functional-dark-gray-240: #666 !default;
+// $ouds-color-functional-dark-gray-240: #666 !default;
 // $ouds-color-functional-dark-gray-320: #5c5c5c !default;
 $ouds-color-functional-dark-gray-400: #555 !default;
 // $ouds-color-functional-dark-gray-480: #444 !default;
@@ -115,14 +115,14 @@ $ouds-color-functional-light-gray-80: #f4f4f4 !default;
 $ouds-color-functional-light-gray-160: #eee !default;
 // $ouds-color-functional-light-gray-240: #e0e0e0 !default;
 // $ouds-color-functional-light-gray-320: #d6d6d6 !default;
-$ouds-color-functional-light-gray-400: #ccc !default;
+// $ouds-color-functional-light-gray-400: #ccc !default;
 // $ouds-color-functional-light-gray-480: #c2c2c2 !default;
 $ouds-color-functional-light-gray-560: #bbb !default;
 // $ouds-color-functional-light-gray-640: #adadad !default;
 // $ouds-color-functional-light-gray-720: #a3a3a3 !default;
 // $ouds-color-functional-light-gray-800: #999 !default;
-$ouds-color-functional-light-gray-880: #8f8f8f !default;
-$ouds-color-functional-light-gray-960: #858585 !default;
+// $ouds-color-functional-light-gray-880: #8f8f8f !default;
+// $ouds-color-functional-light-gray-960: #858585 !default;
 $ouds-color-functional-malachite-100: #edfcf0 !default;
 $ouds-color-functional-malachite-200: #c1f6ca !default;
 $ouds-color-functional-malachite-300: #94f0a4 !default;
diff --git a/site/assets/scss/_component-examples.scss b/site/assets/scss/_component-examples.scss
index ac6d23152c..4ff0db5de8 100644
--- a/site/assets/scss/_component-examples.scss
+++ b/site/assets/scss/_component-examples.scss
@@ -476,11 +476,11 @@
   --bs-border-color: var(--bs-color-border-emphasized);
 }
 
-.color-copy:hover svg {
+.color-copy:hover > svg {
   transform: scale(1.07);
 }
 
-.color-copy svg {
+.color-copy > svg {
   transition: transform .15s ease-in-out; // stylelint-disable-line property-disallowed-list
 }
 
diff --git a/site/content/docs/0.0/customize/color-palette.md b/site/content/docs/0.0/customize/color-palette.md
index d7bf29a21b..766f81ecef 100644
--- a/site/content/docs/0.0/customize/color-palette.md
+++ b/site/content/docs/0.0/customize/color-palette.md
@@ -22,7 +22,19 @@ This section exposes all the existing colors inside the OUDS Web palette. These
       <figure class="mb-none" aria-label="{{ $color.name }}">
         <button class="btn border-none p-none color-copy ratio ratio-1x1" data-clipboard-text="{{ $color.variable }}" data-bs-toggle="tooltip" data-bs-title="Copy to clipboard">
           <svg viewBox="0 0 100 100" aria-hidden="true" preserveAspectRatio="xMidYMid meet" {{ if or (or (or (eq $color.hex "#141414") (eq $color.hex "#fff")) (eq $color.hex "#000")) (strings.Contains $color.hex "rgba") }} style="border: 1px solid var(--bs-color-border-emphasized)" {{ end }}>
+          {{ if strings.Contains $color.hex "rgba" }}
+            <rect fill="#fff" width="50" height="100"/>
+            <rect fill="#141414" x="50" width="50" height="100"/>
+          {{ end -}}
             <rect fill="{{ $color.hex }}" width="100" height="100"/>
+          {{ if strings.Contains $color.hex "rgba" }}
+            <svg class="decorative-xs-icon text-black" x="15" y="15" width="20" height="20" aria-hidden="true">
+              <use xlink:href="#ui-light-mode"/>
+            </svg>
+            <svg class="decorative-xs-icon text-white" x="65" y="15" width="20" height="20" aria-hidden="true">
+              <use xlink:href="#ui-dark-mode"/>
+            </svg>
+          {{ end -}}
           </svg>
           <span class="visually-hidden">Copy variable name {{ $color.variable }}</span>
         </button>
diff --git a/site/data/colors.yml b/site/data/colors.yml
index dec02d8410..38b4e03a8d 100644
--- a/site/data/colors.yml
+++ b/site/data/colors.yml
@@ -9,7 +9,7 @@
 - name: red
   hex: "#ea0305"
 - name: orange
-  hex: "#f16e00"
+  hex: "#f15e00"
 - name: yellow
   hex: "#ffd000"
 - name: green
diff --git a/site/data/grays.yml b/site/data/grays.yml
index 0f1fc54cdc..429f364685 100644
--- a/site/data/grays.yml
+++ b/site/data/grays.yml
@@ -3,15 +3,15 @@
 - name: 200
   hex: "#eee"
 - name: 300
-  hex: "#ccc"
+  hex: "#bbb"
 - name: 400
   hex: "#bbb"
 - name: 500
-  hex: "#8f8f8f"
+  hex: "#555"
 - name: 600
-  hex: "#666"
-- name: 700
   hex: "#333"
+- name: 700
+  hex: "#272727"
 - name: 800
   hex: "#1f1f1f"
 - name: 900
diff --git a/site/data/palette.yml b/site/data/palette.yml
index 9d08667607..c4df345fb4 100644
--- a/site/data/palette.yml
+++ b/site/data/palette.yml
@@ -66,7 +66,7 @@
         hex: "#ff7900"
       - name: Orange 550
         variable: $ouds-color-orange-550
-        hex: "#f16e00"
+        hex: "#f15e00"
   - subcategory: Warm gray
     name: "warm-gray"
     colors:
@@ -91,27 +91,15 @@
       - name: Functional light gray 160
         variable: $ouds-color-functional-light-gray-160
         hex: "#eee"
-      - name: Functional light gray 400
-        variable: $ouds-color-functional-light-gray-400
-        hex: "#ccc"
       - name: Functional light gray 560
         variable: $ouds-color-functional-light-gray-560
         hex: "#ccc"
   - subcategory: Dark gray
     name: "dark-gray"
     colors:
-      - name: Functional dark gray 160
-        variable: $ouds-color-functional-dark-gray-160
-        hex: "#707070"
       - name: Functional dark gray 400
         variable: $ouds-color-functional-dark-gray-400
         hex: "#555"
-      - name: Functional dark gray 480
-        variable: $ouds-color-functional-dark-gray-480
-        hex: "#444"
-      - name: Functional dark gray 560
-        variable: $ouds-color-functional-dark-gray-560
-        hex: "#3d3d3d"
       - name: Functional dark gray 640
         variable: $ouds-color-functional-dark-gray-640
         hex: "#333"
@@ -133,9 +121,9 @@
   - subcategory: Functional malachite
     name: "functional-malachite"
     colors:
-      - name: Functional malachite 100
-        variable: $ouds-color-functional-malachite-100
-        hex: "#edfcf0"
+      - name: Functional malachite 300
+        variable: $ouds-color-functional-malachite-300
+        hex: "#94f0a4"
       - name: Functional malachite 500
         variable: $ouds-color-functional-malachite-500
         hex: "#3de35a"
@@ -148,6 +136,12 @@
       - name: Functional scarlet 100
         variable: $ouds-color-functional-scarlet-100
         hex: "#ffe5e6"
+      - name: Functional scarlet 200
+        variable: $ouds-color-functional-scarlet-200
+        hex: "#ffb2b3"
+      - name: Functional scarlet 300
+        variable: $ouds-color-functional-scarlet-300
+        hex: "#ff8081"
       - name: Functional scarlet 600
         variable: $ouds-color-functional-scarlet-600
         hex: "#ea0305"
@@ -163,9 +157,9 @@
   - subcategory: Functional dodger
     name: "functional-dodger"
     colors:
-      - name: Functional dodger 100
-        variable: $ouds-color-functional-dodger-100
-        hex: "#f0faff"
+      - name: Functional dodger 300
+        variable: $ouds-color-functional-dodger-300
+        hex: "#8ad5ff"
       - name: Functional dodger 500
         variable: $ouds-color-functional-dodger-500
         hex: "#26b2ff"
@@ -175,18 +169,15 @@
   - subcategory: Functional sun
     name: "functional-sun"
     colors:
-      - name: Functional sun 100
-        variable: $ouds-color-functional-sun-100
-        hex: "#fff7d6"
       - name: Functional sun 200
         variable: $ouds-color-functional-sun-200
         hex: "#ffed99"
+      - name: Functional sun 300
+        variable: $ouds-color-functional-sun-300
+        hex: "#ffe270"
       - name: Functional sun 500
         variable: $ouds-color-functional-sun-500
         hex: "#ffd000"
-      - name: Functional sun 600
-        variable: $ouds-color-functional-sun-600
-        hex: "#d6aa00"
       - name: Functional sun 900
         variable: $ouds-color-functional-sun-900
         hex: "#3d3100"
@@ -277,18 +268,72 @@
       - name: Decorative amethyst 800
         variable: $ouds-color-decorative-amethyst-800
         hex: "#2c174a"
-  - category: Transparent black
-    name: "transparent-black"
+  - category: Opacity white
+    name: "opacity-white"
+    colors:
+      - name: Opacity white 0
+        variable: $ouds-color-opacity-white-0
+        hex: "rgba(255, 255, 255, 0)"
+      - name: Opacity white 40
+        variable: $ouds-color-opacity-white-40
+        hex: "rgba(255, 255, 255, .04)"
+      - name: Opacity white 80
+        variable: $ouds-color-opacity-white-80
+        hex: "rgba(255, 255, 255, .08)"
+      - name: Opacity white 200
+        variable: $ouds-color-opacity-white-200
+        hex: "rgba(255, 255, 255, .2)"
+      - name: Opacity white 640
+        variable: $ouds-color-opacity-white-640
+        hex: "rgba(255, 255, 255, .64)"
+      - name: Opacity white 800
+        variable: $ouds-color-opacity-white-800
+        hex: "rgba(255, 255, 255, .8)"
+      - name: Opacity white 920
+        variable: $ouds-color-opacity-white-920
+        hex: "rgba(255, 255, 255, .92)"
+  - category: Opacity black
+    name: "opacity-black"
     colors:
-      - name: Transparent black 0
-        variable: $ouds-color-transparent-black-0
+      - name: Opacity black 0
+        variable: $ouds-color-opacity-black-0
         hex: "rgba(0, 0, 0, 0)"
-      - name: Transparent black 300
-        variable: $ouds-color-transparent-black-300
+      - name: Opacity black 40
+        variable: $ouds-color-opacity-black-40
+        hex: "rgba(0, 0, 0, .04)"
+      - name: Opacity black 80
+        variable: $ouds-color-opacity-black-80
+        hex: "rgba(0, 0, 0, .08)"
+      - name: Opacity black 160
+        variable: $ouds-color-opacity-black-160
         hex: "rgba(0, 0, 0, .16)"
-      - name: Transparent black 400
-        variable: $ouds-color-transparent-black-400
+      - name: Opacity black 200
+        variable: $ouds-color-opacity-black-200
+        hex: "rgba(0, 0, 0, .2)"
+      - name: Opacity black 240
+        variable: $ouds-color-opacity-black-240
         hex: "rgba(0, 0, 0, .24)"
-      - name: Transparent black 500
-        variable: $ouds-color-transparent-black-500
+      - name: Opacity black 320
+        variable: $ouds-color-opacity-black-320
         hex: "rgba(0, 0, 0, .32)"
+      - name: Opacity black 680
+        variable: $ouds-color-opacity-black-680
+        hex: "rgba(0, 0, 0, .68)"
+      - name: Opacity black 840
+        variable: $ouds-color-opacity-black-840
+        hex: "rgba(0, 0, 0, .84)"
+  - category: Opacity colored
+    name: "opacity"
+    colors:
+      - name: Opacity malachite
+        variable: $ouds-color-opacity-malachite
+        hex: "rgba(61, 227, 90, .12)"
+      - name: Opacity scarlet
+        variable: $ouds-color-opacity-scarlet
+        hex: "rgba(234, 3, 5, .08)"
+      - name: Opacity dodger blue
+        variable: $ouds-color-opacity-dodger-blue
+        hex: "rgba(38, 178, 255, .08)"
+      - name: Opacity sun
+        variable: $ouds-color-opacity-sun
+        hex: "rgba(255, 208, 0, .16)"
diff --git a/site/data/theme-colors.yml b/site/data/theme-colors.yml
index 6bffc7470d..991e654e1d 100644
--- a/site/data/theme-colors.yml
+++ b/site/data/theme-colors.yml
@@ -1,5 +1,5 @@
 - name: primary
-  hex: "#f16e00"
+  hex: "#f15e00"
   dark_hex: "#ff7900"
   description: "<b>Primary —</b> Main theme color, used for high emphasis and active component."
 - name: secondary