diff --git a/packages/theming/sass/color/_functions.scss b/packages/theming/sass/color/_functions.scss
index a995f57d..2629106d 100644
--- a/packages/theming/sass/color/_functions.scss
+++ b/packages/theming/sass/color/_functions.scss
@@ -74,7 +74,7 @@ $_enhanced-accessibility: false;
     $info-palette: if($info, shades('info', $info, $color-shades), ());
     $success-palette: if($success, shades('success', $success, $color-shades), ());
     $warn-palette: if($warn, shades('warn', $warn, $color-shades), ());
-    $error-palette: if($success, shades('error', $error, $color-shades), ());
+    $error-palette: if($error, shades('error', $error, $color-shades), ());
 
     @return (
         'primary': $primary-palette,
@@ -147,6 +147,11 @@ $_enhanced-accessibility: false;
     @if #{$name} == 'gray' {
         $lum: luminance($surface);
         $color: if($color, $color, if($lum > 0.5, #000, #fff));
+
+        @if #{$shade} == 'seed' {
+            @return (raw: $color, hsl: $color);
+        }
+
         $lmap: map.get(multipliers.$grayscale, 'l');
         $len: list.length($lmap);
         $i: list.index(map.keys($lmap), #{$shade});
@@ -167,7 +172,7 @@ $_enhanced-accessibility: false;
         $hsl: null;
         $raw: null;
 
-        @if #{$shade} == '500' {
+        @if #{$shade} == '500' or #{$shade} == 'seed' {
             $hsl: $color;
             $raw: $color;
         } @else {
diff --git a/packages/theming/sass/color/_types.scss b/packages/theming/sass/color/_types.scss
index cb47d7b8..14c672da 100644
--- a/packages/theming/sass/color/_types.scss
+++ b/packages/theming/sass/color/_types.scss
@@ -9,7 +9,7 @@
 /// A list consisting of all generated gray shades
 /// @type Map
 /// @access public
-$IGrayShades: ('50', '100', '200', '300', '400', '500', '600', '700', '800', '900');
+$IGrayShades: ('50', '100', '200', '300', '400', '500', '600', '700', '800', '900', 'seed');
 
 /// A list consisting of all generated shades for palette colors
 /// @type Map
diff --git a/packages/theming/tests/_color.spec.scss b/packages/theming/tests/_color.spec.scss
index 12b525fb..7d3d0b5d 100644
--- a/packages/theming/tests/_color.spec.scss
+++ b/packages/theming/tests/_color.spec.scss
@@ -17,6 +17,18 @@ $_success: green;
 $_info: blue;
 $_warn: orange;
 $_error: red;
+$_gray: #333;
+$_palette-with-gray: palette(
+    $primary: $_primary,
+    $secondary: $_secondary,
+    $surface: $_surface,
+    $success: $_success,
+    $info: $_info,
+    $warn: $_warn,
+    $error: $_error,
+    $gray: $_gray,
+    $variant: 'material',
+);
 $_palette: palette(
     $primary: $_primary,
     $secondary: $_secondary,
@@ -368,5 +380,37 @@ $_palette: palette(
                 }
             }
         }
+
+        @include describe('seed color variables') {
+            @include it('emits --ig-{name}-seed CSS variables; uses provided gray or derives from surface') {
+                // palette with explicitly provided gray
+                @include assert() {
+                    @include output($selector: false) {
+                        @include palette($_palette-with-gray);
+                    }
+
+                    @include contains($selector: false) {
+                        :root {
+                            --ig-primary-seed: #{$_primary};
+                            --ig-gray-seed: #{$_gray};
+                        }
+                    }
+                }
+
+                // palette with gray omitted — derived from surface (#fff → #000)
+                @include assert() {
+                    @include output($selector: false) {
+                        @include palette($_palette);
+                    }
+
+                    @include contains($selector: false) {
+                        :root {
+                            --ig-primary-seed: #{$_primary};
+                            --ig-gray-seed: #000;
+                        }
+                    }
+                }
+            }
+        }
     }
 }
diff --git a/packages/theming/tests/styles/_mocks.scss b/packages/theming/tests/styles/_mocks.scss
index 23a4d690..40c4074b 100644
--- a/packages/theming/tests/styles/_mocks.scss
+++ b/packages/theming/tests/styles/_mocks.scss
@@ -30,6 +30,8 @@ $handmade-palette: (
         'A400-contrast': white,
         'A700': #284ea8,
         'A700-contrast': white,
+        'seed': #6797de,
+        'seed-contrast': white,
     ),
     'secondary': (
         '50': #fef7e2,
@@ -60,6 +62,8 @@ $handmade-palette: (
         'A400-contrast': white,
         'A700': #f38e28,
         'A700-contrast': white,
+        'seed': #f7bd32,
+        'seed-contrast': white,
     ),
     'tertiary': (
         '500': #f7bd32,
@@ -86,6 +90,8 @@ $handmade-palette: (
         '800-contrast': white,
         '900': #1a1a1a,
         '900-contrast': white,
+        'seed': #b3b2b2,
+        'seed-contrast': black,
     ),
     'info': (
         '50': #fef7e2,
@@ -116,6 +122,8 @@ $handmade-palette: (
         'A400-contrast': white,
         'A700': #f38e28,
         'A700-contrast': white,
+        'seed': #f7bd32,
+        'seed-contrast': white,
     ),
     'success': (
         '50': #fef7e2,
@@ -146,6 +154,8 @@ $handmade-palette: (
         'A400-contrast': white,
         'A700': #f38e28,
         'A700-contrast': white,
+        'seed': #f7bd32,
+        'seed-contrast': white,
     ),
     'warn': (
         '50': #fef7e2,
@@ -176,6 +186,8 @@ $handmade-palette: (
         'A400-contrast': white,
         'A700': #f38e28,
         'A700-contrast': white,
+        'seed': #f7bd32,
+        'seed-contrast': white,
     ),
     'error': (
         '50': #fef7e2,
@@ -206,6 +218,8 @@ $handmade-palette: (
         'A400-contrast': white,
         'A700': #f38e28,
         'A700-contrast': white,
+        'seed': #f7bd32,
+        'seed-contrast': white,
     ),
     'surface': (
         '50': #fef7e2,
@@ -236,5 +250,7 @@ $handmade-palette: (
         'A400-contrast': white,
         'A700': #f38e28,
         'A700-contrast': white,
+        'seed': #f7bd32,
+        'seed-contrast': white,
     )
 );