mui · silviuaavram · Apr 8, 2026 · Apr 7, 2026 · Apr 7, 2026 · Apr 7, 2026
diff --git a/README.md b/README.md
@@ -1,7 +1,7 @@
 <!-- #host-reference -->
 <!-- markdownlint-disable-next-line -->
 <p align="center">
-  <a href="https://mui.com/core/" rel="noopener" target="_blank"><img width="150" height="133" src="https://mui.com/static/logo.svg" alt="Material UI logo"></a>
+  <a href="https://v7.mui.com/core/" rel="noopener" target="_blank"><img width="150" height="133" src="https://v7.mui.com/static/logo.svg" alt="Material UI logo"></a>
 </p>
 
 <h1 align="center">Material UI</h1>

diff --git a/docs/data/material/components/about-the-lab/about-the-lab.md b/docs/data/material/components/about-the-lab/about-the-lab.md
@@ -24,15 +24,15 @@ To install and save in your `package.json` dependencies, run one of the followin
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/lab @mui/material
+npm install @mui/lab@^7.0.0-beta @mui/material@^7.0.0
 ```
 
 ```bash pnpm
-pnpm add @mui/lab @mui/material
+pnpm add @mui/lab@^7.0.0-beta @mui/material@^7.0.0
 ```
 
 ```bash yarn
-yarn add @mui/lab @mui/material
+yarn add @mui/lab@^7.0.0-beta @mui/material@^7.0.0
 ```
 
 </codeblock>

diff --git a/docs/data/material/components/icons/icons.md b/docs/data/material/components/icons/icons.md
@@ -30,15 +30,15 @@ Run one of the following commands to install it and save it to your `package.jso
 
 <codeblock storageKey="package-manager">
 ```bash npm
-npm install @mui/icons-material
+npm install @mui/icons-material@^7.0.0
 ```
 
 ```bash pnpm
-pnpm add @mui/icons-material
+pnpm add @mui/icons-material@^7.0.0
 ```
 
 ```bash yarn
-yarn add @mui/icons-material
+yarn add @mui/icons-material@^7.0.0
 ```
 
 </codeblock>

diff --git a/docs/data/material/components/material-icons/material-icons.md b/docs/data/material/components/material-icons/material-icons.md
@@ -23,15 +23,15 @@ Use one of the following commands to install it:
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/icons-material @mui/material @emotion/styled @emotion/react
+npm install @mui/icons-material@^7.0.0 @mui/material@^7.0.0 @emotion/styled @emotion/react
 ```
 
 ```bash pnpm
-pnpm add @mui/icons-material @mui/material @emotion/styled @emotion/react
+pnpm add @mui/icons-material@^7.0.0 @mui/material@^7.0.0 @emotion/styled @emotion/react
 ```
 
 ```bash yarn
-yarn add @mui/icons-material @mui/material @emotion/styled @emotion/react
+yarn add @mui/icons-material@^7.0.0 @mui/material@^7.0.0 @emotion/styled @emotion/react
 ```
 
 </codeblock>

diff --git a/docs/data/material/getting-started/installation/installation.md b/docs/data/material/getting-started/installation/installation.md
@@ -11,15 +11,15 @@ Run one of the following commands to add Material UI to your project:
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/material @emotion/react @emotion/styled
+npm install @mui/material@^7.0.0 @emotion/react @emotion/styled
 ```
 
 ```bash pnpm
-pnpm add @mui/material @emotion/react @emotion/styled
+pnpm add @mui/material@^7.0.0 @emotion/react @emotion/styled
 ```
 
 ```bash yarn
-yarn add @mui/material @emotion/react @emotion/styled
+yarn add @mui/material@^7.0.0 @emotion/react @emotion/styled
 ```
 
 </codeblock>

diff --git a/docs/data/material/getting-started/templates/blog/README.md b/docs/data/material/getting-started/templates/blog/README.md
@@ -12,4 +12,4 @@
 
 <!-- #host-reference -->
 
-View the demo at https://mui.com/material-ui/getting-started/templates/blog/.
+View the demo at https://v7.mui.com/material-ui/getting-started/templates/blog/.
diff --git a/docs/data/material/getting-started/templates/checkout/README.md b/docs/data/material/getting-started/templates/checkout/README.md
@@ -12,4 +12,4 @@
 
 <!-- #host-reference -->
 
-View the demo at https://mui.com/material-ui/getting-started/templates/checkout/.
+View the demo at https://v7.mui.com/material-ui/getting-started/templates/checkout/.
diff --git a/docs/data/material/getting-started/templates/crud-dashboard/README.md b/docs/data/material/getting-started/templates/crud-dashboard/README.md
@@ -12,4 +12,4 @@
 
 <!-- #host-reference -->
 
-View the demo at https://mui.com/material-ui/getting-started/templates/crud-dashboard/.
+View the demo at https://v7.mui.com/material-ui/getting-started/templates/crud-dashboard/.
diff --git a/docs/data/material/getting-started/templates/dashboard/README.md b/docs/data/material/getting-started/templates/dashboard/README.md
@@ -12,4 +12,4 @@
 
 <!-- #host-reference -->
 
-View the demo at https://mui.com/material-ui/getting-started/templates/dashboard/.
+View the demo at https://v7.mui.com/material-ui/getting-started/templates/dashboard/.
diff --git a/docs/data/material/getting-started/templates/marketing-page/README.md b/docs/data/material/getting-started/templates/marketing-page/README.md
@@ -12,4 +12,4 @@
 
 <!-- #host-reference -->
 
-View the demo at https://mui.com/material-ui/getting-started/templates/marketing-page/.
+View the demo at https://v7.mui.com/material-ui/getting-started/templates/marketing-page/.
diff --git a/docs/data/material/getting-started/templates/sign-in-side/README.md b/docs/data/material/getting-started/templates/sign-in-side/README.md
@@ -12,4 +12,4 @@
 
 <!-- #host-reference -->
 
-View the demo at https://mui.com/material-ui/getting-started/templates/sign-in-side/.
+View the demo at https://v7.mui.com/material-ui/getting-started/templates/sign-in-side/.
diff --git a/docs/data/material/getting-started/templates/sign-in/README.md b/docs/data/material/getting-started/templates/sign-in/README.md
@@ -12,4 +12,4 @@
 
 <!-- #host-reference -->
 
-View the demo at https://mui.com/material-ui/getting-started/templates/sign-in/.
+View the demo at https://v7.mui.com/material-ui/getting-started/templates/sign-in/.
diff --git a/docs/data/material/getting-started/templates/sign-up/README.md b/docs/data/material/getting-started/templates/sign-up/README.md
@@ -12,4 +12,4 @@
 
 <!-- #host-reference -->
 
-View the demo at https://mui.com/material-ui/getting-started/templates/sign-up/.
+View the demo at https://v7.mui.com/material-ui/getting-started/templates/sign-up/.
diff --git a/docs/data/material/integrations/styled-components/styled-components.md b/docs/data/material/integrations/styled-components/styled-components.md
@@ -35,11 +35,11 @@ If you're using yarn, you can configure it using a package resolution:
 ```diff title="package.json"
  {
    "dependencies": {
--    "@mui/styled-engine": "latest"
-+    "@mui/styled-engine": "npm:@mui/styled-engine-sc@latest"
+-    "@mui/styled-engine": "^7.0.0"
++    "@mui/styled-engine": "npm:@mui/styled-engine-sc@^7.0.0"
    },
 +  "resolutions": {
-+    "@mui/styled-engine": "npm:@mui/styled-engine-sc@latest"
++    "@mui/styled-engine": "npm:@mui/styled-engine-sc@^7.0.0"
 +  },
  }
 ```

diff --git a/docs/data/material/migration/upgrade-to-v7/upgrade-to-native-color.md b/docs/data/material/migration/upgrade-to-v7/upgrade-to-native-color.md
@@ -14,15 +14,15 @@ Update Material UI to the latest version (or at least v7.3.0).
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/material@latest
+npm install @mui/material@^7.0.0
 ```
 
 ```bash pnpm
-pnpm add @mui/material@latest
+pnpm add @mui/material@^7.0.0
 ```
 
 ```bash yarn
-yarn add @mui/material@latest
+yarn add @mui/material@^7.0.0
 ```
 
 </codeblock>

diff --git a/docs/data/material/migration/upgrade-to-v7/upgrade-to-v7.md b/docs/data/material/migration/upgrade-to-v7/upgrade-to-v7.md
@@ -230,7 +230,7 @@ Depending on your project, you may follow one of the following approaches:
    <!-- #npm-tag-reference -->
 
    ```bash
-   npx @mui/codemod v7.0.0/grid-props <path/to/folder>
+   npx @mui/codemod@^7.0.0 v7.0.0/grid-props <path/to/folder>
    ```
 
    See the [Grid upgrade guide](/material-ui/migration/upgrade-to-grid-v2/) for more information.
@@ -303,7 +303,7 @@ Use this codemod to automatically update the `size` value:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod v7.0.0/input-label-size-normal-medium <path/to/folder>
+npx @mui/codemod@^7.0.0 v7.0.0/input-label-size-normal-medium <path/to/folder>
 ```
 
 **Note:** Because the default size of `InputLabel` was changed from `normal` to `medium`, the class `MuiInputLabel‑sizeMedium` is no longer added. If you relied on this class for custom styling, use a different class.
@@ -570,7 +570,7 @@ Use this codemod to automatically update the imports:
 <!-- #npm-tag-reference -->
 
 ```bash
-npx @mui/codemod v7.0.0/lab-removed-components <path/to/folder>
+npx @mui/codemod@^7.0.0 v7.0.0/lab-removed-components <path/to/folder>
 ```
 
 :::warning

diff --git a/docs/data/system/getting-started/installation/installation.md b/docs/data/system/getting-started/installation/installation.md
@@ -9,15 +9,15 @@ Run one of the following commands to add MUI System to your project:
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/system @emotion/react @emotion/styled
+npm install @mui/system@^7.0.0 @emotion/react @emotion/styled
 ```
 
 ```bash pnpm
-pnpm add @mui/system @emotion/react @emotion/styled
+pnpm add @mui/system@^7.0.0 @emotion/react @emotion/styled
 ```
 
 ```bash yarn
-yarn add @mui/system @emotion/react @emotion/styled
+yarn add @mui/system@^7.0.0 @emotion/react @emotion/styled
 ```
 
 </codeblock>
@@ -44,15 +44,15 @@ If you want to use [styled-components](https://styled-components.com/) instead,
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/system @mui/styled-engine-sc styled-components
+npm install @mui/system@^7.0.0 @mui/styled-engine-sc@^7.0.0 styled-components
 ```
 
 ```bash pnpm
-pnpm add @mui/system @mui/styled-engine-sc styled-components
+pnpm add @mui/system@^7.0.0 @mui/styled-engine-sc@^7.0.0 styled-components
 ```
 
 ```bash yarn
-yarn add @mui/system @mui/styled-engine-sc styled-components
+yarn add @mui/system@^7.0.0 @mui/styled-engine-sc@^7.0.0 styled-components
 ```
 
 </codeblock>

diff --git a/docs/public/static/error-codes.json b/docs/public/static/error-codes.json
@@ -18,6 +18,6 @@
   "17": "MUI: Expected valid input target. Did you use a custom `slots.input` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info.",
   "18": "MUI: The provided shorthand %s is invalid. The format should be `@<breakpoint | number>` or `@<breakpoint | number>/<container>`.\nFor example, `@sm` or `@600` or `@40rem/sidebar`.",
   "19": "MUI: The `experimental_sx` has been moved to `theme.unstable_sx`.For more details, see https://github.com/mui/material-ui/pull/35150.",
-  "20": "MUI: `vars` is a private field used for CSS variables support.\nPlease use another name or follow the [docs](https://mui.com/material-ui/customization/css-theme-variables/usage/) to enable the feature.",
+  "20": "MUI: `vars` is a private field used for CSS variables support.\nPlease use another name or follow the [docs](https://v7.mui.com/material-ui/customization/css-theme-variables/usage/) to enable the feature.",
   "21": "MUI: The `colorSchemes.%s` option is either missing or invalid."
 }
diff --git a/docs/src/modules/components/Head.tsx b/docs/src/modules/components/Head.tsx
@@ -8,7 +8,7 @@ import { pathnameToLanguage } from 'docs/src/modules/utils/helpers';
 // #host-reference
 const HOST = process.env.PULL_REQUEST_ID
   ? `https://deploy-preview-${process.env.PULL_REQUEST_ID}--${process.env.NETLIFY_SITE_NAME}.netlify.app`
-  : 'https://mui.com';
+  : 'https://v7.mui.com';
 
 interface HeadProps {
   card?: string;
@@ -64,7 +64,7 @@ export default function Head(props: HeadProps) {
             <link
               key={userLanguage2}
               rel="alternate"
-              href={`https://mui.com${
+              href={`https://v7.mui.com${
                 userLanguage2 === 'en' ? '' : `/${userLanguage2}`
               }${canonicalAs}`}
               hrefLang={userLanguage2}

diff --git a/docs/src/modules/sandbox/CodeSandbox.test.js b/docs/src/modules/sandbox/CodeSandbox.test.js
@@ -35,7 +35,7 @@ describe('CodeSandbox', () => {
           dependencies: {
             react: 'latest',
             // #npm-tag-reference
-            '@mui/material': 'latest',
+            '@mui/material': '^7.0.0',
             'react-dom': 'latest',
             '@emotion/react': 'latest',
             '@emotion/styled': 'latest',
@@ -127,7 +127,7 @@ ReactDOM.createRoot(document.querySelector("#root")).render(
           dependencies: {
             react: 'latest',
             // #npm-tag-reference
-            '@mui/material': 'latest',
+            '@mui/material': '^7.0.0',
             'react-dom': 'latest',
             '@emotion/react': 'latest',
             '@emotion/styled': 'latest',
@@ -234,7 +234,7 @@ ReactDOM.createRoot(document.querySelector("#root")!).render(
       '@emotion/react': 'latest',
       '@emotion/styled': 'latest',
       // #npm-tag-reference
-      '@mui/material': 'latest',
+      '@mui/material': '^7.0.0',
       react: 'latest',
       'react-dom': 'latest',
       typescript: 'latest',

diff --git a/docs/src/modules/sandbox/Dependencies.test.js b/docs/src/modules/sandbox/Dependencies.test.js
@@ -41,7 +41,7 @@ const styles = theme => ({
       '@emotion/styled': 'latest',
       '@foo-bar/bip': 'latest',
       // #npm-tag-reference
-      '@mui/material': 'latest',
+      '@mui/material': '^7.0.0',
       '@mui/base': 'latest',
       'prop-types': 'latest',
     });
@@ -73,7 +73,7 @@ const suggestions = [
       '@emotion/react': 'latest',
       '@emotion/styled': 'latest',
       // #npm-tag-reference
-      '@mui/material': 'latest',
+      '@mui/material': '^7.0.0',
       '@unexisting/thing': 'latest',
       'autosuggest-highlight': 'latest',
       'prop-types': 'latest',
@@ -103,8 +103,8 @@ import { LocalizationProvider as MuiPickersLocalizationProvider, KeyboardTimePic
       '@emotion/react': 'latest',
       '@emotion/styled': 'latest',
       // #npm-tag-reference
-      '@mui/material': 'latest',
-      '@mui/lab': 'latest',
+      '@mui/material': '^7.0.0',
+      '@mui/lab': '^7.0.0-beta',
     });
   });
 
@@ -131,8 +131,8 @@ import 'exceljs';
       '@emotion/react': 'latest',
       '@emotion/styled': 'latest',
       // #npm-tag-reference
-      '@mui/material': 'latest',
-      '@mui/lab': 'latest',
+      '@mui/material': '^7.0.0',
+      '@mui/lab': '^7.0.0-beta',
       exceljs: 'latest',
     });
   });
@@ -151,7 +151,7 @@ import 'exceljs';
       '@emotion/styled': 'latest',
       '@foo-bar/bip': 'latest',
       // #npm-tag-reference
-      '@mui/material': 'latest',
+      '@mui/material': '^7.0.0',
       '@mui/base': 'latest',
       typescript: 'latest',
     });
@@ -206,8 +206,8 @@ import {
       '@emotion/react': 'latest',
       '@emotion/styled': 'latest',
       // #npm-tag-reference
-      '@mui/material': 'latest',
-      '@mui/lab': 'latest',
+      '@mui/material': '^7.0.0',
+      '@mui/lab': '^7.0.0-beta',
     });
   });
 
@@ -227,8 +227,8 @@ import lab from '@mui/lab';
       '@emotion/react': 'latest',
       '@emotion/styled': 'latest',
       // #npm-tag-reference
-      '@mui/material': 'latest',
-      '@mui/lab': 'latest',
+      '@mui/material': '^7.0.0',
+      '@mui/lab': '^7.0.0-beta',
     });
   });
 
@@ -533,10 +533,10 @@ export default function EmailExample() {
       '@emotion/react': 'latest',
       '@emotion/styled': 'latest',
       // #npm-tag-reference
-      '@mui/icons-material': 'latest',
+      '@mui/icons-material': '^7.0.0',
       '@mui/joy': 'latest',
-      '@mui/material': 'latest',
-      '@mui/system': 'latest',
+      '@mui/material': '^7.0.0',
+      '@mui/system': '^7.0.0',
       typescript: 'latest',
     });
   });
@@ -558,7 +558,7 @@ import OutlinedInput from '@mui/material/OutlinedInput';
       '@emotion/react': 'latest',
       '@emotion/styled': 'latest',
       // #npm-tag-reference
-      '@mui/material': 'latest',
+      '@mui/material': '^7.0.0',
       '@base-ui/react': 'latest',
       typescript: 'latest',
     });

diff --git a/docs/src/modules/sandbox/Dependencies.ts b/docs/src/modules/sandbox/Dependencies.ts
@@ -59,7 +59,11 @@ export default function SandboxDependencies(
         return 'latest';
       }
       // #npm-tag-reference
-      return 'latest';
+      if (packageName === 'lab') {
+        return '^7.0.0-beta';
+      }
+      // #npm-tag-reference
+      return '^7.0.0';
     }
     return `https://pkg.pr.new/mui/material-ui/@mui/${packageName}@${commitRef}`;
   }
Original file line number	Diff line number	Diff line change
Expand Up		@@ -12,4 +12,4 @@

		<!-- #host-reference -->

		View the demo at https://mui.com/material-ui/getting-started/templates/blog/.
		View the demo at https://v7.mui.com/material-ui/getting-started/templates/blog/.