diff --git a/docs/pages/material-ui/api/grid-2.json b/docs/pages/material-ui/api/grid-2.json
index 08188af737d19a..274c25ce265e93 100644
--- a/docs/pages/material-ui/api/grid-2.json
+++ b/docs/pages/material-ui/api/grid-2.json
@@ -53,7 +53,323 @@
   },
   "name": "Grid2",
   "imports": ["import Grid2 from '@mui/material/Grid2';", "import { Grid2 } from '@mui/material';"],
-  "classes": [],
+  "classes": [
+    {
+      "key": "container",
+      "className": "MuiGrid2-container",
+      "description": "Styles applied to the root element if `container={true}`.",
+      "isGlobal": false
+    },
+    {
+      "key": "direction-xs-column",
+      "className": "MuiGrid2-direction-xs-column",
+      "description": "Styles applied to the root element if `direction=\"column\"`.",
+      "isGlobal": false
+    },
+    {
+      "key": "direction-xs-column-reverse",
+      "className": "MuiGrid2-direction-xs-column-reverse",
+      "description": "Styles applied to the root element if `direction=\"column-reverse\"`.",
+      "isGlobal": false
+    },
+    {
+      "key": "direction-xs-row",
+      "className": "MuiGrid2-direction-xs-row",
+      "description": "Styles applied to the root element if `direction=\"row\"`.",
+      "isGlobal": false
+    },
+    {
+      "key": "direction-xs-row-reverse",
+      "className": "MuiGrid2-direction-xs-row-reverse",
+      "description": "Styles applied to the root element if `direction=\"row-reverse\"`.",
+      "isGlobal": false
+    },
+    { "key": "grid-lg-1", "className": "MuiGrid2-grid-lg-1", "description": "", "isGlobal": false },
+    {
+      "key": "grid-lg-10",
+      "className": "MuiGrid2-grid-lg-10",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-lg-11",
+      "className": "MuiGrid2-grid-lg-11",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-lg-12",
+      "className": "MuiGrid2-grid-lg-12",
+      "description": "",
+      "isGlobal": false
+    },
+    { "key": "grid-lg-2", "className": "MuiGrid2-grid-lg-2", "description": "", "isGlobal": false },
+    { "key": "grid-lg-3", "className": "MuiGrid2-grid-lg-3", "description": "", "isGlobal": false },
+    { "key": "grid-lg-4", "className": "MuiGrid2-grid-lg-4", "description": "", "isGlobal": false },
+    { "key": "grid-lg-5", "className": "MuiGrid2-grid-lg-5", "description": "", "isGlobal": false },
+    { "key": "grid-lg-6", "className": "MuiGrid2-grid-lg-6", "description": "", "isGlobal": false },
+    { "key": "grid-lg-7", "className": "MuiGrid2-grid-lg-7", "description": "", "isGlobal": false },
+    { "key": "grid-lg-8", "className": "MuiGrid2-grid-lg-8", "description": "", "isGlobal": false },
+    { "key": "grid-lg-9", "className": "MuiGrid2-grid-lg-9", "description": "", "isGlobal": false },
+    {
+      "key": "grid-lg-auto",
+      "className": "MuiGrid2-grid-lg-auto",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-lg-true",
+      "className": "MuiGrid2-grid-lg-true",
+      "description": "",
+      "isGlobal": false
+    },
+    { "key": "grid-md-1", "className": "MuiGrid2-grid-md-1", "description": "", "isGlobal": false },
+    {
+      "key": "grid-md-10",
+      "className": "MuiGrid2-grid-md-10",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-md-11",
+      "className": "MuiGrid2-grid-md-11",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-md-12",
+      "className": "MuiGrid2-grid-md-12",
+      "description": "",
+      "isGlobal": false
+    },
+    { "key": "grid-md-2", "className": "MuiGrid2-grid-md-2", "description": "", "isGlobal": false },
+    { "key": "grid-md-3", "className": "MuiGrid2-grid-md-3", "description": "", "isGlobal": false },
+    { "key": "grid-md-4", "className": "MuiGrid2-grid-md-4", "description": "", "isGlobal": false },
+    { "key": "grid-md-5", "className": "MuiGrid2-grid-md-5", "description": "", "isGlobal": false },
+    { "key": "grid-md-6", "className": "MuiGrid2-grid-md-6", "description": "", "isGlobal": false },
+    { "key": "grid-md-7", "className": "MuiGrid2-grid-md-7", "description": "", "isGlobal": false },
+    { "key": "grid-md-8", "className": "MuiGrid2-grid-md-8", "description": "", "isGlobal": false },
+    { "key": "grid-md-9", "className": "MuiGrid2-grid-md-9", "description": "", "isGlobal": false },
+    {
+      "key": "grid-md-auto",
+      "className": "MuiGrid2-grid-md-auto",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-md-true",
+      "className": "MuiGrid2-grid-md-true",
+      "description": "",
+      "isGlobal": false
+    },
+    { "key": "grid-sm-1", "className": "MuiGrid2-grid-sm-1", "description": "", "isGlobal": false },
+    {
+      "key": "grid-sm-10",
+      "className": "MuiGrid2-grid-sm-10",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-sm-11",
+      "className": "MuiGrid2-grid-sm-11",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-sm-12",
+      "className": "MuiGrid2-grid-sm-12",
+      "description": "",
+      "isGlobal": false
+    },
+    { "key": "grid-sm-2", "className": "MuiGrid2-grid-sm-2", "description": "", "isGlobal": false },
+    { "key": "grid-sm-3", "className": "MuiGrid2-grid-sm-3", "description": "", "isGlobal": false },
+    { "key": "grid-sm-4", "className": "MuiGrid2-grid-sm-4", "description": "", "isGlobal": false },
+    { "key": "grid-sm-5", "className": "MuiGrid2-grid-sm-5", "description": "", "isGlobal": false },
+    { "key": "grid-sm-6", "className": "MuiGrid2-grid-sm-6", "description": "", "isGlobal": false },
+    { "key": "grid-sm-7", "className": "MuiGrid2-grid-sm-7", "description": "", "isGlobal": false },
+    { "key": "grid-sm-8", "className": "MuiGrid2-grid-sm-8", "description": "", "isGlobal": false },
+    { "key": "grid-sm-9", "className": "MuiGrid2-grid-sm-9", "description": "", "isGlobal": false },
+    {
+      "key": "grid-sm-auto",
+      "className": "MuiGrid2-grid-sm-auto",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-sm-true",
+      "className": "MuiGrid2-grid-sm-true",
+      "description": "",
+      "isGlobal": false
+    },
+    { "key": "grid-xl-1", "className": "MuiGrid2-grid-xl-1", "description": "", "isGlobal": false },
+    {
+      "key": "grid-xl-10",
+      "className": "MuiGrid2-grid-xl-10",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-xl-11",
+      "className": "MuiGrid2-grid-xl-11",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-xl-12",
+      "className": "MuiGrid2-grid-xl-12",
+      "description": "",
+      "isGlobal": false
+    },
+    { "key": "grid-xl-2", "className": "MuiGrid2-grid-xl-2", "description": "", "isGlobal": false },
+    { "key": "grid-xl-3", "className": "MuiGrid2-grid-xl-3", "description": "", "isGlobal": false },
+    { "key": "grid-xl-4", "className": "MuiGrid2-grid-xl-4", "description": "", "isGlobal": false },
+    { "key": "grid-xl-5", "className": "MuiGrid2-grid-xl-5", "description": "", "isGlobal": false },
+    { "key": "grid-xl-6", "className": "MuiGrid2-grid-xl-6", "description": "", "isGlobal": false },
+    { "key": "grid-xl-7", "className": "MuiGrid2-grid-xl-7", "description": "", "isGlobal": false },
+    { "key": "grid-xl-8", "className": "MuiGrid2-grid-xl-8", "description": "", "isGlobal": false },
+    { "key": "grid-xl-9", "className": "MuiGrid2-grid-xl-9", "description": "", "isGlobal": false },
+    {
+      "key": "grid-xl-auto",
+      "className": "MuiGrid2-grid-xl-auto",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-xl-true",
+      "className": "MuiGrid2-grid-xl-true",
+      "description": "",
+      "isGlobal": false
+    },
+    { "key": "grid-xs-1", "className": "MuiGrid2-grid-xs-1", "description": "", "isGlobal": false },
+    {
+      "key": "grid-xs-10",
+      "className": "MuiGrid2-grid-xs-10",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-xs-11",
+      "className": "MuiGrid2-grid-xs-11",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-xs-12",
+      "className": "MuiGrid2-grid-xs-12",
+      "description": "",
+      "isGlobal": false
+    },
+    { "key": "grid-xs-2", "className": "MuiGrid2-grid-xs-2", "description": "", "isGlobal": false },
+    { "key": "grid-xs-3", "className": "MuiGrid2-grid-xs-3", "description": "", "isGlobal": false },
+    { "key": "grid-xs-4", "className": "MuiGrid2-grid-xs-4", "description": "", "isGlobal": false },
+    { "key": "grid-xs-5", "className": "MuiGrid2-grid-xs-5", "description": "", "isGlobal": false },
+    { "key": "grid-xs-6", "className": "MuiGrid2-grid-xs-6", "description": "", "isGlobal": false },
+    { "key": "grid-xs-7", "className": "MuiGrid2-grid-xs-7", "description": "", "isGlobal": false },
+    { "key": "grid-xs-8", "className": "MuiGrid2-grid-xs-8", "description": "", "isGlobal": false },
+    { "key": "grid-xs-9", "className": "MuiGrid2-grid-xs-9", "description": "", "isGlobal": false },
+    {
+      "key": "grid-xs-auto",
+      "className": "MuiGrid2-grid-xs-auto",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "grid-xs-true",
+      "className": "MuiGrid2-grid-xs-true",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "root",
+      "className": "MuiGrid2-root",
+      "description": "Styles applied to the root element.",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-0",
+      "className": "MuiGrid2-spacing-xs-0",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-1",
+      "className": "MuiGrid2-spacing-xs-1",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-10",
+      "className": "MuiGrid2-spacing-xs-10",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-2",
+      "className": "MuiGrid2-spacing-xs-2",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-3",
+      "className": "MuiGrid2-spacing-xs-3",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-4",
+      "className": "MuiGrid2-spacing-xs-4",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-5",
+      "className": "MuiGrid2-spacing-xs-5",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-6",
+      "className": "MuiGrid2-spacing-xs-6",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-7",
+      "className": "MuiGrid2-spacing-xs-7",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-8",
+      "className": "MuiGrid2-spacing-xs-8",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "spacing-xs-9",
+      "className": "MuiGrid2-spacing-xs-9",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "wrap-xs-nowrap",
+      "className": "MuiGrid2-wrap-xs-nowrap",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "wrap-xs-wrap",
+      "className": "MuiGrid2-wrap-xs-wrap",
+      "description": "",
+      "isGlobal": false
+    },
+    {
+      "key": "wrap-xs-wrap-reverse",
+      "className": "MuiGrid2-wrap-xs-wrap-reverse",
+      "description": "",
+      "isGlobal": false
+    }
+  ],
   "spread": true,
   "themeDefaultProps": true,
   "muiName": "MuiGrid2",
diff --git a/docs/translations/api-docs/grid-2/grid-2.json b/docs/translations/api-docs/grid-2/grid-2.json
index ef2a4d9cb8bba9..8f52d5af176b48 100644
--- a/docs/translations/api-docs/grid-2/grid-2.json
+++ b/docs/translations/api-docs/grid-2/grid-2.json
@@ -26,5 +26,116 @@
       "description": "Defines the <code>flex-wrap</code> style property. It&#39;s applied for all screen sizes."
     }
   },
-  "classDescriptions": {}
+  "classDescriptions": {
+    "container": {
+      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
+      "nodeName": "the root element",
+      "conditions": "<code>container={true}</code>"
+    },
+    "direction-xs-column": {
+      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
+      "nodeName": "the root element",
+      "conditions": "<code>direction=\"column\"</code>"
+    },
+    "direction-xs-column-reverse": {
+      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
+      "nodeName": "the root element",
+      "conditions": "<code>direction=\"column-reverse\"</code>"
+    },
+    "direction-xs-row": {
+      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
+      "nodeName": "the root element",
+      "conditions": "<code>direction=\"row\"</code>"
+    },
+    "direction-xs-row-reverse": {
+      "description": "Styles applied to {{nodeName}} if {{conditions}}.",
+      "nodeName": "the root element",
+      "conditions": "<code>direction=\"row-reverse\"</code>"
+    },
+    "grid-lg-1": { "description": "" },
+    "grid-lg-10": { "description": "" },
+    "grid-lg-11": { "description": "" },
+    "grid-lg-12": { "description": "" },
+    "grid-lg-2": { "description": "" },
+    "grid-lg-3": { "description": "" },
+    "grid-lg-4": { "description": "" },
+    "grid-lg-5": { "description": "" },
+    "grid-lg-6": { "description": "" },
+    "grid-lg-7": { "description": "" },
+    "grid-lg-8": { "description": "" },
+    "grid-lg-9": { "description": "" },
+    "grid-lg-auto": { "description": "" },
+    "grid-lg-true": { "description": "" },
+    "grid-md-1": { "description": "" },
+    "grid-md-10": { "description": "" },
+    "grid-md-11": { "description": "" },
+    "grid-md-12": { "description": "" },
+    "grid-md-2": { "description": "" },
+    "grid-md-3": { "description": "" },
+    "grid-md-4": { "description": "" },
+    "grid-md-5": { "description": "" },
+    "grid-md-6": { "description": "" },
+    "grid-md-7": { "description": "" },
+    "grid-md-8": { "description": "" },
+    "grid-md-9": { "description": "" },
+    "grid-md-auto": { "description": "" },
+    "grid-md-true": { "description": "" },
+    "grid-sm-1": { "description": "" },
+    "grid-sm-10": { "description": "" },
+    "grid-sm-11": { "description": "" },
+    "grid-sm-12": { "description": "" },
+    "grid-sm-2": { "description": "" },
+    "grid-sm-3": { "description": "" },
+    "grid-sm-4": { "description": "" },
+    "grid-sm-5": { "description": "" },
+    "grid-sm-6": { "description": "" },
+    "grid-sm-7": { "description": "" },
+    "grid-sm-8": { "description": "" },
+    "grid-sm-9": { "description": "" },
+    "grid-sm-auto": { "description": "" },
+    "grid-sm-true": { "description": "" },
+    "grid-xl-1": { "description": "" },
+    "grid-xl-10": { "description": "" },
+    "grid-xl-11": { "description": "" },
+    "grid-xl-12": { "description": "" },
+    "grid-xl-2": { "description": "" },
+    "grid-xl-3": { "description": "" },
+    "grid-xl-4": { "description": "" },
+    "grid-xl-5": { "description": "" },
+    "grid-xl-6": { "description": "" },
+    "grid-xl-7": { "description": "" },
+    "grid-xl-8": { "description": "" },
+    "grid-xl-9": { "description": "" },
+    "grid-xl-auto": { "description": "" },
+    "grid-xl-true": { "description": "" },
+    "grid-xs-1": { "description": "" },
+    "grid-xs-10": { "description": "" },
+    "grid-xs-11": { "description": "" },
+    "grid-xs-12": { "description": "" },
+    "grid-xs-2": { "description": "" },
+    "grid-xs-3": { "description": "" },
+    "grid-xs-4": { "description": "" },
+    "grid-xs-5": { "description": "" },
+    "grid-xs-6": { "description": "" },
+    "grid-xs-7": { "description": "" },
+    "grid-xs-8": { "description": "" },
+    "grid-xs-9": { "description": "" },
+    "grid-xs-auto": { "description": "" },
+    "grid-xs-true": { "description": "" },
+    "root": { "description": "Styles applied to the root element." },
+    "spacing-xs-0": { "description": "" },
+    "spacing-xs-1": { "description": "" },
+    "spacing-xs-10": { "description": "" },
+    "spacing-xs-2": { "description": "" },
+    "spacing-xs-3": { "description": "" },
+    "spacing-xs-4": { "description": "" },
+    "spacing-xs-5": { "description": "" },
+    "spacing-xs-6": { "description": "" },
+    "spacing-xs-7": { "description": "" },
+    "spacing-xs-8": { "description": "" },
+    "spacing-xs-9": { "description": "" },
+    "wrap-xs-nowrap": { "description": "" },
+    "wrap-xs-wrap": { "description": "" },
+    "wrap-xs-wrap-reverse": { "description": "" }
+  }
 }
diff --git a/packages/mui-material/src/Grid2/Grid2.tsx b/packages/mui-material/src/Grid2/Grid2.tsx
index d3d2a873bb52a7..1d2841bafa74c1 100644
--- a/packages/mui-material/src/Grid2/Grid2.tsx
+++ b/packages/mui-material/src/Grid2/Grid2.tsx
@@ -7,8 +7,6 @@ import requirePropFactory from '../utils/requirePropFactory';
 import { Theme, styled, Breakpoint } from '../styles';
 import { useDefaultProps } from '../DefaultPropsProvider';
 
-export type Grid2Slot = 'root';
-
 type ResponsiveStyleValue<T> = T | Array<T | null> | { [key in Breakpoint]?: T | null };
 
 export type GridDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
diff --git a/packages/mui-material/src/Grid2/grid2Classes.ts b/packages/mui-material/src/Grid2/grid2Classes.ts
index 1b530ed7f33680..e0a7b5b2825f3d 100644
--- a/packages/mui-material/src/Grid2/grid2Classes.ts
+++ b/packages/mui-material/src/Grid2/grid2Classes.ts
@@ -1,19 +1,40 @@
-import { GridClasses } from '@mui/system/Grid';
 import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
 import generateUtilityClass from '@mui/utils/generateUtilityClass';
 
-export type Grid2ClassKey = keyof GridClasses;
-
-export function getGrid2UtilityClass(slot: string): string {
-  return generateUtilityClass('MuiGrid2', slot);
-}
-
 const SPACINGS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10] as const;
 const DIRECTIONS = ['column-reverse', 'column', 'row-reverse', 'row'] as const;
 const WRAPS = ['nowrap', 'wrap-reverse', 'wrap'] as const;
 const GRID_SIZES = ['auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] as const;
 
-const grid2Classes: GridClasses = generateUtilityClasses('MuiGrid2', [
+export type Grid2DynamicClasses = {
+  [key in
+    | `spacing-xs-${(typeof SPACINGS)[number]}`
+    | `wrap-xs-${(typeof WRAPS)[number]}`
+    | `grid-${'xs' | 'sm' | 'md' | 'lg' | 'xl'}-${(typeof GRID_SIZES)[number]}`]: string;
+};
+
+export interface Grid2Classes extends Grid2DynamicClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the root element if `container={true}`. */
+  container: string;
+  /** Styles applied to the root element if `direction="column"`. */
+  'direction-xs-column': string;
+  /** Styles applied to the root element if `direction="column-reverse"`. */
+  'direction-xs-column-reverse': string;
+  /** Styles applied to the root element if `direction="row-reverse"`. */
+  'direction-xs-row-reverse': string;
+  /** Styles applied to the root element if `direction="row"`. */
+  'direction-xs-row': string;
+}
+
+export type Grid2ClassKey = keyof Grid2Classes;
+
+export function getGrid2UtilityClass(slot: string): string {
+  return generateUtilityClass('MuiGrid2', slot);
+}
+
+const grid2Classes: Grid2Classes = generateUtilityClasses('MuiGrid2', [
   'root',
   'container',
 
diff --git a/packages/mui-material/src/styles/createTheme.spec.ts b/packages/mui-material/src/styles/createTheme.spec.ts
index e9616276ef22fe..c5013e11fe4024 100644
--- a/packages/mui-material/src/styles/createTheme.spec.ts
+++ b/packages/mui-material/src/styles/createTheme.spec.ts
@@ -66,6 +66,28 @@ const theme = createTheme();
 {
   createTheme({
     components: {
+      MuiGrid2: {
+        styleOverrides: {
+          root: {
+            backgroundColor: 'red',
+          },
+          container: {
+            backgroundColor: 'red',
+          },
+          'spacing-xs-0': {
+            backgroundColor: 'red',
+          },
+          'direction-xs-column': {
+            backgroundColor: 'red',
+          },
+          'wrap-xs-nowrap': {
+            backgroundColor: 'red',
+          },
+          'grid-xs-1': {
+            backgroundColor: 'red',
+          },
+        },
+      },
       MuiPopper: {
         styleOverrides: {
           root: {
diff --git a/packages/mui-material/src/styles/overrides.d.ts b/packages/mui-material/src/styles/overrides.d.ts
index 4228da8c3e8f33..4f5e53a43a28c0 100644
--- a/packages/mui-material/src/styles/overrides.d.ts
+++ b/packages/mui-material/src/styles/overrides.d.ts
@@ -45,7 +45,7 @@ import { FormGroupClassKey } from '../FormGroup';
 import { FormHelperTextClassKey } from '../FormHelperText';
 import { FormLabelClassKey } from '../FormLabel';
 import { GridClassKey } from '../Grid';
-import { Grid2Slot } from '../Grid2';
+import { Grid2ClassKey } from '../Grid2';
 import { IconButtonClassKey } from '../IconButton';
 import { IconClassKey } from '../Icon';
 import { ImageListClassKey } from '../ImageList';
@@ -190,7 +190,7 @@ export interface ComponentNameToClassKey {
   MuiFormHelperText: FormHelperTextClassKey;
   MuiFormLabel: FormLabelClassKey;
   MuiGrid: GridClassKey;
-  MuiGrid2: Grid2Slot;
+  MuiGrid2: Grid2ClassKey;
   MuiIcon: IconClassKey;
   MuiIconButton: IconButtonClassKey;
   MuiImageList: ImageListClassKey;