diff --git a/.eslintrc.js b/.eslintrc.js
index e15c9c6197d333..3c8f3dccaadd85 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -211,15 +211,6 @@ module.exports = {
       rules: {
         // does not work with wildcard imports. Mistakes will throw at runtime anyway
         'import/named': 'off',
-        'no-restricted-imports': [
-          'error',
-          {
-            // Use named import from `test/utils` instead.
-            // The other files are private.
-            patterns: ['test/utils/*'],
-          },
-        ],
-
         'material-ui/disallow-active-element-as-key-event-target': 'error',
 
         // upgraded level from recommended
diff --git a/.mocharc.js b/.mocharc.js
index 83a5c747ad403f..d57adb8886a831 100644
--- a/.mocharc.js
+++ b/.mocharc.js
@@ -10,7 +10,7 @@ module.exports = {
   recursive: true,
   timeout: (process.env.CIRCLECI === 'true' ? 5 : 2) * 1000, // Circle CI has low-performance CPUs.
   reporter: 'dot',
-  require: [require.resolve('./test/utils/setupBabel'), require.resolve('./test/utils/setupJSDOM')],
+  require: ['@mui-internal/test-utils/setupBabel', '@mui-internal/test-utils/setupJSDOM'],
   'watch-ignore': [
     // default
     '.git',
diff --git a/docs/data/joy/customization/default-theme-viewer/default-theme-viewer.md b/docs/data/joy/customization/default-theme-viewer/default-theme-viewer.md
index 73e3bff69c90d8..a40bf74898eae8 100644
--- a/docs/data/joy/customization/default-theme-viewer/default-theme-viewer.md
+++ b/docs/data/joy/customization/default-theme-viewer/default-theme-viewer.md
@@ -1,15 +1,13 @@
 # Default theme viewer
 
-<p class="description">Here's what the theme object looks like with the default values.</p>
+<p class="description">Check out how the theme object looks like with the default values.</p>
 
 :::warning
 This is a work in progress. We're still iterating on Joy UI's default theme.
 :::
 
-## Explore
-
-Explore the default theme:
+:::info
+To create your own theme, start by customizing the [theme colors](/joy-ui/customization/theme-colors/).
+:::
 
 {{"demo": "JoyDefaultTheme.js", "hideToolbar": true, "bg": "inline"}}
-
-To create your own theme, starts with customizing the [theme colors](/joy-ui/customization/theme-colors/).
diff --git a/docs/data/material/customization/default-theme/DefaultTheme.js b/docs/data/material/customization/default-theme/DefaultTheme.js
index 65896c27791d1c..86df7d9295d62b 100644
--- a/docs/data/material/customization/default-theme/DefaultTheme.js
+++ b/docs/data/material/customization/default-theme/DefaultTheme.js
@@ -1,12 +1,69 @@
 import * as React from 'react';
 import Box from '@mui/material/Box';
-import { createTheme } from '@mui/material/styles';
+import Divider from '@mui/material/Divider';
+import { createTheme, styled } from '@mui/material/styles';
 import FormControlLabel from '@mui/material/FormControlLabel';
 import Switch from '@mui/material/Switch';
 import { useTranslate } from 'docs/src/modules/utils/i18n';
 import ThemeViewer, {
   useNodeIdsLazy,
 } from 'docs/src/modules/components/ThemeViewer';
+import { blue, grey } from 'docs/src/modules/brandingTheme';
+
+const StyledSwitch = styled(Switch)(({ theme }) => [
+  {
+    display: 'flex',
+    padding: 0,
+    width: 32,
+    height: 20,
+    borderRadius: 99,
+    '&:active': {
+      '& .MuiSwitch-thumb': {
+        width: 16,
+      },
+      '& .MuiSwitch-switchBase.Mui-checked': {
+        transform: 'translateX(9px)',
+      },
+    },
+    '& .MuiSwitch-switchBase': {
+      padding: 2,
+      '&.Mui-checked': {
+        transform: 'translateX(12px)',
+        color: '#FFF',
+        '& + .MuiSwitch-track': {
+          opacity: 1,
+          backgroundColor: blue[500],
+        },
+      },
+    },
+    '& .MuiSwitch-thumb': {
+      width: 16,
+      height: 16,
+      borderRadius: 99,
+      transition: theme.transitions.create(['width'], {
+        duration: 200,
+      }),
+    },
+    '& .MuiSwitch-track': {
+      borderRadius: 16 / 2,
+      opacity: 1,
+      backgroundColor: grey[400],
+      boxSizing: 'border-box',
+    },
+    [`:where(${theme.vars ? '[data-mui-color-scheme="dark"]' : '.mode-dark'}) &`]: {
+      '& .MuiSwitch-switchBase': {
+        '&.Mui-checked': {
+          '& + .MuiSwitch-track': {
+            backgroundColor: blue[500],
+          },
+        },
+      },
+      '& .MuiSwitch-track': {
+        backgroundColor: grey[700],
+      },
+    },
+  },
+]);
 
 function DefaultTheme() {
   const [checked, setChecked] = React.useState(false);
@@ -58,31 +115,52 @@ function DefaultTheme() {
 
   return (
     <Box sx={{ width: '100%' }}>
-      <FormControlLabel
-        sx={{ pb: 1 }}
-        control={
-          <Switch
-            checked={checked}
-            onChange={(event) => {
-              setChecked(event.target.checked);
-              setExpandPaths(event.target.checked ? allNodeIds : []);
-            }}
-          />
-        }
-        label={t('expandAll')}
-      />
-      <FormControlLabel
-        sx={{ pb: 1 }}
-        control={
-          <Switch
-            checked={darkTheme}
-            onChange={(event) => {
-              setDarkTheme(event.target.checked);
-            }}
-          />
-        }
-        label={t('useDarkTheme')}
-      />
+      <Box sx={{ display: 'flex', gap: 2, mb: 3 }}>
+        <FormControlLabel
+          label={t('expandAll')}
+          sx={{
+            m: 0,
+            flexDirection: 'row-reverse',
+            gap: 1,
+            '& .MuiFormControlLabel-label': {
+              fontFamily: 'IBM Plex Sans',
+              color: 'text.secondary',
+            },
+          }}
+          control={
+            <StyledSwitch
+              size="small"
+              checked={checked}
+              onChange={(event) => {
+                setChecked(event.target.checked);
+                setExpandPaths(event.target.checked ? allNodeIds : []);
+              }}
+            />
+          }
+        />
+        <Divider orientation="vertical" flexItem />
+        <FormControlLabel
+          label={t('useDarkTheme')}
+          sx={{
+            m: 0,
+            flexDirection: 'row-reverse',
+            gap: 1,
+            '& .MuiFormControlLabel-label': {
+              fontFamily: 'IBM Plex Sans',
+              color: 'text.secondary',
+            },
+          }}
+          control={
+            <StyledSwitch
+              size="small"
+              checked={darkTheme}
+              onChange={(event) => {
+                setDarkTheme(event.target.checked);
+              }}
+            />
+          }
+        />
+      </Box>
       <ThemeViewer data={data} expandPaths={expandPaths} />
     </Box>
   );
diff --git a/docs/data/material/customization/default-theme/default-theme.md b/docs/data/material/customization/default-theme/default-theme.md
index 9cd0a0072de126..2af560cc3f6c07 100644
--- a/docs/data/material/customization/default-theme/default-theme.md
+++ b/docs/data/material/customization/default-theme/default-theme.md
@@ -1,12 +1,9 @@
 # Default theme viewer
 
-<p class="description">Here's what the theme object looks like with the default values.</p>
+<p class="description">Check out how the theme object looks like with the default values.</p>
 
-## Explore
-
-Explore the default theme object:
-
-{{"demo": "DefaultTheme.js", "hideToolbar": true, "bg": "inline"}}
+If you want to learn more about how the theme is assembled, take a look at [`material-ui/style/createTheme.js`](https://github.com/mui/material-ui/blob/-/packages/mui-material/src/styles/createTheme.js),
+and the related imports which `createTheme` uses.
 
 :::success
 You can play with the documentation theme object in your browser console,
@@ -14,10 +11,9 @@ as the `theme` variable is exposed on all the documentation pages.
 :::
 
 :::warning
-Please note that **the documentation site is using a custom theme**.
+Please note that **the documentation site is using a custom theme** (MUI's branding).
 :::
 
-<!-- #default-branch-switch -->
+<hr/>
 
-If you want to learn more about how the theme is assembled, take a look at [`material-ui/style/createTheme.js`](https://github.com/mui/material-ui/blob/-/packages/mui-material/src/styles/createTheme.js),
-and the related imports which `createTheme` uses.
+{{"demo": "DefaultTheme.js", "hideToolbar": true, "bg": "inline"}}
diff --git a/docs/package.json b/docs/package.json
index ae72f60128c557..04a4121a2de72f 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -118,6 +118,7 @@
     "@babel/plugin-transform-react-constant-elements": "^7.22.5",
     "@babel/preset-typescript": "^7.22.15",
     "@mui-internal/docs-utilities": "^1.0.0",
+    "@mui-internal/test-utils": "^1.0.0",
     "@types/autosuggest-highlight": "^3.2.0",
     "@types/chai": "^4.3.6",
     "@types/css-mediaquery": "^0.1.2",
@@ -140,7 +141,6 @@
     "playwright": "^1.37.1",
     "prettier": "^2.8.8",
     "tailwindcss": "^3.3.3",
-    "test": "5.0.0",
     "typescript-to-proptypes": "^5.0.0",
     "yargs": "^17.7.2"
   }
diff --git a/docs/pages/about.tsx b/docs/pages/about.tsx
index bbd7b21bb005cd..e79759b64383a8 100644
--- a/docs/pages/about.tsx
+++ b/docs/pages/about.tsx
@@ -1,716 +1,37 @@
 import * as React from 'react';
-import Avatar from '@mui/material/Avatar';
-import Box from '@mui/material/Box';
-import Button from '@mui/material/Button';
-import Container from '@mui/material/Container';
 import Divider from '@mui/material/Divider';
-import IconButton from '@mui/material/IconButton';
-import Grid from '@mui/material/Grid';
-import Paper, { PaperProps } from '@mui/material/Paper';
-import Typography from '@mui/material/Typography';
-import Tooltip from '@mui/material/Tooltip';
-import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded';
-import TwitterIcon from '@mui/icons-material/Twitter';
-import GitHubIcon from '@mui/icons-material/GitHub';
-import ForumRoundedIcon from '@mui/icons-material/ForumRounded';
-import PeopleRoundedIcon from '@mui/icons-material/PeopleRounded';
-import LocalAtmRoundedIcon from '@mui/icons-material/LocalAtmRounded';
-import Link from 'docs/src/modules/components/Link';
 import AppHeader from 'docs/src/layouts/AppHeader';
-import References, { CORE_CUSTOMERS } from 'docs/src/components/home/References';
-import HeroEnd from 'docs/src/components/home/HeroEnd';
 import AppFooter from 'docs/src/layouts/AppFooter';
-import MuiStatistics from 'docs/src/components/home/MuiStatistics';
-import GradientText from 'docs/src/components/typography/GradientText';
-import ROUTES from 'docs/src/route';
-import Section from 'docs/src/layouts/Section';
-import IconImage from 'docs/src/components/icon/IconImage';
+import AboutHero from 'docs/src/components/about/AboutHero';
+import OurValues from 'docs/src/components/about/OurValues';
+import Team from 'docs/src/components/about/Team';
+import HowToSupport from 'docs/src/components/about/HowToSupport';
+import AboutEnd from 'docs/src/components/about/AboutEnd';
 import Head from 'docs/src/modules/components/Head';
 import BrandingCssVarsProvider from 'docs/src/BrandingCssVarsProvider';
 import AppHeaderBanner from 'docs/src/components/banner/AppHeaderBanner';
-import teamMembers from 'docs/data/about/teamMembers.json';
-/**
- * Import data from: https://tools-public.mui.com/prod/pages/nSwYn51
-
-curl 'https://tools-public.mui.com/prod/api/data/muicomabout/queryAbout' \
-  -H 'content-type: application/json' \
-  --data-raw '{}' \
-  --compressed
-*/
-
-interface Profile {
-  name: string;
-  /**
-   * Role, what are you working on?
-   */
-  title: string;
-  /**
-   * Country where you live in, ISO 3166-1.
-   */
-  locationCountry: string; // https://flagpedia.net/download/api
-  /**
-   * Image URL.
-   */
-  src?: string;
-  /**
-   * Lives in.
-   */
-  location?: string;
-  /**
-   * Short summary about you.
-   */
-  about?: string;
-  github?: string;
-  twitter?: string;
-}
-
-function Person(props: Profile & { sx?: PaperProps['sx'] }) {
-  return (
-    <Paper variant="outlined" sx={{ p: 2, height: '100%', ...props.sx }}>
-      <Box
-        sx={{
-          display: 'flex',
-          alignItems: 'flex-start',
-          flexWrap: 'wrap',
-          '& > div': { minWidth: 'clamp(0px, (150px - 100%) * 999 ,100%)' },
-        }}
-      >
-        <Tooltip
-          title={props.location || false}
-          placement="right-end"
-          PopperProps={{
-            popperOptions: {
-              modifiers: [
-                {
-                  name: 'offset',
-                  options: {
-                    offset: [3, 2],
-                  },
-                },
-              ],
-            },
-          }}
-        >
-          <Box sx={{ position: 'relative', display: 'inline-block' }}>
-            <Avatar
-              variant="rounded"
-              imgProps={{
-                width: '70',
-                height: '70',
-                loading: 'lazy',
-              }}
-              src={props.src}
-              alt={props.name}
-              {...(props.src?.startsWith('https://avatars.githubusercontent.com') && {
-                src: `${props.src}?s=70`,
-                srcSet: `${props.src}?s=140 2x`,
-              })}
-              sx={(theme) => ({
-                width: 70,
-                height: 70,
-                borderRadius: 1,
-                backgroundColor: 'primary.100',
-                ...theme.applyDarkStyles({
-                  backgroundColor: 'primary.900',
-                }),
-              })}
-            />
-            <Box
-              sx={{
-                position: 'absolute',
-                bottom: 0,
-                right: 0,
-                transform: 'translateX(50%)',
-                boxShadow: '0px 4px 20px rgba(61, 71, 82, 0.25)',
-                width: 24,
-                height: 24,
-                border: '2px solid #fff',
-                backgroundColor: '#fff',
-                borderRadius: 40,
-                overflow: 'hidden',
-                display: 'flex',
-                justifyContent: 'center',
-              }}
-            >
-              <img
-                loading="lazy"
-                height="20"
-                src={`https://flagcdn.com/${props.locationCountry}.svg`}
-                alt=""
-              />
-            </Box>
-          </Box>
-        </Tooltip>
-        <Box sx={{ mx: 'auto', height: 15 }} />
-        <Box sx={{ mt: -0.5, mr: -0.5 }}>
-          {props.github && (
-            <IconButton
-              aria-label={`${props.name} github`}
-              component="a"
-              href={`https://github.com/${props.github}`}
-              target="_blank"
-              rel="noreferrer noopener"
-            >
-              <GitHubIcon fontSize="small" sx={{ color: 'grey.500' }} />
-            </IconButton>
-          )}
-          {props.twitter && (
-            <IconButton
-              aria-label={`${props.name} twitter`}
-              component="a"
-              href={`https://twitter.com/${props.twitter}`}
-              target="_blank"
-              rel="noreferrer noopener"
-            >
-              <TwitterIcon fontSize="small" sx={{ color: 'grey.500' }} />
-            </IconButton>
-          )}
-        </Box>
-      </Box>
-      <Typography variant="body2" fontWeight="bold" sx={{ mt: 2, mb: 0.5 }}>
-        {props.name}
-      </Typography>
-      <Typography variant="body2" color="text.secondary">
-        {props.title}
-      </Typography>
-      {props.about && (
-        <Divider
-          sx={(theme) => ({
-            my: 1,
-            borderColor: 'grey.100',
-            ...theme.applyDarkStyles({
-              borderColor: 'primaryDark.400',
-            }),
-          })}
-        />
-      )}
-      {props.about && (
-        <Typography variant="body2" color="text.secondary">
-          {props.about}
-        </Typography>
-      )}
-    </Paper>
-  );
-}
-
-function Widget({
-  children,
-  title,
-  icon,
-}: {
-  children: React.ReactNode;
-  title: string;
-  icon: React.ReactElement;
-}) {
-  return (
-    <Paper
-      variant="outlined"
-      sx={(theme) => ({
-        p: 4,
-        height: '100%',
-        position: 'relative',
-        borderRadius: '12px',
-        border: '1px solid',
-        borderColor: 'grey.100',
-        background: `${(theme.vars || theme).palette.gradients.linearSubtle}`,
-
-        ...theme.applyDarkStyles({
-          bgcolor: 'primaryDark.900',
-          borderColor: 'primaryDark.700',
-          background: `${(theme.vars || theme).palette.gradients.linearSubtle}`,
-        }),
-      })}
-    >
-      <Box
-        sx={(theme) => ({
-          width: 40,
-          height: 40,
-          display: 'flex',
-          justifyContent: 'center',
-          alignItems: 'center',
-          borderRadius: 1,
-          border: '1px solid',
-          borderColor: 'primary.200',
-          bgcolor: 'primary.50',
-          boxShadow:
-            '0px 1px 6px 0px rgba(194, 224, 255, 1), 0px 2px 30px 0px rgba(234, 237, 241, 0.3) inset',
-          ...theme.applyDarkStyles({
-            borderColor: 'primary.400',
-            bgcolor: 'primary.900',
-            boxShadow:
-              '0px 1px 6px 0px rgba(0, 89, 178, 1), 0px 2px 30px 0px rgba(0, 0, 0, 0.25) inset',
-          }),
-        })}
-      >
-        {icon}
-      </Box>
-      <Typography
-        fontWeight="bold"
-        component="h3"
-        color="text.primary"
-        variant="body2"
-        mt={2}
-        mb={0.5}
-      >
-        {title}
-      </Typography>
-      {children}
-    </Paper>
-  );
-}
-
-const contributors = [
-  {
-    name: 'Sebastian Silbermann',
-    github: 'eps1lon',
-    title: 'MUI Core, everything Open Source',
-    location: 'Berlin, Germany',
-    locationCountry: 'de',
-    src: 'https://avatars.githubusercontent.com/u/12292047',
-    twitter: 'sebsilbermann',
-  },
-  {
-    name: 'Ryan Cogswell',
-    github: 'ryancogswell',
-    title: 'Stack Overflow top contributor',
-    location: 'Minnesota, United States',
-    locationCountry: 'us',
-    src: 'https://avatars.githubusercontent.com/u/287804',
-  },
-  {
-    name: 'Yan Lee',
-    github: 'AGDholo',
-    title: 'Chinese docs',
-    location: 'China',
-    locationCountry: 'cn',
-    src: 'https://avatars.githubusercontent.com/u/13300332',
-  },
-  {
-    name: 'Jairon Alves Lima',
-    github: 'jaironalves',
-    title: 'Brazilian Portuguese docs',
-    location: 'São Paulo, Brazil',
-    locationCountry: 'br',
-    src: 'https://avatars.githubusercontent.com/u/29267813',
-  },
-  {
-    name: 'Danica Shen',
-    github: 'DDDDDanica',
-    title: 'Chinese docs',
-    location: 'Ireland',
-    locationCountry: 'ie',
-    src: 'https://avatars.githubusercontent.com/u/12678455',
-  },
-];
-
-const emeriti = [
-  {
-    name: 'Hai Nguyen',
-    github: 'hai-cea',
-    twitter: 'haicea',
-    title: 'MUI Core, v0.x creator',
-    location: 'Dallas, US',
-    locationCountry: 'us',
-    src: 'https://avatars.githubusercontent.com/u/2007468',
-  },
-  {
-    name: 'Nathan Marks',
-    github: 'nathanmarks',
-    title: 'MUI Core, v1.x co-creator',
-    location: 'Toronto, CA',
-    locationCountry: 'ca',
-    src: 'https://avatars.githubusercontent.com/u/4420103',
-  },
-  {
-    name: 'Kevin Ross',
-    github: 'rosskevin',
-    twitter: 'rosskevin',
-    title: 'MUI Core, flow',
-    location: 'Franklin, US',
-    locationCountry: 'us',
-    src: 'https://avatars.githubusercontent.com/u/136564',
-  },
-  {
-    name: 'Sebastian Sebald',
-    github: 'sebald',
-    twitter: 'sebastiansebald',
-    title: 'MUI Core',
-    location: 'Freiburg, Germany',
-    locationCountry: 'de',
-    src: 'https://avatars.githubusercontent.com/u/985701',
-  },
-  {
-    name: 'Ken Gregory',
-    github: 'kgregory',
-    title: 'MUI Core',
-    location: 'New Jersey, US',
-    locationCountry: 'us',
-    src: 'https://avatars.githubusercontent.com/u/3155127',
-  },
-  {
-    name: 'Tom Crockett',
-    github: 'pelotom',
-    twitter: 'pelotom',
-    title: 'MUI Core',
-    location: 'Los Angeles, US',
-    locationCountry: 'us',
-    src: 'https://avatars.githubusercontent.com/u/128019',
-  },
-  {
-    name: 'Maik Marschner',
-    github: 'leMaik',
-    twitter: 'leMaikOfficial',
-    title: 'MUI Core',
-    location: 'Hannover, Germany',
-    locationCountry: 'de',
-    src: 'https://avatars.githubusercontent.com/u/5544859',
-  },
-  {
-    name: 'Oleg Slobodskoi',
-    github: 'kof',
-    twitter: 'oleg008',
-    title: 'MUI Core, JSS',
-    location: 'Berlin, Germany',
-    locationCountry: 'de',
-    src: 'https://avatars.githubusercontent.com/u/52824',
-  },
-  {
-    name: 'Dmitriy Kovalenko',
-    github: 'dmtrKovalenko',
-    twitter: 'goose_plus_plus',
-    title: 'MUI X, date pickers',
-    location: 'Kharkiv, Ukraine',
-    locationCountry: 'ua',
-    src: 'https://avatars.githubusercontent.com/u/16926049',
-  },
-  {
-    name: 'Josh Wooding',
-    github: 'joshwooding',
-    twitter: 'JoshWooding_',
-    title: 'MUI Core, J.P. Morgan',
-    location: 'London, UK',
-    locationCountry: 'gb',
-    src: 'https://avatars.githubusercontent.com/u/12938082',
-  },
-];
-
-function AboutContent() {
-  return (
-    <React.Fragment>
-      <Container>
-        <Box
-          sx={{
-            pt: 12,
-
-            minHeight: 200,
-            display: 'flex',
-            flexDirection: 'column',
-            justifyContent: 'center',
-            alignItems: 'center',
-            maxWidth: 600,
-            mx: 'auto',
-            textAlign: 'center',
-          }}
-        >
-          <Typography variant="body2" color="primary.600" fontWeight="bold">
-            About us
-          </Typography>
-          <Typography component="h1" variant="h2" sx={{ my: 1 }}>
-            We&apos;re on a mission to make <br /> building UIs more{' '}
-            <GradientText>accessible</GradientText>
-          </Typography>
-          <Typography
-            color="text.secondary"
-            textAlign="center"
-            sx={{
-              maxWidth: { md: 500 },
-              minHeight: 48, // a hack to reduce CLS (layout shift)
-            }}
-          >
-            Our mission is to empower anyone to build UIs, faster. We&apos;re reducing the entry
-            barrier, making design skills accessible.
-          </Typography>
-        </Box>
-        <References companies={CORE_CUSTOMERS} />
-      </Container>
-      <Divider />
-      <Section bg="gradient" cozy>
-        <Grid container alignItems="center" spacing={4}>
-          <Grid item xs={12} md={6}>
-            <Typography variant="h2" sx={{ my: 1 }}>
-              Our <GradientText>ultimate</GradientText> goal
-            </Typography>
-            <Typography color="text.secondary" sx={{ mb: 1, maxWidth: 450 }}>
-              We aim high trying to design the most effective and efficient tool for building UIs,
-              for developers and designers. MUI started back in 2014, to unify React and Material
-              Design. Since then, we&apos;ve become a community of over 2M developers from every
-              corner of the world.
-            </Typography>
-            <Typography color="text.secondary" sx={{ mb: 2 }}>
-              We plan on doing all that cultivating our values:
-            </Typography>
-            {[
-              'Customer obsessed. We put our customers front & center.',
-              'Transparency. Most of our work is public.',
-              'Freedom. We work from anywhere in the world.',
-              'Autonomy. We want to create a safe, high-trust team.',
-              "Excellence. We're aiming high, and we know it.",
-            ].map((text) => (
-              <Box key={text} sx={{ display: 'flex', alignItems: 'center', mt: 1 }}>
-                <IconImage name="pricing/yes" />
-                <Typography variant="body2" color="text.primary" fontWeight={600} sx={{ ml: 1.5 }}>
-                  {text}
-                </Typography>
-              </Box>
-            ))}
-          </Grid>
-          <MuiStatistics />
-        </Grid>
-      </Section>
-      <Divider />
-      <Container sx={{ py: { xs: 4, md: 8 } }}>
-        <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
-          <div>
-            <Typography variant="h2" sx={{ my: 1 }}>
-              Team
-            </Typography>
-            <Typography color="text.secondary" sx={{ mb: 2, maxWidth: 450 }}>
-              MUI is maintained by a group of invaluable core contributors, with the massive support
-              and involvement of the community.
-            </Typography>
-            <Button
-              component={Link}
-              noLinkStyle
-              href={ROUTES.careers}
-              endIcon={<KeyboardArrowRightRounded fontSize="small" />}
-              variant="contained"
-              size="large"
-              sx={{ width: { xs: '100%', sm: 'auto' } }}
-            >
-              See open roles
-            </Button>
-          </div>
-        </Box>
-        <Divider sx={{ my: { xs: 2, sm: 4 } }} />
-        <Typography
-          component="h3"
-          variant="h5"
-          color="primary"
-          fontWeight="extraBold"
-          sx={{ mb: 1 }}
-          id="company"
-        >
-          Company
-        </Typography>
-        <Typography color="text.secondary" sx={{ maxWidth: { md: 450 } }}>
-          The development of the project and its ecosystem is guided by an international team.
-        </Typography>
-        <Box sx={{ pt: 2 }}>
-          <Grid container spacing={2}>
-            {(teamMembers as Array<Profile>).map((profileJson) => {
-              const profile = {
-                src: `/static/branding/about/${profileJson.name
-                  .split(' ')
-                  .map((x) => x.toLowerCase())
-                  .join('-')}.png`,
-                ...profileJson,
-              };
-              return (
-                <Grid key={profile.name} item xs={12} sm={6} md={3}>
-                  <Person {...profile} />
-                </Grid>
-              );
-            })}
-          </Grid>
-        </Box>
-      </Container>
-      <Divider />
-      <Box data-mui-color-scheme="dark" sx={{ bgcolor: 'primaryDark.900' }}>
-        <Container sx={{ py: { xs: 4, sm: 8 } }}>
-          <Typography
-            component="h3"
-            variant="h5"
-            color="primary.400"
-            fontWeight="extraBold"
-            sx={{ mb: 1 }}
-          >
-            Community contributors
-          </Typography>
-          <Typography color="text.secondary" sx={{ maxWidth: { md: 500 } }}>
-            Some members of the community have so enriched it, that they deserve special mention.
-          </Typography>
-          <Box sx={{ pt: 2, pb: { xs: 4, sm: 8 } }}>
-            <Grid container spacing={2}>
-              {contributors.map((profile) => (
-                <Grid key={profile.name} item xs={12} sm={6} md={3}>
-                  <Person {...profile} sx={{ bgcolor: 'primaryDark.600' }} />
-                </Grid>
-              ))}
-            </Grid>
-          </Box>
-          <Typography
-            component="h3"
-            variant="h5"
-            color="warning.500"
-            fontWeight="extraBold"
-            sx={{ mb: 1 }}
-          >
-            Community emeriti
-          </Typography>
-          <Typography color="text.secondary" sx={{ maxWidth: { md: 500 } }}>
-            We honor some no-longer-active core team members who have made valuable contributions in
-            the past. They advise us from time to time.
-          </Typography>
-          <Box sx={{ pt: 2 }}>
-            <Grid container spacing={2}>
-              {emeriti.map((profile) => (
-                <Grid key={profile.name} item xs={12} sm={6} md={3}>
-                  <Person {...profile} sx={{ bgcolor: 'primaryDark.600' }} />
-                </Grid>
-              ))}
-            </Grid>
-          </Box>
-        </Container>
-      </Box>
-      <Divider />
-      <Container sx={{ py: { xs: 4, md: 12 } }}>
-        <Typography variant="h2" sx={{ mt: 1, mb: { xs: 2, sm: 4 } }}>
-          How can you support us?
-        </Typography>
-        <Grid container spacing={3}>
-          <Grid item xs={12} sm={6} md={4}>
-            <Widget
-              icon={<ForumRoundedIcon fontSize="small" color="primary" />}
-              title="Give feedback"
-            >
-              <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
-                Tell us what and where we can improve or share your happy moments with us! You can
-                also up or downvote any page on our documentation. <br />
-                <br /> And lastly, from time to time, we send our community a survey for more
-                structured feedback, you&apos;re always invited to participate to share your
-                thoughts.
-              </Typography>
-              <Button
-                component="a"
-                // @ts-expect-error
-                variant="link"
-                size="small"
-                href="https://github.com/mui/material-ui/issues?q=is%3Aissue+is%3Aopen+sort%3Areactions-%2B1-desc"
-                endIcon={<KeyboardArrowRightRounded />}
-                sx={{ ml: -1 }}
-              >
-                Leave your feedback{' '}
-              </Button>
-            </Widget>
-          </Grid>
-          <Grid item xs={12} sm={6} md={4}>
-            <Widget
-              icon={<PeopleRoundedIcon fontSize="small" color="primary" />}
-              title="Join the community"
-            >
-              <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
-                Become a member of a huge community of developers supporting MUI. You can:
-              </Typography>
-              <Box
-                component="ul"
-                sx={{
-                  typography: 'body2',
-                  color: 'text.secondary',
-                  pl: 2,
-                  mb: 2,
-                }}
-              >
-                <li>
-                  Add new features by{' '}
-                  <Link href="https://github.com/mui/material-ui/blob/HEAD/CONTRIBUTING.md#your-first-pull-request">
-                    submitting a pull request
-                  </Link>
-                  .
-                </li>
-                <li>
-                  Fix bugs or{' '}
-                  <Link href="https://github.com/mui/material-ui/tree/HEAD/docs">
-                    improve our documentation
-                  </Link>
-                  .
-                </li>
-                <li>
-                  Help others by reviewing and commenting on existing{' '}
-                  <Link href="https://github.com/mui/material-ui/pulls">PRs</Link> and{' '}
-                  <Link href="https://github.com/mui/material-ui/issues">issues</Link>.
-                </li>
-                <li>
-                  Help <Link href="https://crowdin.com/project/material-ui-docs">translate</Link>{' '}
-                  the documentation.
-                </li>
-                <li>
-                  Answer questions on{' '}
-                  <Link href="https://stackoverflow.com/questions/tagged/material-ui">
-                    Stack Overflow
-                  </Link>
-                  .
-                </li>
-              </Box>
-              <Button
-                component="a"
-                // @ts-expect-error
-                variant="link"
-                size="small"
-                href="https://github.com/mui/material-ui"
-                endIcon={<KeyboardArrowRightRounded />}
-                sx={{ ml: -1 }}
-              >
-                See the repository
-              </Button>
-            </Widget>
-          </Grid>
-          <Grid item xs={12} sm={6} md={4}>
-            <Widget
-              icon={<LocalAtmRoundedIcon fontSize="small" color="primary" />}
-              title="Support us financially"
-            >
-              <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
-                If you use MUI in a commercial project and would like to support its continued
-                development by becoming a Sponsor, or in a side or hobby project and would like to
-                become a Backer, you can do so through {'Open Collective'}.
-                <br />
-                <br />
-                All funds donated are managed transparently, and Sponsors receive recognition in the
-                README and on the MUI home page.
-              </Typography>
-              <Button
-                component="a"
-                // @ts-expect-error
-                variant="link"
-                size="small"
-                href="https://opencollective.com/mui"
-                endIcon={<KeyboardArrowRightRounded />}
-                sx={{ ml: -1 }}
-              >
-                {'See Open Collective'}
-              </Button>
-            </Widget>
-          </Grid>
-        </Grid>
-      </Container>
-      <Divider />
-      <HeroEnd />
-      <Divider />
-    </React.Fragment>
-  );
-}
 
 export default function About() {
   return (
     <BrandingCssVarsProvider>
       <Head
         title="About us - MUI"
-        description="Our mission is to empower anyone to build UIs, faster. We're reducing the entry barrier, making design skills accessible."
+        description="MUI is a 100% remote globally distributed team, supported by a community of thousands
+        of developers all across the world."
       />
       <AppHeaderBanner />
       <AppHeader />
       <main id="main-content">
-        <AboutContent />
+        <AboutHero />
+        <Divider />
+        <OurValues />
+        <Divider />
+        <Team />
+        <Divider />
+        <HowToSupport />
+        <Divider />
+        <AboutEnd />
+        <Divider />
       </main>
       <AppFooter />
     </BrandingCssVarsProvider>
diff --git a/docs/pages/blog/2023-mui-values.js b/docs/pages/blog/2023-mui-values.js
new file mode 100644
index 00000000000000..f3ac9c68dd4704
--- /dev/null
+++ b/docs/pages/blog/2023-mui-values.js
@@ -0,0 +1,7 @@
+import * as React from 'react';
+import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog';
+import { docs } from './2023-mui-values.md?@mui/markdown';
+
+export default function Page() {
+  return <TopLayoutBlog docs={docs} />;
+}
diff --git a/docs/pages/blog/2023-mui-values.md b/docs/pages/blog/2023-mui-values.md
new file mode 100644
index 00000000000000..440d717cd3993c
--- /dev/null
+++ b/docs/pages/blog/2023-mui-values.md
@@ -0,0 +1,242 @@
+---
+title: Evolving MUI's core values and behaviors
+description: After significant growth, we united as a team to rediscover the values that underpin our shared sucess.
+date: 2023-09-26T00:00:00.000Z
+authors: ['mikailaread']
+card: true
+tags: ['Company']
+---
+
+## Why we chose to revise our core values
+
+MUI was founded in 2014 to grow and serve a community—from developers to designers, our core mission has always been to enable others to create incredible user experiences with unrivaled speed and ease.
+
+Along the way, we embraced certain core principles that guided our ways of working—how we think, act, and innovate have always been grounded in fulfilling the best interests of our community.
+
+In 2019, these became formalized in our first-ever company values: user obsession, excellence, transparency, freedom, and autonomy.
+
+Needless to say, we've seen significant growth since then: both for the company and its products, as well as the broader community surrounding us.
+
+That's why we wanted to take a moment to honor the values that led us to where we are today, and share how we've reshaped them to be an even more powerful force behind MUI's next phase of growth. 🚀
+
+## How we approached our values revision
+
+Company values show up in some facet of all our roles every day, whether we're evaluating different ideas, making tough decisions, or determining the biggest priorities.
+
+That's why it's so critical to ensure company values are actionable and authentic—that they are easily understood and truly shared by every MUIer.
+
+To make that happen, we decided to engage the whole company in a series of discovery and reflection exercises. 🔍
+
+This way, any changes to the company values—along with the language used to express them—would accurately reflect the values shared by our team. Here's how we did it! 👇
+
+<img alt="A collage of slides from the values discovery exercise kickoff." src="/static/blog/2023-mui-values/good-values.png" width="1200" height="840" loading="lazy" />
+
+## Stage one: discovery questions
+
+Kicking off, everyone was invited to answer 10 questions via an asynchronous survey.
+
+The purpose of this portion was to get a picture of how the existing values were being perceived and actioned throughout the company from day to day.
+It was also to give people an opportunity to express what they felt may be _missing_ and important to include for our future success.
+
+We asked people to reflect on how accurately they felt each value described our internal culture; what they felt our company cared deeply about and why; what is utterly unique about us as a team; and more. 🤔💭
+
+<img alt="A screenshot of the intro page to our discovery survey." src="/static/blog/2023-mui-values/values-survey.png" width="1200" height="1170" loading="lazy" style="margin-bottom: 16px;" />
+
+Then, using keyword and sentiment analysis, we captured clear themes in experience and common language used to describe our culture.
+I presented this back to the team via recorded video presentation, inviting reactions and further dialogue in the open of our Slack workspace.
+
+<img alt="A screenshot of a video message in our internal Slack revealing themes from the survey." src="/static/blog/2023-mui-values/themes-video.png" width="1200" height="750" loading="lazy" />
+
+## Stage two: workshop
+
+At the next stage, folks came together for a synchronous workshop.
+(This was completely voluntary, but I'm proud to say we had major representation from all different corners and levels of the company!)
+
+The purpose of this workshop was to pinpoint the _most_ critical mindsets and behaviors that we felt underpinned the company's success at scale.
+
+Broadly speaking, everyone was asked to consider:
+
+1. what mindsets and behaviors we should actively preserve and encourage as we scale—these are our superpowers and biggest differentiators. They're the stuff that makes us "us." 💚
+
+2. what mindsets and behaviors should we actively discourage, even punish—these are the biggest threats to our desired culture. They're the things we would never tolerate, maybe even at the cost of a customer. 🛑
+
+We used a shared FigJam board to brainstorm together against a timer, and repeated the process for different core questions.
+
+Once we'd generated a wonderfully full board, we took a pause to review the contributions.
+We upvoted cards that really stood out and resonated with us as individuals.
+
+Finally, we organized all of these cards into little clusters based on relatedness, and started to identify their underlying values and themes.
+
+We came up with a list of words that we felt best encapsulated each cluster. This became our values "shortlist."
+
+<img alt="description" src="/static/blog/2023-mui-values/figjam-board.png" width="1200" height="500" loading="lazy" />
+
+## Stage three: transforming the shortlist
+
+36.
+
+That's how many words surfaced in our workshop as potential values—or at least, as words to inspire the copywriting process.
+
+Narrowing down the shortlist gave us a chance to both find _and_ stress-test the strongest recurring themes. 🧪
+
+To do this, we immediately eliminated [what Patrick Lencioni calls "permission-to-play" values](https://www.youtube.com/watch?v=bNRn6FimzoU).
+These are the things as basic as showing respect, which might be _valuable_ to a great team culture and performance, but aren't exactly _exciting_ or _measurable_.
+They're simply the minimum required standard of behavior to work together.
+
+We also started striking out anything that could not clearly be expressed _as an action._
+
+It's [what Simon Sinek was talking about](https://www.youtube.com/watch?v=IQuYzXWXDqI) when he said "honesty is not a value."
+If there was not a clear and natural way to transform something into an action or provide examples of how it would be lived in our specific workplace, it was out. 🙅
+
+Success!
+
+We narrowed the list down from 36 to _just six._
+
+Now it was time to transform these six words into actionable phrases to inspire the very actions we want to see championed on a daily basis.
+
+## Stage four: pitching the 'PACT'
+
+All of the above and more influenced what's now referred to as our team "pact." (You'll see why.)
+
+But before we get there, I want to share a few examples of phrases that didn't wind up being a part of the pitch and why.
+
+Finding the right phraseology started with carefully reviewing _all_ team inputs.
+As I had a unique vantage point of all those inputs, I began to jot down phrases that effectively pulled from them _all_ and led with _action verbs._ 🕸️💪
+
+Things like "build in the open" made an appearance, but felt too limited.
+There was so much more we wanted to capture in the enduring theme of transparency, why it matters to us, and how we show it.
+
+Other phrases included "own your impact" and "maximize flexibility," but these, again, felt too limited and also generic.
+
+In short, they weren't right.
+
+Fortunately, this helped us find the ones that **\***are.**\*** 👏
+
+I presented a video presentation to our team, pitching this set of values and providing another opportunity for feedback and shaping.
+
+You can <a href="https://www.notion.so/mui-org/Values-behaviors-d3a1e1c60e2a4c0782f770cceada54bd?pvs=4#09dc19a420504a3090dc4fbe6a68a543">watch the "reveal" video for yourself here</a>! 🎬👀
+
+## Stage five: revising and finalizing
+
+Since we work asynchronously at MUI, we like to leave a good window of time for peers to properly review, digest, and offer thoughtful feedback.
+
+Since we place such a high value on quality and accuracy, we didn't want to rush this process, and so we extended our deadline for delivery.
+
+As we approached the finish line, I collaborated closely with our CEO and co-founder, Olivier. 🙋
+
+Our goal was to ensure that the final values not only reflected our team and company culture but, most importantly, that they could be integrated effectively into our company's operations and performance expectations.
+
+And we believe we've achieved just that! Here they come... 🥁
+
+## What are MUI's core values today?
+
+Our core four are:
+
+**P** — Put community first. "We never lose sight of who we're serving and why." 💙
+
+**A** — Avoid bureaucracy. "We're so not corporate—and we like it that way." 🚫
+
+**C** — Chase better. "We're driven by an unending desire to improve." 🌱
+
+**T** — Trust and deliver together. "We cultivate unity as the core of achievement." 🚀
+
+To delve deeper into the meaning of each value and what it looks like in practice, you can also check out our handbook: <a href="https://www.notion.so/mui-org/Values-behaviors-d3a1e1c60e2a4c0782f770cceada54bd?pvs=4">Values & Behaviors.</a>
+
+In it, we offer concrete examples of each core value and explicitly address tensions folks may encounter in trying to live them out.
+
+<img alt="description" src="/static/blog/2023-mui-values/notion-values-page.png" width="1200" height="1170" loading="lazy" />
+
+## What do they mean?
+
+### Put community first
+
+Put community first underscores our unwavering commitment to anchoring every decision in the best interests of the collective.
+
+By "community", we refer to both the user base that we serve and the team that propels us forward.
+
+The litmus test for any decision at MUI begins with a simple yet profound query: How does this contribute to our community's progress? We prioritize the needs and feedback of the community, and invest our efforts toward what will bring the greatest benefit to the greatest number of people.
+
+Putting community first means also that we consciously forge connections.
+We recognize that deeper mutual understanding fuels collective progress.
+By investing in relationships, we enhance collaboration, foster productive teamwork, and create a work environment that's as enjoyable as it is efficient.
+
+### Avoid bureaucracy
+
+Avoid bureaucracy is all about staying lean, open, and people-first.
+One of the core beliefs we hold at MUI is that people are the best experts on when, where, and how they will do their best work.
+
+We actively champion this principle by fostering an environment of unparalleled flexibility and autonomy, which serves as a bedrock for sustained excellence.
+
+Our dedication to shunning bureaucracy manifests in tangible ways—for instance, most of our communications and work are in the open.
+We default to transparency as much as possible.
+
+We don't over-structure, or add processes or hierarchies where they aren't needed.
+To introduce a process, we need to clearly show how it makes things 10x better than the current approach.
+
+We don't have lengthy approvals processes or a formalized chain of command; instead we collaborate as a tight-knit network where anyone can ask about and contribute to anything.
+
+### Chase "better"
+
+Chase "better" is all about consistently improving and developing in all aspects of our work as well as raising the bar for quality.
+
+It addresses our attitude to risk, feedback, and setbacks too.
+Genuine innovation demands a fearless embrace of the uncharted, even if it entails a touch of chaos.
+
+We want to create the exceptional—not the "good enough."
+So we tend to prioritize quality over speed.
+This doesn't mean we wait for things to be perfect before releasing them.
+
+On the contrary, "chase better" encourages us all to make small changes and incremental improvements again and again.
+
+It also encourages us to venture into unfamiliar territory and get out of our comfort zones in the name of growth.
+
+### Trust and deliver together
+
+Trust and deliver together is all about building trust, alignment, and shared responsibility.
+
+It reflects our commitment to following through and working as one force to solve problems and create value.
+
+In practice, this looks like: doing what we say we will; proactively communicating progress; adapting swiftly to changing circumstances and demands to guarantee success; and readily offering or seeking help when necessary.
+
+It's also about strategic collaboration, and being able to recognize and enlist one another for our unique strengths toward shared goals.
+
+"Trust and deliver together" reflects our firm belief that together, our combined efforts are stronger and more impactful than what we can achieve individually.
+
+## How do we reinforce values across the org?
+
+Articulating company values and operationalizing them are two different things.
+
+To ensure values don't become mere writing on the wall at MUI, we've purposefully woven them into internal processes and programs.
+We surface them often and stay attuned to how people are perceiving and connecting to them through different initiatives. 🌠🔦
+
+For example, before you even join MUI, you'll answer carefully chosen questions in your interviews.
+This helps us understand how well you align with our company values and how you might contribute to enhancing them and our culture. 📝
+
+On a day-to-day level, values show up everywhere.
+They're referenced in discussions and deliberations related to our work.
+We explicitly state how they directly influence our strategies and plans within our documents.
+Exemplifying core values is also a condition for promotion here and therefore a topic in performance and development conversations. 🆙
+
+As a fun way to reinforce values and show team gratitude, we've also created #Thanks-And-Praise Thursdays—a dedicated Slack channel that prompts us every Thursday to think about who we could recognize for championing core values and behaviors.
+
+Our design team even created custom illustrations and Slack emojis to make highlighting values-driven moments as simple as just a few clicks.
+(Thank you Gerda, Victor, and Danilo!) 🙏
+
+<img alt="Custom-designed illustrations for each MUI company value." src="/static/blog/2023-mui-values/values-illustrations.png" width="1200" height="500" loading="lazy" />
+
+## When might the values change again?
+
+MUI's first values were set forth by our founders during the earliest stages of the company, with the recognition that they would evolve alongside our company's growth.
+
+Those values remain foundational to the ways we work and engage.
+It's quite evident how these have been represented in new ways within the core four.
+
+But we don't expect these to last forever, either.
+
+As we continue to progress through new stages of development in the coming years, we intentionally plan to review our values and continue cultivating a values-driven culture.
+
+## Join the team
+
+Do these values resonate with you? Perhaps you'd like to be a part of shaping the future of MUI.
+
+[Visit our careers page now!](/careers/) 🏃💨
diff --git a/docs/pages/careers.tsx b/docs/pages/careers.tsx
index 97a32575e1d465..3af136634824f4 100644
--- a/docs/pages/careers.tsx
+++ b/docs/pages/careers.tsx
@@ -1,26 +1,27 @@
 import * as React from 'react';
 import { styled } from '@mui/material/styles';
 import Box from '@mui/material/Box';
-import Container from '@mui/material/Container';
 import Divider from '@mui/material/Divider';
 import Grid from '@mui/material/Grid';
 import Stack from '@mui/material/Stack';
 import Paper from '@mui/material/Paper';
 import Button from '@mui/material/Button';
+import Badge from '@mui/material/Badge';
 import Typography from '@mui/material/Typography';
 import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded';
 import KeyboardArrowDownRounded from '@mui/icons-material/KeyboardArrowDownRounded';
 import MuiAccordion from '@mui/material/Accordion';
 import MuiAccordionSummary from '@mui/material/AccordionSummary';
 import MuiAccordionDetail from '@mui/material/AccordionDetails';
+import OurValues from 'docs/src/components/about/OurValues';
 import Link from 'docs/src/modules/components/Link';
 import AppHeader from 'docs/src/layouts/AppHeader';
 import AppFooter from 'docs/src/layouts/AppFooter';
-import MuiStatistics from 'docs/src/components/home/MuiStatistics';
 import GradientText from 'docs/src/components/typography/GradientText';
 import IconImage from 'docs/src/components/icon/IconImage';
 import BrandingCssVarsProvider from 'docs/src/BrandingCssVarsProvider';
 import Section from 'docs/src/layouts/Section';
+import SectionHeadline from 'docs/src/components/typography/SectionHeadline';
 import Head from 'docs/src/modules/components/Head';
 import ROUTES from 'docs/src/route';
 import AppHeaderBanner from 'docs/src/components/banner/AppHeaderBanner';
@@ -44,20 +45,10 @@ function Role(props: RoleProps) {
         }}
       >
         <span>
-          <Typography
-            component="span"
-            variant="body1"
-            color="text.primary"
-            fontWeight={700}
-            sx={{ display: 'block', mb: 0.5 }}
-          >
+          <Typography variant="body1" color="text.primary" fontWeight="semiBold" gutterBottom>
             {props.title}
           </Typography>
-          <Typography
-            component="span"
-            color="text.secondary"
-            sx={{ display: 'block', mb: 1, maxWidth: 700 }}
-          >
+          <Typography component="p" color="text.secondary" sx={{ maxWidth: 700 }}>
             {props.description}
           </Typography>
         </span>
@@ -80,7 +71,7 @@ function Role(props: RoleProps) {
       <Typography variant="body1" color="text.primary" fontWeight={700} sx={{ my: 1 }}>
         {props.title}
       </Typography>
-      <Typography color="text.secondary" sx={{ mb: 1, maxWidth: 700 }}>
+      <Typography color="text.secondary" sx={{ maxWidth: 700 }}>
         {props.description}
       </Typography>
     </div>
@@ -92,7 +83,7 @@ const Accordion = styled(MuiAccordion)(({ theme }) => ({
   transition: theme.transitions.create('box-shadow'),
   borderRadius: theme.shape.borderRadius,
   '&:hover': {
-    boxShadow: '1px 1px 20px 0 rgb(90 105 120 / 20%)',
+    boxShadow: '0 4px 8px 0 rgb(90 105 120 / 20%)',
   },
   '&:not(:last-of-type)': {
     marginBottom: theme.spacing(2),
@@ -280,103 +271,40 @@ function CareersContent() {
   return (
     <React.Fragment>
       {/* Hero */}
-      <Container>
-        <Box
-          sx={{
-            height: '30vh',
-            minHeight: 300,
-            display: 'flex',
-            flexDirection: 'column',
-            justifyContent: 'center',
-            alignItems: 'center',
-            maxWidth: 600,
-            mx: 'auto',
-            textAlign: 'center',
-          }}
-        >
-          <Typography variant="body2" color="primary.600" fontWeight="bold">
-            Careers
-          </Typography>
-          <Typography component="h1" variant="h2" sx={{ my: 1 }}>
-            Build the <GradientText>next generation</GradientText> of tools for UI development
-          </Typography>
-          <Typography
-            color="text.secondary"
-            textAlign="center"
-            sx={{
-              maxWidth: { md: 500 },
-              minHeight: 48, // a hack to reduce CLS (layout shift)
-            }}
-          >
-            Our mission is to enable developers at every level of ability
-            <br /> to build great UIs, faster.
-          </Typography>
-        </Box>
-      </Container>
-      {/* Our ultimate goal */}
+      <Section cozy>
+        <SectionHeadline
+          alwaysCenter
+          overline="Join us"
+          title={
+            <Typography variant="h2" sx={{ maxWidth: 600, mx: 'auto' }}>
+              Build <GradientText>the next generation</GradientText>
+              <br /> of tools for UI development
+            </Typography>
+          }
+          description="Together, we are enabling developers & designers to bring stunning UIs to life with unrivalled speed and ease."
+        />
+      </Section>
       <Divider />
-      <Box
-        sx={(theme) => ({
-          bgcolor: 'grey.50',
-          ...theme.applyDarkStyles({
-            bgcolor: 'primaryDark.900',
-          }),
-        })}
-      >
-        <Section bg="gradient" cozy>
-          <Grid container alignItems="center" spacing={4}>
-            <Grid item xs={12} md={6}>
-              <Typography variant="h2" sx={{ my: 1 }}>
-                Our <GradientText>ultimate</GradientText> goal
-              </Typography>
-              <Typography color="text.secondary" sx={{ mb: 1, maxWidth: 450 }}>
-                We aim high trying to design the most effective and efficient tool for building UIs,
-                for developers and designers. MUI started back in 2014, to unify React and Material
-                Design. Since then, we&apos;ve become a community of over 2M developers from every
-                corner of the world.
-              </Typography>
-              <Typography color="text.secondary" sx={{ mb: 2 }}>
-                We plan on doing all that cultivating our values:
-              </Typography>
-              {[
-                'Customer obsessed. We put our customers front & center.',
-                "Excellence. We're aiming high, and we know it.",
-                'Transparency. Most of our work is public.',
-                'Freedom. We work from anywhere in the world.',
-                'Autonomy. We want to create a safe, high-trust team.',
-              ].map((text) => (
-                <Box key={text} sx={{ display: 'flex', alignItems: 'center', mt: 1 }}>
-                  <IconImage name="pricing/yes" />
-                  <Typography variant="body2" color="text.primary" fontWeight={600} sx={{ ml: 1 }}>
-                    {text}
-                  </Typography>
-                </Box>
-              ))}
-            </Grid>
-            <MuiStatistics />
-          </Grid>
-        </Section>
-      </Box>
+      <OurValues />
       <Divider />
       {/* Perks & benefits */}
-      <Section bg="transparent" cozy>
-        <Grid container alignItems="center" spacing={{ xs: 2, sm: 4 }}>
-          <Grid item xs={12} md={6} sx={{ pr: { sm: 0, md: 4 } }}>
-            <Typography variant="h2" sx={{ my: 1 }} id="perks-amp-benefits">
-              {'Perks & benefits'}
-            </Typography>
-            <Typography color="text.secondary" sx={{ mb: 2 }}>
-              To help you go above and beyond with us, we provide:
-            </Typography>
+      <Section bg="gradient" cozy>
+        <Grid container spacing={5} alignItems="center">
+          <Grid item md={6}>
+            <SectionHeadline
+              overline="Working at MUI"
+              title={<Typography variant="h2">Perks & benefits</Typography>}
+              description="To help you go above and beyond with us, we provide:"
+            />
             {[
-              ['Remote work:', 'Our entire company is distributed.'],
+              ['100% remote work:', 'Our entire company is globally distributed.'],
               [
                 'Retreats:',
-                'We meet up every eight months for a week of working and having fun together!',
+                'We meet up every 8 months for a week of working & having fun together!',
               ],
               [
                 'Equipment:',
-                'We will provide the hardware of your choice (initial grant of $2,500 USD).',
+                'We provide the hardware of your choice (initial grant of $2,500 USD).',
               ],
               ['Time off:', 'We provide 33 days of paid time off globally.'],
             ].map((textArray) => (
@@ -389,60 +317,85 @@ function CareersContent() {
               </Box>
             ))}
           </Grid>
-          <Grid item xs={12} sm={12} md={6}>
-            <Paper
-              component={Link}
-              href={ROUTES.blog}
-              noLinkStyle
-              variant="outlined"
-              sx={{ p: 2, width: { xs: '100%', sm: '50%' } }}
-            >
-              <Typography variant="body2" fontWeight="bold" sx={{ mb: 0.5 }}>
-                Blog
-              </Typography>
-              <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
-                Check behind the scenes and news from the company.
-              </Typography>
-              <Typography
-                sx={(theme) => ({
-                  color: 'primary.600',
-                  ...theme.applyDarkStyles({
-                    color: 'primary.400',
-                  }),
-                })}
-                variant="body2"
-                fontWeight="bold"
+          <Grid item xs={12} md={6} container>
+            <Box sx={{ display: 'flex', flexDirection: { xs: 'column', sm: 'row' }, gap: 2 }}>
+              <Paper
+                component={Link}
+                href={ROUTES.handbook}
+                noLinkStyle
+                variant="outlined"
+                sx={{ p: 2, width: '100%' }}
               >
-                Learn more{' '}
-                <KeyboardArrowRightRounded fontSize="small" sx={{ verticalAlign: 'middle' }} />
-              </Typography>
-            </Paper>
+                <Typography variant="body2" fontWeight="bold" sx={{ mb: 0.5 }}>
+                  Handbook
+                </Typography>
+                <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
+                  Learn everything about how MUI as a company is run.
+                </Typography>
+                <Typography
+                  sx={(theme) => ({
+                    color: 'primary.600',
+                    ...theme.applyDarkStyles({
+                      color: 'primary.400',
+                    }),
+                  })}
+                  variant="body2"
+                  fontWeight="bold"
+                >
+                  Learn more{' '}
+                  <KeyboardArrowRightRounded fontSize="small" sx={{ verticalAlign: 'middle' }} />
+                </Typography>
+              </Paper>
+              <Paper
+                component={Link}
+                href={ROUTES.blog}
+                noLinkStyle
+                variant="outlined"
+                sx={{ p: 2, width: '100%' }}
+              >
+                <Typography variant="body2" fontWeight="bold" sx={{ mb: 0.5 }}>
+                  Blog
+                </Typography>
+                <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
+                  Check behind the scenes and news from the company.
+                </Typography>
+                <Typography
+                  sx={(theme) => ({
+                    color: 'primary.600',
+                    ...theme.applyDarkStyles({
+                      color: 'primary.400',
+                    }),
+                  })}
+                  variant="body2"
+                  fontWeight="bold"
+                >
+                  Learn more{' '}
+                  <KeyboardArrowRightRounded fontSize="small" sx={{ verticalAlign: 'middle' }} />
+                </Typography>
+              </Paper>
+            </Box>
           </Grid>
         </Grid>
       </Section>
-      {/* Open roles */}
       <Divider />
-      <Container sx={{ py: { xs: 4, md: 8 } }}>
-        <div>
-          <Typography variant="h2" sx={{ my: 1 }} id="open-roles">
-            {`Open roles (${openRolesData.reduce((acc, item) => acc + item.roles.length, 0)})`}
-          </Typography>
-          <Typography color="text.secondary" sx={{ mb: 2, maxWidth: 500 }}>
-            The company is bootstrapped (so far). It was incorporated in mid-2019 and is growing
-            fast (x2 YoY). We doubled the team in 2020 (6), accelerated in 2021 (15), kept a similar
-            pace in 2022 (25), and we plan to double it in 2023 (50). We&apos;re looking for help to
-            grow in the following areas:
-          </Typography>
-        </div>
-        <Divider
-          sx={(theme) => ({
-            my: { xs: 2, sm: 4 },
-            borderColor: 'grey.100',
-            ...theme.applyDarkStyles({
-              borderColor: 'primaryDark.600',
-            }),
-          })}
+      {/* Open roles */}
+      <Section cozy>
+        <SectionHeadline
+          title={
+            <Typography variant="h2" id="open-roles" gutterBottom>
+              Open roles
+              <Badge
+                badgeContent={openRolesData.reduce((acc, item) => acc + item.roles.length, 0)}
+                color="success"
+                showZero
+                sx={{ ml: 3 }}
+              />
+            </Typography>
+          }
+          description="The company is bootstrapped (so far). It was incorporated in mid-2019 and is growing fast (x2 YoY). We doubled the team in 2020 (6), accelerated in 2021 (15), kept a similar pace in 2022 (25), and we plan to double it in 2023 (50). We're looking for help to
+          grow in the following areas:"
         />
+        <Divider sx={{ my: { xs: 2, sm: 4 } }} />
         <Stack
           spacing={2}
           divider={
@@ -480,39 +433,31 @@ function CareersContent() {
             );
           })}
         </Stack>
-      </Container>
-      {/* Next roles */}
+      </Section>
       <Divider />
-      {nextRolesData.length > 0 ? (
+      {/* Next roles */}
+      {nextRolesData.length > 0 && (
         <Box data-mui-color-scheme="dark" sx={{ bgcolor: 'primaryDark.900' }}>
-          <Container sx={{ py: { xs: 4, md: 8 } }}>
-            <Box
-              sx={{
-                display: 'flex',
-                justifyContent: 'space-between',
-                alignItems: 'center',
-              }}
-            >
-              <div>
-                <Typography variant="h2" sx={{ my: 1 }} id="next-roles">
+          <Section bg="transparent">
+            <SectionHeadline
+              title={
+                <Typography variant="h2" id="next-roles" gutterBottom>
                   Next roles
                 </Typography>
-                <Typography color="text.secondary" sx={{ mb: 2, maxWidth: 450 }}>
+              }
+              description={
+                <React.Fragment>
                   We hire in batches, we collect applications a few months before we actively aim to
-                  fill the roles. If none of these roles fit with what you are looking for, you can
-                  apply to the{' '}
+                  fill the roles. If none of them fit with what you are looking for, apply to the{' '}
                   <Link href="https://jobs.ashbyhq.com/MUI/4715d81f-d00f-42d4-a0d0-221f40f73e19/application?utm_source=ZNRrPGBkqO">
                     Dream job
                   </Link>{' '}
                   role.
-                </Typography>
-              </div>
-            </Box>
-            <Divider sx={{ my: { xs: 2, sm: 4 }, borderColor: 'primaryDark.600' }} />
-            <Stack
-              spacing={2}
-              divider={<Divider sx={{ my: { xs: 1, sm: 2 }, borderColor: 'primaryDark.600' }} />}
-            >
+                </React.Fragment>
+              }
+            />
+            <Divider sx={{ my: { xs: 2, sm: 4 } }} />
+            <Stack spacing={2} divider={<Divider sx={{ my: { xs: 1, sm: 2 } }} />}>
               {nextRolesData.map((category) => {
                 const roles = category.roles;
                 return (
@@ -536,9 +481,9 @@ function CareersContent() {
                 );
               })}
             </Stack>
-          </Container>
+          </Section>
         </Box>
-      ) : null}
+      )}
       <Divider />
       {/* Frequently asked questions */}
       <Section bg="transparent">
@@ -557,10 +502,9 @@ function CareersContent() {
               sx={(theme) => ({
                 p: 2,
                 borderStyle: 'dashed',
-                borderColor: 'grey.300',
+                borderColor: 'divider',
                 bgcolor: 'white',
                 ...theme.applyDarkStyles({
-                  borderColor: 'primaryDark.600',
                   bgcolor: 'primaryDark.800',
                 }),
               })}
@@ -570,11 +514,11 @@ function CareersContent() {
                   Got any questions unanswered or need more help?
                 </Typography>
               </Box>
-              <Typography variant="body2" color="text.primary" sx={{ my: 1, textAlign: 'left' }}>
+              <Typography variant="body2" color="text.secondary" sx={{ my: 1, textAlign: 'left' }}>
                 We&apos;re to help you with any other question you have about our hiring process.
               </Typography>
               <Link href="mailto:job@mui.com" variant="body2">
-                Contact us <KeyboardArrowRightRounded fontSize="small" sx={{ mt: '1px' }} />
+                Contact us <KeyboardArrowRightRounded fontSize="small" />
               </Link>
             </Paper>
           </Grid>
diff --git a/docs/pages/joy-ui/customization/default-theme-viewer.js b/docs/pages/joy-ui/customization/default-theme-viewer.js
index f9d7d1f31db2ec..363dcad36672f4 100644
--- a/docs/pages/joy-ui/customization/default-theme-viewer.js
+++ b/docs/pages/joy-ui/customization/default-theme-viewer.js
@@ -3,5 +3,5 @@ import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs';
 import * as pageProps from 'docs/data/joy/customization/default-theme-viewer/default-theme-viewer.md?@mui/markdown';
 
 export default function Page() {
-  return <MarkdownDocs {...pageProps} />;
+  return <MarkdownDocs {...pageProps} disableToc />;
 }
diff --git a/docs/pages/material-ui/customization/default-theme.js b/docs/pages/material-ui/customization/default-theme.js
index 12eb3b936ed344..de6a628f17fe7c 100644
--- a/docs/pages/material-ui/customization/default-theme.js
+++ b/docs/pages/material-ui/customization/default-theme.js
@@ -3,5 +3,5 @@ import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs';
 import * as pageProps from 'docs/data/material/customization/default-theme/default-theme.md?@mui/markdown';
 
 export default function Page() {
-  return <MarkdownDocs {...pageProps} />;
+  return <MarkdownDocs {...pageProps} disableToc />;
 }
diff --git a/docs/public/static/blog/2023-mui-values/card.png b/docs/public/static/blog/2023-mui-values/card.png
new file mode 100644
index 00000000000000..ec53edc9673498
Binary files /dev/null and b/docs/public/static/blog/2023-mui-values/card.png differ
diff --git a/docs/public/static/blog/2023-mui-values/email.png b/docs/public/static/blog/2023-mui-values/email.png
new file mode 100644
index 00000000000000..7a3bef201ee213
Binary files /dev/null and b/docs/public/static/blog/2023-mui-values/email.png differ
diff --git a/docs/public/static/blog/2023-mui-values/figjam-board.png b/docs/public/static/blog/2023-mui-values/figjam-board.png
new file mode 100644
index 00000000000000..2da3e3ccf5d6b6
Binary files /dev/null and b/docs/public/static/blog/2023-mui-values/figjam-board.png differ
diff --git a/docs/public/static/blog/2023-mui-values/good-values.png b/docs/public/static/blog/2023-mui-values/good-values.png
new file mode 100644
index 00000000000000..8a56f266dd7a14
Binary files /dev/null and b/docs/public/static/blog/2023-mui-values/good-values.png differ
diff --git a/docs/public/static/blog/2023-mui-values/notion-values-page.png b/docs/public/static/blog/2023-mui-values/notion-values-page.png
new file mode 100644
index 00000000000000..3cbe2ad08b1c34
Binary files /dev/null and b/docs/public/static/blog/2023-mui-values/notion-values-page.png differ
diff --git a/docs/public/static/blog/2023-mui-values/thanks-and-praise.png b/docs/public/static/blog/2023-mui-values/thanks-and-praise.png
new file mode 100644
index 00000000000000..88f079cb16f141
Binary files /dev/null and b/docs/public/static/blog/2023-mui-values/thanks-and-praise.png differ
diff --git a/docs/public/static/blog/2023-mui-values/themes-video.png b/docs/public/static/blog/2023-mui-values/themes-video.png
new file mode 100644
index 00000000000000..fb8bdfd88f34a3
Binary files /dev/null and b/docs/public/static/blog/2023-mui-values/themes-video.png differ
diff --git a/docs/public/static/blog/2023-mui-values/values-illustrations.png b/docs/public/static/blog/2023-mui-values/values-illustrations.png
new file mode 100644
index 00000000000000..3b5528711e6fd4
Binary files /dev/null and b/docs/public/static/blog/2023-mui-values/values-illustrations.png differ
diff --git a/docs/public/static/blog/2023-mui-values/values-survey.png b/docs/public/static/blog/2023-mui-values/values-survey.png
new file mode 100644
index 00000000000000..98c1cefab36abe
Binary files /dev/null and b/docs/public/static/blog/2023-mui-values/values-survey.png differ
diff --git a/docs/public/static/branding/about/group-photo/group-photo.jpg b/docs/public/static/branding/about/group-photo/group-photo.jpg
new file mode 100644
index 00000000000000..2d9aaa544a58c6
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/group-photo.jpg differ
diff --git a/docs/public/static/branding/about/group-photo/group-photo.png b/docs/public/static/branding/about/group-photo/group-photo.png
new file mode 100644
index 00000000000000..a516c7900d9312
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/group-photo.png differ
diff --git a/docs/public/static/branding/about/group-photo/outdoor-focus-group.png b/docs/public/static/branding/about/group-photo/outdoor-focus-group.png
new file mode 100644
index 00000000000000..f88f881524aeb3
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/outdoor-focus-group.png differ
diff --git a/docs/public/static/branding/about/group-photo/portugal-sight-seeing.png b/docs/public/static/branding/about/group-photo/portugal-sight-seeing.png
new file mode 100644
index 00000000000000..47303a569ae941
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/portugal-sight-seeing.png differ
diff --git a/docs/public/static/branding/about/group-photo/scuba-gear.png b/docs/public/static/branding/about/group-photo/scuba-gear.png
new file mode 100644
index 00000000000000..634d8c5887881c
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/scuba-gear.png differ
diff --git a/docs/public/static/branding/about/group-photo/skiers.jpg b/docs/public/static/branding/about/group-photo/skiers.jpg
new file mode 100644
index 00000000000000..b47c9846c447c2
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/skiers.jpg differ
diff --git a/docs/public/static/branding/about/group-photo/skiers.png b/docs/public/static/branding/about/group-photo/skiers.png
new file mode 100644
index 00000000000000..d1441fd9a6a7c6
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/skiers.png differ
diff --git a/docs/public/static/branding/about/group-photo/snow-tea.png b/docs/public/static/branding/about/group-photo/snow-tea.png
new file mode 100644
index 00000000000000..194e79fa673505
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/snow-tea.png differ
diff --git a/docs/public/static/branding/about/group-photo/team-dinner.png b/docs/public/static/branding/about/group-photo/team-dinner.png
new file mode 100644
index 00000000000000..5e4e669425ad5f
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/team-dinner.png differ
diff --git a/docs/public/static/branding/about/group-photo/teide-group.jpg b/docs/public/static/branding/about/group-photo/teide-group.jpg
new file mode 100644
index 00000000000000..959aa192a083f5
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/teide-group.jpg differ
diff --git a/docs/public/static/branding/about/group-photo/teide-group.png b/docs/public/static/branding/about/group-photo/teide-group.png
new file mode 100644
index 00000000000000..e16a0c1a16e5e4
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/teide-group.png differ
diff --git a/docs/public/static/branding/about/group-photo/working-table-portugal.png b/docs/public/static/branding/about/group-photo/working-table-portugal.png
new file mode 100644
index 00000000000000..2e7747a8958a82
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/working-table-portugal.png differ
diff --git a/docs/public/static/branding/about/group-photo/working-table-tenerife.png b/docs/public/static/branding/about/group-photo/working-table-tenerife.png
new file mode 100644
index 00000000000000..eaac20aace7060
Binary files /dev/null and b/docs/public/static/branding/about/group-photo/working-table-tenerife.png differ
diff --git a/docs/public/static/branding/about/illustrations/better-dark.svg b/docs/public/static/branding/about/illustrations/better-dark.svg
new file mode 100644
index 00000000000000..ff3b4b8508114a
--- /dev/null
+++ b/docs/public/static/branding/about/illustrations/better-dark.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="89" height="89" fill="none"><path fill="#0059B3" fill-opacity=".3" d="m82.486 51.65 4.355-1.005.525-5.66-5.69-2.484a37.494 37.494 0 0 0-.37-4.063l1.424-.968 3.7-2.511-1.556-5.467-6.182-.26a36.441 36.441 0 0 0-1.83-3.662l.975-1.41 2.542-3.678-3.426-4.536-5.88 1.998c-.072-.073-.14-.146-.214-.219a37.685 37.685 0 0 0-2.798-2.53c.162-.672.302-1.259.402-1.68l1.042-4.348-4.833-2.992-4.744 3.973a36.304 36.304 0 0 0-3.82-1.476l-.228-1.698-.6-4.43L49.694 1.5l-2.997 5.436a37.662 37.662 0 0 0-4.077.003l-.836-1.516-2.16-3.915-5.586 1.044-.83 6.133c-1.3.422-2.574.916-3.817 1.48l-1.312-1.098-3.427-2.87-4.834 2.992c.33 1.37 1.001 4.179 1.445 6.032a37.645 37.645 0 0 0-2.762 2.503c-.083.083-.162.168-.244.25l-1.641-.557-4.233-1.44-3.425 4.537 3.52 5.092a36.578 36.578 0 0 0-1.824 3.665l-1.71.071-4.468.188-1.555 5.467 5.13 3.482a37.481 37.481 0 0 0-.364 4.063l-1.589.693L2 45.023l.525 5.66 6.034 1.393c.3 1.335.674 2.648 1.118 3.936l-1.216 1.206-3.174 3.147 2.534 5.088 6.134-.882a36.8 36.8 0 0 0 2.47 3.25l-.706 1.58-1.823 4.082 4.201 3.83 5.402-3.04a36.549 36.549 0 0 0 3.475 2.156c-.035.685-.066 1.283-.086 1.711l-.225 4.465 5.3 2.053 3.937-4.782c1.319.32 2.66.567 4.018.741l.542 1.639 1.403 4.244h5.684l1.947-5.89a36.947 36.947 0 0 0 4.017-.744l1.09 1.325 2.842 3.452 5.3-2.053-.312-6.184a36.712 36.712 0 0 0 3.472-2.16c.6.339 1.124.633 1.5.844l3.897 2.193 4.2-3.83a20737.6 20737.6 0 0 1-2.53-5.668 37.065 37.065 0 0 0 2.465-3.253l1.703.244 4.425.636 2.533-5.088-4.395-4.358a36.35 36.35 0 0 0 1.114-3.937l1.672-.387-.001.008Z"/><path fill="#004C99" d="M49.796 41.43c.596-1.22 1.939 1.93 2.636 3.094.698 1.166 1.101 2.566.82 3.896-.282 1.33-1.566 3.423-2.71 2.688-2.15-1.378-1.545-8.044-.748-9.679l.002.001Z"/><path stroke="#39F" stroke-linecap="round" stroke-linejoin="round" stroke-opacity=".3" stroke-width="2.56" d="m52.718 67.406 2.934 1.6.806-3.243 3.158 1.093.261-3.332 3.295.56-.288-3.328 3.342.014-.83-3.237 3.299-.535-1.352-3.057 3.166-1.073-1.84-2.79 2.943-1.583-2.274-2.448 2.643-2.044-2.643-2.044 2.274-2.447-2.943-1.582 1.84-2.79-3.166-1.073 1.352-3.057-3.299-.535.83-3.237-3.342.014.288-3.33-3.295.561-.261-3.331-3.158 1.093L55.652 19l-2.934 1.6-1.332-3.064-2.628 2.065-1.822-2.802-2.252 2.467L42.43 16.8l-1.822 2.802-2.627-2.065-1.333 3.064-2.934-1.6-.806 3.244-3.158-1.093-.26 3.331-3.295-.56.288 3.329-3.343-.014.83 3.237-3.299.535 1.352 3.057-3.165 1.072 1.839 2.79-2.943 1.584 2.275 2.447-2.643 2.044 2.643 2.045-2.275 2.447 2.943 1.582-1.84 2.79 3.165 1.073"/><path fill="url(#a)" d="M30.846 48.487c-.388 1.82-1.506 12.119-2.064 14.578-.223 1.248-.626 2.055-1.166 3.189a2.328 2.328 0 0 0 .865 2.985c1.325.835 3.193 1.919 4.736 2.46 1.605.561 3.846.882 5.429 1.051 1.133.121 2.166-.582 2.587-1.641 1.655-4.16 2.742-4.755 3.801-6.492 2.11-3.46 6.27-6.528 9.202-9.094 1.347-1.179 2.414-2.797 3.38-4.274.858-1.31 1.766-2.587 2.673-3.861.737-1.037 1.52-1.909.324-2.962-1.318-1.163-2.72-.356-3.903.592-.758.607-1.706 2.212-2.485 2.976-1.728 1.695-3.473 2.15-4.388-.112-.393-.972-.374-4.24.004-5.748 1.212-4.366 3.384-7.94 4.518-12.04.34-1.23.634-2.77-.255-3.89-.395-.5-1.118-.773-1.727-.553-.627.225-.975.874-1.183 1.492-.868 2.58-2.441 4.762-3.903 7.262l-.022.038c-1.099 1.879-2.396 4.096-4.786 2.784-.553-.303-1.166-.598-1.787-.492-1.425.244-1.832 2.142-3.215 2.381-.664.114-1.135-.358-1.837-.085-1.179.458-1.031 1.743-1.812 2.488-.288.274-.685.219-.972.45-.407.33-.734 1.058-.925 1.534-.632 1.578-.737 3.334-1.09 4.984Z"/><path stroke="#39F" stroke-linecap="round" stroke-linejoin="round" stroke-width="3.072" d="M82.486 51.646c0 .002.001.003.003.003l2.933-.677a2.015 2.015 0 0 0 1.554-1.777l.22-2.368a2.56 2.56 0 0 0-1.525-2.582l-2.522-1.101c-.901-.393-1.49-1.269-1.567-2.249a37.987 37.987 0 0 0-.078-.863c-.1-.977.318-1.944 1.13-2.497l.096-.065 2.168-1.472a2.56 2.56 0 0 0 1.025-2.819l-.543-1.907a2.56 2.56 0 0 0-2.355-1.857l-2.728-.115c-.982-.041-1.846-.645-2.274-1.529a36.424 36.424 0 0 0-.391-.784c-.45-.876-.413-1.933.147-2.744l.058-.083 1.49-2.156a2.56 2.56 0 0 0-.063-2.998l-1.195-1.583a2.56 2.56 0 0 0-2.868-.881l-3.839 1.304a.488.488 0 0 1-.503-.12v0a37.674 37.674 0 0 0-1.575-1.488c-.734-.654-1.076-1.65-.848-2.606l.027-.117.611-2.549a2.56 2.56 0 0 0-1.142-2.773L66.246 7.15a2.56 2.56 0 0 0-2.993.214l-2.091 1.752c-.754.631-1.8.767-2.713.402a36.1 36.1 0 0 0-.818-.316c-.923-.344-1.606-1.15-1.738-2.126l-.013-.1-.351-2.597a2.56 2.56 0 0 0-2.067-2.174l-1.95-.364A2.559 2.559 0 0 0 48.8 3.12l-1.329 2.41c-.474.86-1.398 1.365-2.38 1.353a35.866 35.866 0 0 0-.865.001c-.983.013-1.909-.492-2.383-1.353l-.06-.108-1.266-2.295a2.56 2.56 0 0 0-2.712-1.28l-1.95.364a2.56 2.56 0 0 0-2.066 2.174l-.366 2.705c-.132.974-.813 1.78-1.734 2.124-.274.102-.547.208-.818.317-.913.367-1.96.231-2.715-.4l-.078-.065-2.009-1.683a2.56 2.56 0 0 0-2.991-.214L21.39 8.214c-.94.582-1.4 1.7-1.142 2.775l.64 2.673c.228.954-.113 1.949-.844 2.602-.527.47-1.042.956-1.545 1.46v0a.56.56 0 0 1-.576.138l-1.31-.445-2.48-.844a2.56 2.56 0 0 0-2.867.881l-1.196 1.584a2.56 2.56 0 0 0-.063 2.998l1.553 2.245c.56.81.599 1.865.15 2.741-.133.26-.263.52-.39.783-.428.887-1.294 1.492-2.278 1.533l-.1.004-2.62.11A2.56 2.56 0 0 0 3.97 31.31l-.543 1.908a2.56 2.56 0 0 0 1.024 2.818l2.273 1.542c.812.551 1.23 1.517 1.131 2.492-.029.288-.055.576-.077.864-.077.981-.665 1.858-1.567 2.252l-.113.05-2.401 1.047a2.56 2.56 0 0 0-1.525 2.583l.183 1.976a2.56 2.56 0 0 0 1.973 2.257l2.662.615c.96.221 1.7.975 1.957 1.925.077.282.157.563.24.842.28.943.048 1.971-.65 2.663l-.075.074-1.86 1.844a2.56 2.56 0 0 0-.489 2.96l.884 1.775a2.561 2.561 0 0 0 2.657 1.392l2.714-.39c.971-.139 1.93.294 2.515 1.082.172.232.347.462.525.69.605.778.762 1.823.36 2.722l-.048.108-1.069 2.392a2.56 2.56 0 0 0 .613 2.936l1.467 1.337a2.56 2.56 0 0 0 2.98.34l2.384-1.343c.859-.482 1.914-.423 2.744.106.246.156.493.31.741.46.842.507 1.362 1.424 1.314 2.406l-.005.105-.132 2.617a2.56 2.56 0 0 0 1.632 2.516l1.85.717a2.56 2.56 0 0 0 2.901-.76l1.741-2.115c.624-.758 1.625-1.084 2.588-.895.284.056.57.109.855.158.972.167 1.792.835 2.102 1.77l.035.108.822 2.487a2.56 2.56 0 0 0 2.43 1.757h1.984a2.56 2.56 0 0 0 2.431-1.757l.861-2.604c.31-.934 1.128-1.6 2.098-1.769.286-.05.571-.102.856-.158.964-.19 1.965.136 2.59.894.023.03.047.057.069.085l1.666 2.023a2.56 2.56 0 0 0 2.9.76l1.851-.716a2.559 2.559 0 0 0 1.632-2.515l-.138-2.733c-.05-.981.47-1.897 1.31-2.405.249-.15.495-.304.74-.46.832-.531 1.888-.59 2.748-.107l.093.052 2.284 1.285a2.56 2.56 0 0 0 2.98-.339l1.466-1.336a2.56 2.56 0 0 0 .613-2.936l-1.12-2.51c-.401-.898-.246-1.941.358-2.718.178-.23.353-.46.525-.693.584-.79 1.544-1.223 2.516-1.083l.113.016 2.593.373a2.56 2.56 0 0 0 2.656-1.393l.885-1.776a2.559 2.559 0 0 0-.49-2.958l-1.94-1.925c-.698-.692-.93-1.719-.651-2.66.187-.632.358-1.27.51-1.913a.817.817 0 0 1 .609-.61l1.173-.271c.002 0 .003.001.003.003v0Z"/><defs><linearGradient id="a" x1="63.778" x2="21.729" y1="36.074" y2="42.266" gradientUnits="userSpaceOnUse"><stop stop-color="#007FFF"/><stop offset="1" stop-color="#39F"/></linearGradient></defs></svg>
diff --git a/docs/public/static/branding/about/illustrations/better-light.svg b/docs/public/static/branding/about/illustrations/better-light.svg
new file mode 100644
index 00000000000000..ebb328d791569b
--- /dev/null
+++ b/docs/public/static/branding/about/illustrations/better-light.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="89" height="89" fill="none"><path fill="#E7F2FE" fill-opacity=".5" d="m82.486 51.65 4.355-1.005.525-5.66-5.69-2.484a37.494 37.494 0 0 0-.37-4.063l1.424-.968 3.7-2.511-1.556-5.467-6.182-.26a36.441 36.441 0 0 0-1.83-3.662l.975-1.41 2.542-3.678-3.426-4.536-5.88 1.998c-.072-.073-.14-.146-.214-.219a37.685 37.685 0 0 0-2.798-2.53c.162-.672.302-1.259.402-1.68l1.042-4.348-4.833-2.992-4.744 3.973a36.304 36.304 0 0 0-3.82-1.476l-.228-1.698-.6-4.43L49.694 1.5l-2.997 5.436a37.662 37.662 0 0 0-4.077.003l-.836-1.516-2.16-3.915-5.586 1.044-.83 6.133c-1.3.422-2.574.916-3.817 1.48l-1.312-1.098-3.427-2.87-4.834 2.992c.33 1.37 1.001 4.179 1.445 6.032a37.645 37.645 0 0 0-2.762 2.503c-.083.083-.162.168-.244.25l-1.641-.557-4.233-1.44-3.425 4.537 3.52 5.092a36.578 36.578 0 0 0-1.824 3.665l-1.71.071-4.468.188-1.555 5.467 5.13 3.482a37.481 37.481 0 0 0-.364 4.063l-1.589.693L2 45.023l.525 5.66 6.034 1.393c.3 1.335.674 2.648 1.118 3.936l-1.216 1.206-3.174 3.147 2.534 5.088 6.134-.882a36.8 36.8 0 0 0 2.47 3.25l-.706 1.58-1.823 4.082 4.201 3.83 5.402-3.04a36.549 36.549 0 0 0 3.475 2.156c-.035.685-.066 1.283-.086 1.711l-.225 4.465 5.3 2.053 3.937-4.782c1.319.32 2.66.567 4.018.741l.542 1.639 1.403 4.244h5.684l1.947-5.89a36.947 36.947 0 0 0 4.017-.744l1.09 1.325 2.842 3.452 5.3-2.053-.312-6.184a36.712 36.712 0 0 0 3.472-2.16c.6.339 1.124.633 1.5.844l3.897 2.193 4.2-3.83a20737.6 20737.6 0 0 1-2.53-5.668 37.065 37.065 0 0 0 2.465-3.253l1.703.244 4.425.636 2.533-5.088-4.395-4.358a36.35 36.35 0 0 0 1.114-3.937l1.672-.387-.001.008Z"/><path fill="#004C99" d="M49.796 41.43c.596-1.22 1.939 1.93 2.636 3.094.698 1.166 1.101 2.566.82 3.896-.282 1.33-1.566 3.423-2.71 2.688-2.15-1.378-1.545-8.044-.748-9.679l.002.001Z"/><path stroke="#C2E0FF" stroke-linecap="round" stroke-linejoin="round" stroke-opacity=".5" stroke-width="2.56" d="m52.718 67.406 2.934 1.6.806-3.243 3.158 1.093.261-3.332 3.295.56-.288-3.328 3.342.014-.83-3.237 3.299-.535-1.352-3.057 3.166-1.073-1.84-2.79 2.943-1.583-2.274-2.448 2.643-2.044-2.643-2.044 2.274-2.447-2.943-1.582 1.84-2.79-3.166-1.073 1.352-3.057-3.299-.535.83-3.237-3.342.014.288-3.33-3.295.561-.261-3.331-3.158 1.093L55.652 19l-2.934 1.6-1.332-3.064-2.628 2.065-1.822-2.802-2.252 2.467L42.43 16.8l-1.822 2.802-2.627-2.065-1.333 3.064-2.934-1.6-.806 3.244-3.158-1.093-.26 3.331-3.295-.56.288 3.329-3.343-.014.83 3.237-3.299.535 1.352 3.057-3.165 1.072 1.839 2.79-2.943 1.584 2.275 2.447-2.643 2.044 2.643 2.045-2.275 2.447 2.943 1.582-1.84 2.79 3.165 1.073"/><path fill="url(#a)" d="M30.846 48.487c-.388 1.82-1.506 12.119-2.064 14.578-.223 1.248-.626 2.055-1.166 3.189a2.328 2.328 0 0 0 .865 2.985c1.325.835 3.193 1.919 4.736 2.46 1.605.561 3.846.882 5.429 1.051 1.133.121 2.166-.582 2.587-1.641 1.655-4.16 2.742-4.755 3.801-6.492 2.11-3.46 6.27-6.528 9.202-9.094 1.347-1.179 2.414-2.797 3.38-4.274.858-1.31 1.766-2.587 2.673-3.861.737-1.037 1.52-1.909.324-2.962-1.318-1.163-2.72-.356-3.903.592-.758.607-1.706 2.212-2.485 2.976-1.728 1.695-3.473 2.15-4.388-.112-.393-.972-.374-4.24.004-5.748 1.212-4.366 3.384-7.94 4.518-12.04.34-1.23.634-2.77-.255-3.89-.395-.5-1.118-.773-1.727-.553-.627.225-.975.874-1.183 1.492-.868 2.58-2.441 4.762-3.903 7.262l-.022.038c-1.099 1.879-2.396 4.096-4.786 2.784-.553-.303-1.166-.598-1.787-.492-1.425.244-1.832 2.142-3.215 2.381-.664.114-1.135-.358-1.837-.085-1.179.458-1.031 1.743-1.812 2.488-.288.274-.685.219-.972.45-.407.33-.734 1.058-.925 1.534-.632 1.578-.737 3.334-1.09 4.984Z"/><path stroke="#8DCEFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="3.072" d="M82.486 51.646c0 .002.001.003.003.003l2.933-.677a2.015 2.015 0 0 0 1.554-1.777l.22-2.368a2.56 2.56 0 0 0-1.525-2.582l-2.522-1.101c-.901-.393-1.49-1.269-1.567-2.249a37.987 37.987 0 0 0-.078-.863c-.1-.977.318-1.944 1.13-2.497l.096-.065 2.168-1.472a2.56 2.56 0 0 0 1.025-2.819l-.543-1.907a2.56 2.56 0 0 0-2.355-1.857l-2.728-.115c-.982-.041-1.846-.645-2.274-1.529a36.424 36.424 0 0 0-.391-.784c-.45-.876-.413-1.933.147-2.744l.058-.083 1.49-2.156a2.56 2.56 0 0 0-.063-2.998l-1.195-1.583a2.56 2.56 0 0 0-2.868-.881l-3.839 1.304a.488.488 0 0 1-.503-.12v0a37.674 37.674 0 0 0-1.575-1.488c-.734-.654-1.076-1.65-.848-2.606l.027-.117.611-2.549a2.56 2.56 0 0 0-1.142-2.773L66.246 7.15a2.56 2.56 0 0 0-2.993.214l-2.091 1.752c-.754.631-1.8.767-2.713.402a36.1 36.1 0 0 0-.818-.316c-.923-.344-1.606-1.15-1.738-2.126l-.013-.1-.351-2.597a2.56 2.56 0 0 0-2.067-2.174l-1.95-.364A2.559 2.559 0 0 0 48.8 3.12l-1.329 2.41c-.474.86-1.398 1.365-2.38 1.353a35.866 35.866 0 0 0-.865.001c-.983.013-1.909-.492-2.383-1.353l-.06-.108-1.266-2.295a2.56 2.56 0 0 0-2.712-1.28l-1.95.364a2.56 2.56 0 0 0-2.066 2.174l-.366 2.705c-.132.974-.813 1.78-1.734 2.124-.274.102-.547.208-.818.317-.913.367-1.96.231-2.715-.4l-.078-.065-2.009-1.683a2.56 2.56 0 0 0-2.991-.214L21.39 8.214c-.94.582-1.4 1.7-1.142 2.775l.64 2.673c.228.954-.113 1.949-.844 2.602-.527.47-1.042.956-1.545 1.46v0a.56.56 0 0 1-.576.138l-1.31-.445-2.48-.844a2.56 2.56 0 0 0-2.867.881l-1.196 1.584a2.56 2.56 0 0 0-.063 2.998l1.553 2.245c.56.81.599 1.865.15 2.741-.133.26-.263.52-.39.783-.428.887-1.294 1.492-2.278 1.533l-.1.004-2.62.11A2.56 2.56 0 0 0 3.97 31.31l-.543 1.908a2.56 2.56 0 0 0 1.024 2.818l2.273 1.542c.812.551 1.23 1.517 1.131 2.492-.029.288-.055.576-.077.864-.077.981-.665 1.858-1.567 2.252l-.113.05-2.401 1.047a2.56 2.56 0 0 0-1.525 2.583l.183 1.976a2.56 2.56 0 0 0 1.973 2.257l2.662.615c.96.221 1.7.975 1.957 1.925.077.282.157.563.24.842.28.943.048 1.971-.65 2.663l-.075.074-1.86 1.844a2.56 2.56 0 0 0-.489 2.96l.884 1.775a2.561 2.561 0 0 0 2.657 1.392l2.714-.39c.971-.139 1.93.294 2.515 1.082.172.232.347.462.525.69.605.778.762 1.823.36 2.722l-.048.108-1.069 2.392a2.56 2.56 0 0 0 .613 2.936l1.467 1.337a2.56 2.56 0 0 0 2.98.34l2.384-1.343c.859-.482 1.914-.423 2.744.106.246.156.493.31.741.46.842.507 1.362 1.424 1.314 2.406l-.005.105-.132 2.617a2.56 2.56 0 0 0 1.632 2.516l1.85.717a2.56 2.56 0 0 0 2.901-.76l1.741-2.115c.624-.758 1.625-1.084 2.588-.895.284.056.57.109.855.158.972.167 1.792.835 2.102 1.77l.035.108.822 2.487a2.56 2.56 0 0 0 2.43 1.757h1.984a2.56 2.56 0 0 0 2.431-1.757l.861-2.604c.31-.934 1.128-1.6 2.098-1.769.286-.05.571-.102.856-.158.964-.19 1.965.136 2.59.894.023.03.047.057.069.085l1.666 2.023a2.56 2.56 0 0 0 2.9.76l1.851-.716a2.559 2.559 0 0 0 1.632-2.515l-.138-2.733c-.05-.981.47-1.897 1.31-2.405.249-.15.495-.304.74-.46.832-.531 1.888-.59 2.748-.107l.093.052 2.284 1.285a2.56 2.56 0 0 0 2.98-.339l1.466-1.336a2.56 2.56 0 0 0 .613-2.936l-1.12-2.51c-.401-.898-.246-1.941.358-2.718.178-.23.353-.46.525-.693.584-.79 1.544-1.223 2.516-1.083l.113.016 2.593.373a2.56 2.56 0 0 0 2.656-1.393l.885-1.776a2.559 2.559 0 0 0-.49-2.958l-1.94-1.925c-.698-.692-.93-1.719-.651-2.66.187-.632.358-1.27.51-1.913a.817.817 0 0 1 .609-.61l1.173-.271c.002 0 .003.001.003.003v0Z"/><defs><linearGradient id="a" x1="63.778" x2="21.729" y1="36.074" y2="42.266" gradientUnits="userSpaceOnUse"><stop stop-color="#007FFF"/><stop offset="1" stop-color="#39F"/></linearGradient></defs></svg>
diff --git a/docs/public/static/branding/about/illustrations/bureaucracy-dark.svg b/docs/public/static/branding/about/illustrations/bureaucracy-dark.svg
new file mode 100644
index 00000000000000..6ab8a241602561
--- /dev/null
+++ b/docs/public/static/branding/about/illustrations/bureaucracy-dark.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="81" height="94" fill="none"><path fill="#0059B3" fill-opacity=".3" d="M38.306 79.3c20.052 0 36.307-16.254 36.307-36.306 0-20.051-16.255-36.306-36.307-36.306C18.255 6.688 2 22.943 2 42.994c0 20.052 16.255 36.307 36.306 36.307Z"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M26.67 36.725c-.693 1.764-4.79 3.312-7.817 2.122-3.028-1.189-4.42-3.19-3.728-4.954.693-1.764 3.074-2.283 6.102-1.095 3.028 1.19 4.977 5.11 4.284 6.875"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M27.632 35.198c-.927 1.654-5.195 2.629-8.033 1.039-2.839-1.59-3.945-3.763-3.019-5.417.927-1.653 3.357-1.843 6.195-.253 2.839 1.59 4.235 5.74 3.309 7.393"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M28.792 33.817c-1.143 1.512-5.504 1.896-8.1-.065-2.595-1.961-3.395-4.265-2.252-5.776 1.143-1.512 3.576-1.37 6.172.593 2.595 1.962 3.414 6.264 2.27 7.775"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M30.132 32.607c-1.338 1.343-5.712 1.13-8.015-1.166-2.305-2.298-2.784-4.687-1.445-6.03 1.337-1.342 3.73-.87 6.034 1.428 2.304 2.297 2.529 6.669 1.191 8.011"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M31.622 31.59c-1.509 1.148-5.812.342-7.782-2.248-1.97-2.59-2.12-5.022-.61-6.169 1.508-1.148 3.813-.353 5.782 2.236 1.97 2.59 1.599 6.952.09 8.1"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M33.237 30.786c-1.652.931-5.805-.453-7.404-3.286-1.598-2.834-1.415-5.264.235-6.195s3.826.168 5.424 3.002c1.599 2.834.637 7.105-1.014 8.036"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M34.947 30.21c-1.762.698-5.689-1.24-6.887-4.265-1.198-3.024-.686-5.407 1.076-6.105 1.762-.698 3.767.688 4.965 3.713 1.197 3.024-.337 7.125-2.1 7.823"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M36.718 29.872c-1.841.451-5.467-2.003-6.242-5.162-.775-3.16.056-5.451 1.897-5.903 1.842-.451 3.639 1.195 4.413 4.354.775 3.16-1.303 7.014-3.144 7.465"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M38.52 29.777c-1.884.197-5.143-2.728-5.48-5.964-.338-3.235.797-5.392 2.683-5.59 1.885-.196 3.442 1.68 3.78 4.916.336 3.235-2.247 6.77-4.133 6.967"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M40.318 29.93c-1.894-.062-4.724-3.404-4.618-6.656.106-3.252 1.525-5.233 3.42-5.172 1.894.062 3.18 2.133 3.075 5.385-.106 3.252-3.148 6.401-5.043 6.339"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M42.078 30.326c-1.868-.32-4.216-4.015-3.668-7.223.548-3.207 2.224-4.977 4.093-4.658 1.868.32 2.86 2.546 2.313 5.752-.548 3.208-3.99 5.913-5.858 5.595"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M43.769 30.957c-1.807-.57-3.63-4.552-2.651-7.653.98-3.102 2.88-4.628 4.688-4.057 1.807.57 2.488 2.911 1.508 6.014-.98 3.102-4.758 5.314-6.565 4.744"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M45.356 31.813c-1.713-.811-2.977-5.004-1.584-7.943 1.393-2.94 3.484-4.193 5.197-3.38 1.712.811 2.068 3.222.675 6.163-1.393 2.94-5.437 4.617-7.15 3.806"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M46.813 32.876c-1.587-1.037-2.268-5.362-.488-8.085 1.78-2.722 4.023-3.678 5.61-2.641 1.586 1.037 1.61 3.475-.17 6.198-1.78 2.722-6.015 3.833-7.602 2.797"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M48.112 34.13c-1.43-1.244-1.517-5.622.618-8.077 2.134-2.456 4.486-3.098 5.916-1.854 1.43 1.243 1.122 3.66-1.013 6.116-2.135 2.455-6.482 2.979-7.911 1.735"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M49.227 35.547c-1.248-1.426-.736-5.775 1.712-7.917 2.45-2.142 4.866-2.458 6.114-1.03 1.248 1.426.613 3.78-1.835 5.921-2.45 2.142-6.827 2.069-8.074.643"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M50.14 37.103c-1.042-1.583.057-5.822 2.774-7.61 2.718-1.789 5.155-1.772 6.197-.19 1.042 1.584.092 3.829-2.624 5.617-2.719 1.788-7.046 1.12-8.088-.463"/><path stroke="#39F" stroke-miterlimit="10" stroke-opacity=".4" stroke-width="1.414" d="M50.833 38.77c-.817-1.71.848-5.76 3.783-7.162 2.937-1.402 5.35-1.054 6.165.656.817 1.71-.43 3.806-3.365 5.208-2.936 1.401-7.131.15-7.948-1.56"/><path stroke="#39F" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.829" d="M38.307 6.688V2C60.947 2 79.3 20.354 79.3 42.993c0 22.64-18.354 40.993-40.993 40.993v8.012"/><path stroke="#39F" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.829" d="M38.306 79.3c20.052 0 36.307-16.254 36.307-36.306 0-20.051-16.255-36.306-36.307-36.306C18.255 6.688 2 22.943 2 42.994c0 20.052 16.255 36.307 36.306 36.307Z"/><path fill="url(#a)" fill-rule="evenodd" d="M19.233 40.547c-.644-.34-1.634.014-1.643.898l.002.002c-.01.928.116 1.795.349 2.707.185.723.595 1.83.952 2.79v.001l.263.715c-.514-.771-1.795-3.564-2.04-4.773-.086-.42-.165-.923-.249-1.454-.158-1-.332-2.103-.594-2.953-.566-1.837-2.535-1.663-2.29.458.04.35.076.736.113 1.142.092 1.005.194 2.125.408 3.066.393 1.733.836 3.178 1.124 4.117.075.245.14.456.19.629-.273-.33-1.221-2.318-1.715-4.672-.154-.736-.3-1.504-.44-2.25-.368-1.943-.704-3.724-1.092-4.334-1.247-1.962-2.557-.188-2.248 2.127.144 1.08.453 2.718.79 4.499l.19 1.017c.262 1.392.806 2.887 1.133 3.785.135.37.233.639.258.757-.248-.314-1.097-1.903-1.544-3.205-.354-1.033-.549-2.155-.717-3.122-.186-1.07-.339-1.951-.638-2.307-.818-.974-1.402-.336-1.616.895-.157.903-.124 2.727.165 3.867.487 1.918 1.038 3.757 2.032 5.864.854 1.81 1.782 3.592 2.749 5.115-.678-.21-1.385-.637-2.055-1.552-1.177-1.611-2.856-2.62-3.444-1.483-.345.667.483 2.636 1.354 3.854a11.397 11.397 0 0 0 3.66 3.32c1.046.598 1.75.869 2.543 1.174.764.294 1.612.62 2.932 1.304.094.05.19.101.289.151.977.517 1.994 1.225 2.8 1.826.87.882 1.515 1.976 1.916 3.217.076.236.159.738.245 1.45a30.963 30.963 0 0 0 10.632 3.525c-1.375-5.878-2.613-10.987-3.101-12.33a31.712 31.712 0 0 1-.554-1.714c-.587-1.946-1.174-3.893-3.476-6.625-1.057-1.254-1.763-1.68-2.359-2.037-.703-.424-1.252-.754-2.042-2.247-.226-.427-.433-.807-.622-1.154-.68-1.25-1.134-2.083-1.448-3.212a17.868 17.868 0 0 1-.092-.353c-.207-.81-.57-2.23-1.07-2.495Z" clip-rule="evenodd"/><path fill="url(#b)" fill-rule="evenodd" d="M58.687 37.643c.699-.248 1.708.217 1.649 1.071-.1 1.454-1.643 6.5-1.643 6.5.79-2.552 2.296-6.824 3.357-9.278.735-1.702 2.782-1.29 2.36.727-.39 1.864-.845 3.53-1.312 5.235-.29 1.06-.585 2.136-.87 3.284.63-1.509 1.202-3.374 1.741-5.132.74-2.41 1.416-4.618 2.1-5.433 1.458-1.738 2.525.249 1.97 2.432-.31 1.219-.847 2.98-1.402 4.793-.23.754-.463 1.517-.684 2.253.065.041.132.09.2.146l.01-.03c.923-2.803 1.95-5.924 2.5-6.42 1.614-1.454 1.883 1.189 1.213 3.785-.15.585-.299 1.172-.447 1.761-.756 3-1.52 6.033-2.682 8.88a8.842 8.842 0 0 1-.868 1.617l.348-.259c1.005-.752 1.89-1.414 2.65-1.023.538.276.69.91.71.993.436 1.939-3.213 4.47-6.005 5.524-1.135.43-3.018.95-5.53.786-1.412 1.302-2.199 3.308-2.584 5.192-.102.497-.333 2.164-.634 4.434a30.988 30.988 0 0 1-13.68 4.587c2.224-6.103 4.375-12.177 4.725-13.774.849-3.877 1.464-5.04 2.22-6.466.18-.34.368-.696.569-1.107 1.026-2.095 2.356-3.068 3.642-4.01 1.345-.985 2.643-1.935 3.497-4.097.756-1.912 1.234-3.173 1.786-5.154.173-.62.456-1.59 1.094-1.817Z" clip-rule="evenodd"/><path stroke="#39F" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.829" d="M19.578 92h37.456"/><defs><linearGradient id="a" x1="35.953" x2="3.646" y1="43.982" y2="48.666" gradientUnits="userSpaceOnUse"><stop stop-color="#007FFF"/><stop offset="1" stop-color="#39F"/></linearGradient><linearGradient id="b" x1="41.154" x2="72.562" y1="46.995" y2="49.158" gradientUnits="userSpaceOnUse"><stop stop-color="#005BB8"/><stop offset="1" stop-color="#0072E6"/></linearGradient></defs></svg>
diff --git a/docs/public/static/branding/about/illustrations/bureaucracy-light.svg b/docs/public/static/branding/about/illustrations/bureaucracy-light.svg
new file mode 100644
index 00000000000000..3658d933271e2d
--- /dev/null
+++ b/docs/public/static/branding/about/illustrations/bureaucracy-light.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="81" height="94" fill="none"><path fill="#E7F2FE" fill-opacity=".5" d="M38.306 79.3c20.052 0 36.307-16.254 36.307-36.306 0-20.051-16.255-36.306-36.306-36.306C18.255 6.688 2 22.943 2 42.994c0 20.052 16.255 36.307 36.306 36.307Z"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M26.67 36.725c-.693 1.764-4.79 3.312-7.817 2.123-3.028-1.19-4.42-3.19-3.728-4.954.693-1.765 3.074-2.284 6.102-1.096 3.028 1.19 4.977 5.11 4.284 6.875"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M27.632 35.198c-.927 1.654-5.195 2.629-8.033 1.039-2.839-1.59-3.945-3.763-3.019-5.416.927-1.654 3.357-1.844 6.195-.254 2.839 1.59 4.235 5.74 3.309 7.393"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M28.793 33.817c-1.144 1.512-5.505 1.896-8.1-.065-2.596-1.961-3.396-4.265-2.253-5.776 1.143-1.512 3.576-1.37 6.172.593 2.595 1.962 3.414 6.264 2.271 7.775"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M30.132 32.608c-1.338 1.342-5.712 1.129-8.015-1.167-2.305-2.298-2.784-4.687-1.445-6.03 1.337-1.342 3.73-.87 6.034 1.428 2.304 2.297 2.529 6.669 1.191 8.011"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M31.622 31.59c-1.509 1.148-5.812.342-7.782-2.248-1.97-2.59-2.12-5.022-.61-6.169 1.508-1.148 3.813-.353 5.782 2.236 1.97 2.59 1.599 6.952.09 8.1"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M33.237 30.786c-1.652.931-5.805-.454-7.404-3.286-1.598-2.834-1.415-5.264.235-6.195s3.826.168 5.424 3.002c1.599 2.834.637 7.105-1.014 8.036"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M34.946 30.21c-1.762.698-5.688-1.24-6.887-4.265-1.198-3.024-.686-5.407 1.076-6.105 1.762-.698 3.767.688 4.965 3.713 1.197 3.024-.337 7.125-2.1 7.823"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M36.718 29.872c-1.841.451-5.467-2.003-6.242-5.162-.775-3.16.056-5.451 1.897-5.903 1.842-.451 3.639 1.195 4.413 4.354.775 3.16-1.303 7.014-3.144 7.465"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M38.52 29.777c-1.884.197-5.143-2.728-5.48-5.964-.338-3.235.797-5.392 2.683-5.59 1.885-.196 3.442 1.68 3.78 4.916.336 3.236-2.247 6.77-4.133 6.967"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M40.318 29.93c-1.894-.062-4.724-3.404-4.618-6.655.106-3.253 1.525-5.234 3.42-5.173 1.894.062 3.18 2.133 3.075 5.385-.106 3.252-3.148 6.401-5.043 6.339"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M42.078 30.326c-1.868-.32-4.216-4.015-3.668-7.222.548-3.208 2.224-4.978 4.093-4.659 1.868.32 2.86 2.546 2.313 5.752-.548 3.208-3.99 5.913-5.858 5.595"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M43.768 30.957c-1.807-.57-3.63-4.552-2.651-7.653.98-3.102 2.88-4.628 4.688-4.057 1.807.57 2.488 2.911 1.508 6.014-.98 3.102-4.758 5.314-6.565 4.744"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M45.356 31.813c-1.713-.81-2.977-5.004-1.584-7.943 1.393-2.94 3.484-4.193 5.197-3.38 1.712.811 2.068 3.222.675 6.163-1.393 2.94-5.437 4.617-7.15 3.806"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M46.813 32.876c-1.587-1.037-2.268-5.362-.488-8.084 1.78-2.723 4.023-3.68 5.61-2.642 1.586 1.037 1.61 3.475-.17 6.198-1.78 2.722-6.015 3.833-7.602 2.797"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M48.112 34.13c-1.43-1.244-1.517-5.622.618-8.077 2.134-2.456 4.486-3.098 5.916-1.854 1.43 1.243 1.122 3.66-1.013 6.116-2.135 2.455-6.482 2.979-7.911 1.735"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M49.228 35.547c-1.248-1.426-.736-5.775 1.712-7.917 2.45-2.142 4.866-2.458 6.114-1.03 1.248 1.426.613 3.78-1.835 5.921-2.45 2.142-6.827 2.07-8.075.643"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M50.14 37.103c-1.042-1.583.057-5.822 2.774-7.61 2.718-1.789 5.155-1.772 6.197-.19 1.043 1.584.092 3.829-2.624 5.617-2.719 1.788-7.046 1.12-8.088-.463"/><path stroke="#C2E0FF" stroke-miterlimit="10" stroke-opacity=".5" stroke-width="1.414" d="M50.832 38.77c-.817-1.71.848-5.76 3.783-7.162 2.936-1.402 5.35-1.054 6.165.656.817 1.71-.43 3.806-3.365 5.208-2.936 1.401-7.131.15-7.948-1.56"/><path stroke="#8DCEFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.829" d="M38.307 6.688V2C60.947 2 79.3 20.354 79.3 42.993c0 22.64-18.354 40.993-40.993 40.993v8.012"/><path stroke="#8DCEFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.829" d="M38.306 79.3c20.052 0 36.307-16.254 36.307-36.306 0-20.051-16.255-36.306-36.306-36.306C18.255 6.688 2 22.943 2 42.994c0 20.052 16.255 36.307 36.306 36.307Z"/><path fill="url(#a)" fill-rule="evenodd" d="M19.228 40.547c-.644-.34-1.634.014-1.643.898l.002.002c-.01.928.116 1.795.349 2.707.185.723.595 1.83.952 2.79v.001l.263.715c-.514-.771-1.795-3.564-2.04-4.773-.086-.42-.165-.923-.249-1.454-.158-1-.332-2.103-.594-2.953-.566-1.837-2.535-1.663-2.29.458.04.35.076.736.113 1.142.092 1.005.195 2.125.408 3.066.393 1.733.836 3.178 1.124 4.117.075.245.14.456.19.629-.273-.33-1.221-2.318-1.715-4.672-.154-.736-.3-1.504-.44-2.25-.368-1.943-.704-3.724-1.092-4.334-1.247-1.962-2.557-.188-2.248 2.127.144 1.08.453 2.718.79 4.499l.19 1.017c.262 1.392.806 2.887 1.133 3.785.135.37.233.639.259.757-.25-.314-1.098-1.903-1.544-3.205-.355-1.033-.55-2.155-.718-3.122-.186-1.07-.339-1.951-.638-2.307-.818-.974-1.401-.336-1.616.895-.157.903-.124 2.727.165 3.867.487 1.918 1.038 3.757 2.032 5.864.855 1.81 1.782 3.592 2.749 5.115-.678-.21-1.385-.637-2.055-1.552-1.177-1.611-2.856-2.62-3.444-1.483-.345.667.484 2.636 1.355 3.854a11.397 11.397 0 0 0 3.658 3.32c1.047.598 1.75.869 2.544 1.174a25.793 25.793 0 0 1 3.221 1.455c.977.518 1.994 1.225 2.8 1.826.87.882 1.516 1.976 1.916 3.217.077.236.159.738.245 1.448a30.964 30.964 0 0 0 10.632 3.527c-1.375-5.878-2.613-10.987-3.1-12.33a31.712 31.712 0 0 1-.555-1.714c-.587-1.946-1.174-3.893-3.476-6.625-1.057-1.254-1.763-1.68-2.359-2.037-.703-.424-1.251-.754-2.042-2.247-.226-.427-.433-.807-.622-1.154-.68-1.25-1.134-2.083-1.448-3.212a17.868 17.868 0 0 1-.092-.353c-.207-.81-.57-2.23-1.07-2.495Z" clip-rule="evenodd"/><path fill="url(#b)" fill-rule="evenodd" d="M58.684 37.643c.699-.248 1.708.217 1.649 1.071-.1 1.454-1.643 6.5-1.643 6.5.79-2.552 2.296-6.824 3.357-9.278.735-1.702 2.783-1.29 2.36.727-.389 1.864-.845 3.53-1.312 5.235-.29 1.06-.585 2.136-.87 3.284.63-1.509 1.202-3.374 1.742-5.132.738-2.41 1.415-4.618 2.1-5.433 1.457-1.738 2.524.249 1.97 2.432-.31 1.219-.848 2.98-1.402 4.793-.23.754-.464 1.516-.684 2.253.064.041.132.09.2.146l.01-.03c.922-2.803 1.95-5.924 2.5-6.42 1.613-1.454 1.882 1.189 1.212 3.785-.15.585-.298 1.172-.447 1.761-.755 3-1.52 6.033-2.682 8.88a8.84 8.84 0 0 1-.868 1.617l.348-.259c1.006-.752 1.89-1.414 2.65-1.023.538.276.69.91.71.993.437 1.939-3.213 4.47-6.005 5.524-1.135.43-3.017.95-5.53.786-1.412 1.302-2.199 3.308-2.584 5.192-.102.497-.333 2.165-.634 4.435a30.986 30.986 0 0 1-13.68 4.587c2.224-6.104 4.375-12.178 4.725-13.775.849-3.877 1.464-5.04 2.22-6.466.18-.34.368-.696.569-1.107 1.026-2.095 2.356-3.068 3.642-4.01 1.346-.985 2.643-1.935 3.497-4.097.756-1.912 1.234-3.173 1.786-5.153.173-.62.456-1.592 1.094-1.818Z" clip-rule="evenodd"/><path stroke="#8DCEFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.829" d="M19.578 92h37.456"/><defs><linearGradient id="a" x1="35.948" x2="3.641" y1="43.982" y2="48.666" gradientUnits="userSpaceOnUse"><stop stop-color="#007FFF"/><stop offset="1" stop-color="#39F"/></linearGradient><linearGradient id="b" x1="41.151" x2="72.559" y1="46.995" y2="49.158" gradientUnits="userSpaceOnUse"><stop stop-color="#004C99"/><stop offset="1" stop-color="#0072E6"/></linearGradient></defs></svg>
diff --git a/docs/public/static/branding/about/illustrations/community-dark.svg b/docs/public/static/branding/about/illustrations/community-dark.svg
new file mode 100644
index 00000000000000..beba4ba00ef5ac
--- /dev/null
+++ b/docs/public/static/branding/about/illustrations/community-dark.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="92" height="84" fill="none"><path fill="#0059B3" fill-opacity=".3" d="M55.466 2H36.985C17.663 2 2 17.663 2 36.985S16.37 71.97 36.985 71.97h4.088C43.23 75.32 49.999 82 64.847 82c-5.834-4.763-6.757-8.215-6.626-10.137 19.588 0 32.23-16.483 32.23-34.877 0-19.322-15.663-34.985-34.985-34.985V2Z"/><path stroke="#39F" stroke-linecap="round" stroke-linejoin="round" stroke-opacity=".3" stroke-width="2.793" d="M14.684 47.016c3.954 9.665 13.451 16.476 24.541 16.476h16.476c13.382 0 22.375-9.917 23.826-22.802M18.93 19.935c4.863-5.782 12.15-9.457 20.295-9.457h14.003c6.56 0 12.564 2.384 17.192 6.332"/><path fill="url(#a)" fill-rule="evenodd" d="M61.625 50.672c.029-.024.058-.051.086-.08.643-.614.706-1.167.528-1.938 0 0 2.547.461 2.701-1.421a.35.35 0 0 0 0-.065 2.026 2.026 0 0 0-.174-.876c-.232-.529-2.32-2.986-2.529-3.19-3.27-3.399-7.576-6.1-7.576-6.1 1.195-.053 2.27-.363 3.468-.708l.067-.019c1.464-.421 2.849-1.328 3.533-2.689L48.95 28.664s-.589-.376-1.504-.422c-2.562-.133-4.806.599-7.104 1.348-1.518.495-3.06.997-4.733 1.264-1.823.29-2.576.045-4.245-.498l-.232-.076L11.3 25.751c-1.078-.246-2.18.3-2.585 1.33-.568 1.442-1.305 3.52-1.595 5.23-.263 1.551-.339 3.638-.356 5.135-.013 1.108.791 2.041 1.882 2.233l17.649 3.104c.615.316 1.582 1.017 2.485 1.67.652.471 1.27.918 1.697 1.179 1.181.72 2.335 1.483 3.49 2.247 1.832 1.214 3.664 2.426 5.601 3.46 1.737.928 3.662 1.237 5.595 1.547 1.582.255 3.17.51 4.666 1.105 1.363.542 2.338.505 2.95.18.183-.097.334-.221.452-.363.596-.61.674-1.356.674-1.356s1.113.34 1.753.518c.081.023.165.05.253.076.588.183 1.32.41 2.062-.134.231-.143.42-.336.55-.56.22-.288.435-.663.646-1.143 1.276.182 1.957-.094 2.456-.537Z" clip-rule="evenodd"/><path fill="url(#b)" d="M68.214 43.245c.972-1.265 3.004-3.672 2.688-5.236l13.142-5.767c.957-.42 1.517-1.426 1.328-2.453-.226-1.229-.57-2.86-.989-4.052-.395-1.125-1.149-2.513-1.782-3.587-.59-1-1.848-1.345-2.894-.84L64.98 28.408c-2.77 1.009-4.881-.575-7.792-1.05-2.91-.474-6.001-.773-8.717.373a9.357 9.357 0 0 0-1.025.51c-1.966 1.13-3.526 2.915-5.021 4.651l-2.87 3.334c-.136.158-.277.328-.31.534-.059.37.248.69.555.902a4.377 4.377 0 0 0 3.732.571c1.07-.332 1.967-1.066 2.784-1.832a27.941 27.941 0 0 0 2.408-2.558c1.7.931 3.464 1.997 5.212 3.16 3.286 2.186 7.801 6.07 10.452 8.661 1.537-.252 2.675-.923 3.826-2.419Z"/><path fill="url(#c)" d="M48.541 51.372c-.125-.441-.465-.767-1.01-.968-1.005-.372-1.758-.17-2.458.322.351-.753.394-1.598.067-2.22-.333-.632-1.002-.94-1.835-.847-.732.082-1.505.467-2.26 1.006a2.501 2.501 0 0 0 .159-1.736 1.657 1.657 0 0 0-.783-1.034c-.559-.32-1.334-.358-2.24-.109-.53.146-1.281.475-2.05.951.353-.687.358-1.366-.003-2-.36-.63-.948-.986-1.701-1.023-1.338-.069-3.08.909-4.05 2.27-.461.648-.607 1.357-.409 1.995.19.616.685 1.11 1.356 1.358.352.129.656.19.939.19.468 0 .88-.167 1.356-.458-.186.29-.34.596-.449.912-.262.762-.128 1.572.357 2.167.468.572 1.199.883 2.05.883.157 0 .316-.01.479-.032.428-.055.903-.186 1.493-.558-.11.373-.101.752.032 1.104.28.738 1.077 1.253 2.183 1.414.124.017.245.027.363.027.729 0 1.383-.322 1.983-.8-.065.365-.001.658.075.852.278.715 1.087 1.223 2.013 1.265.09.004.175.006.26.006.937 0 1.577-.28 2.556-1.536l.048-.063c.71-.909 1.78-2.282 1.48-3.337v-.001Z"/><path stroke="#39F" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.793" d="M55.466 2H36.985C17.663 2 2 17.663 2 36.985S16.37 71.97 36.985 71.97h4.088C43.23 75.32 49.999 82 64.847 82c-5.834-4.763-6.757-8.215-6.626-10.137 19.588 0 32.23-16.483 32.23-34.877 0-19.322-15.663-34.985-34.985-34.985V2Z"/><defs><linearGradient id="a" x1="6.764" x2="65.509" y1="32.244" y2="48.363" gradientUnits="userSpaceOnUse"><stop stop-color="#005BB8"/><stop offset="1" stop-color="#0072E6"/></linearGradient><linearGradient id="b" x1="89.096" x2="38.249" y1="26.027" y2="44.957" gradientUnits="userSpaceOnUse"><stop stop-color="#007FFF"/><stop offset="1" stop-color="#39F"/></linearGradient><linearGradient id="c" x1="49.977" x2="28.576" y1="46.505" y2="52.937" gradientUnits="userSpaceOnUse"><stop stop-color="#007FFF"/><stop offset="1" stop-color="#39F"/></linearGradient></defs></svg>
diff --git a/docs/public/static/branding/about/illustrations/community-light.svg b/docs/public/static/branding/about/illustrations/community-light.svg
new file mode 100644
index 00000000000000..b9274520db9fdf
--- /dev/null
+++ b/docs/public/static/branding/about/illustrations/community-light.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="92" height="84" fill="none"><path fill="#E7F2FE" fill-opacity=".5" d="M55.466 2H36.985C17.663 2 2 17.663 2 36.985S16.37 71.97 36.985 71.97h4.088C43.23 75.32 49.999 82 64.847 82c-5.834-4.763-6.757-8.215-6.626-10.137 19.588 0 32.23-16.483 32.23-34.877 0-19.322-15.663-34.985-34.985-34.985V2Z"/><path stroke="#C2E0FF" stroke-linecap="round" stroke-linejoin="round" stroke-opacity=".5" stroke-width="2.793" d="M14.684 47.016c3.954 9.665 13.451 16.476 24.541 16.476h16.476c13.382 0 22.375-9.917 23.826-22.802M18.93 19.935c4.863-5.782 12.15-9.457 20.295-9.457h14.003c6.56 0 12.564 2.384 17.192 6.332"/><path fill="url(#a)" fill-rule="evenodd" d="M61.627 50.67a1.49 1.49 0 0 0 .082-.075c.645-.616.709-1.17.53-1.941 0 0 2.547.461 2.702-1.421a.348.348 0 0 0-.002-.066 2.026 2.026 0 0 0-.173-.875c-.232-.529-2.32-2.986-2.529-3.19-3.27-3.399-7.576-6.1-7.576-6.1 1.195-.053 2.27-.363 3.468-.708l.067-.019c1.464-.421 2.849-1.328 3.533-2.689L48.95 28.664s-.589-.376-1.504-.422c-2.562-.133-4.806.599-7.104 1.348-1.518.495-3.06.997-4.733 1.264-1.823.29-2.576.045-4.245-.498l-.232-.076L11.3 25.751c-1.078-.246-2.18.3-2.585 1.33-.568 1.442-1.305 3.52-1.595 5.23-.263 1.551-.339 3.638-.356 5.135-.013 1.108.791 2.041 1.882 2.233l17.649 3.104c.615.316 1.582 1.017 2.485 1.67.652.471 1.27.918 1.697 1.179 1.181.72 2.335 1.483 3.49 2.247 1.832 1.214 3.664 2.426 5.601 3.46 1.737.928 3.662 1.237 5.595 1.547 1.582.255 3.17.51 4.666 1.105 1.363.542 2.338.505 2.95.18.183-.097.333-.22.452-.362.596-.61.674-1.357.674-1.357s1.114.34 1.753.518c.081.023.165.05.253.076.588.183 1.32.41 2.062-.134.231-.143.42-.336.55-.559.219-.289.435-.663.646-1.144 1.278.182 1.959-.094 2.458-.538Z" clip-rule="evenodd"/><path fill="url(#b)" d="M68.214 43.245c.972-1.265 3.004-3.672 2.688-5.236l13.142-5.767c.957-.42 1.517-1.426 1.328-2.453-.226-1.229-.57-2.86-.989-4.052-.395-1.125-1.149-2.513-1.782-3.587-.59-1-1.848-1.345-2.894-.84L64.98 28.408c-2.77 1.009-4.881-.575-7.792-1.05-2.91-.474-6.001-.773-8.717.373a9.357 9.357 0 0 0-1.025.51c-1.966 1.13-3.526 2.915-5.021 4.651l-2.87 3.334c-.136.159-.277.328-.31.534-.059.37.248.69.555.902a4.377 4.377 0 0 0 3.732.571c1.07-.332 1.967-1.065 2.784-1.832a27.941 27.941 0 0 0 2.408-2.558c1.7.931 3.464 1.997 5.212 3.16 3.286 2.186 7.801 6.07 10.452 8.661 1.537-.252 2.675-.923 3.826-2.419Z"/><path fill="url(#c)" d="M48.541 51.372c-.125-.441-.465-.767-1.01-.968-1.005-.372-1.758-.17-2.458.322.351-.753.394-1.598.067-2.22-.333-.632-1.002-.94-1.835-.847-.732.082-1.505.467-2.26 1.006a2.501 2.501 0 0 0 .159-1.736 1.657 1.657 0 0 0-.783-1.034c-.559-.32-1.334-.358-2.24-.109-.53.146-1.281.475-2.05.951.353-.687.358-1.366-.003-2-.36-.63-.948-.986-1.701-1.023-1.338-.069-3.08.909-4.05 2.27-.461.648-.607 1.357-.409 1.995.19.616.685 1.11 1.356 1.358.352.129.656.19.939.19.468 0 .88-.167 1.356-.458-.186.29-.34.596-.449.912-.262.762-.128 1.572.357 2.167.468.572 1.199.883 2.05.883.157 0 .316-.01.479-.032.428-.055.903-.186 1.493-.558-.11.373-.101.752.032 1.104.28.738 1.077 1.253 2.183 1.414.124.017.245.027.363.027.729 0 1.383-.322 1.983-.8-.065.365-.001.658.075.852.278.715 1.087 1.223 2.013 1.265.09.004.175.006.26.006.937 0 1.577-.28 2.556-1.536l.048-.063c.71-.909 1.78-2.282 1.48-3.337v-.001Z"/><path stroke="#8DCEFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.793" d="M55.466 2H36.985C17.663 2 2 17.663 2 36.985S16.37 71.97 36.985 71.97h4.088C43.23 75.32 49.999 82 64.847 82c-5.834-4.763-6.757-8.215-6.626-10.137 19.588 0 32.23-16.483 32.23-34.877 0-19.322-15.663-34.985-34.985-34.985V2Z"/><defs><linearGradient id="a" x1="6.764" x2="65.509" y1="32.244" y2="48.363" gradientUnits="userSpaceOnUse"><stop stop-color="#004C99"/><stop offset="1" stop-color="#0072E6"/></linearGradient><linearGradient id="b" x1="89.096" x2="38.249" y1="26.027" y2="44.957" gradientUnits="userSpaceOnUse"><stop stop-color="#007FFF"/><stop offset="1" stop-color="#39F"/></linearGradient><linearGradient id="c" x1="49.977" x2="28.576" y1="46.505" y2="52.937" gradientUnits="userSpaceOnUse"><stop stop-color="#007FFF"/><stop offset="1" stop-color="#39F"/></linearGradient></defs></svg>
diff --git a/docs/public/static/branding/about/illustrations/team-globe-distribution-dark.png b/docs/public/static/branding/about/illustrations/team-globe-distribution-dark.png
new file mode 100644
index 00000000000000..8b59dc339963b1
Binary files /dev/null and b/docs/public/static/branding/about/illustrations/team-globe-distribution-dark.png differ
diff --git a/docs/public/static/branding/about/illustrations/team-globe-distribution-light.png b/docs/public/static/branding/about/illustrations/team-globe-distribution-light.png
new file mode 100644
index 00000000000000..57efc00531a072
Binary files /dev/null and b/docs/public/static/branding/about/illustrations/team-globe-distribution-light.png differ
diff --git a/docs/public/static/branding/about/illustrations/trust-dark.svg b/docs/public/static/branding/about/illustrations/trust-dark.svg
new file mode 100644
index 00000000000000..893b09521d0b8a
--- /dev/null
+++ b/docs/public/static/branding/about/illustrations/trust-dark.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="75" height="92" fill="none"><path stroke="#39F" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.521" d="m38.332 71.682-4.174 11.42c-.599 1.638-2.818 1.876-3.75.401l-2.744-4.343a2.101 2.101 0 0 0-2.41-.88l-4.873 1.542c-1.668.528-3.212-1.094-2.604-2.734l3.171-8.553M38.12 70.426l3.008 13.356c.383 1.702 2.553 2.222 3.667.88l3.28-3.955a2.101 2.101 0 0 1 2.505-.564l4.65 2.165c1.582.737 3.32-.665 2.936-2.367l-3.13-13.875"/><path fill="#0059B3" fill-opacity=".3" d="M72.865 37.365c0 1.461-3.37 3.175-3.578 4.621-.207 1.446 2.542 4.038 2.132 5.44-.411 1.402-4.128 2.098-4.736 3.429-.607 1.33 1.303 4.593.513 5.82-.79 1.23-4.55.848-5.507 1.953-.958 1.106-.046 4.772-1.15 5.73-1.105.958-4.606-.467-5.836.322-1.228.79-1.387 4.568-2.716 5.173-1.33.61-4.289-1.746-5.688-1.336-1.402.413-2.62 3.993-4.066 4.2-1.446.208-3.624-2.883-5.083-2.883-1.46 0-3.625 2.977-5.084 2.883-1.457-.094-2.663-3.787-4.065-4.2-1.401-.41-4.36 1.945-5.688 1.336-1.33-.605-1.49-4.384-2.716-5.173-1.23-.79-4.733.635-5.838-.322-1.102-.958-.19-4.624-1.148-5.73-.956-1.105-4.719-.723-5.509-1.953-.788-1.227 1.119-4.49.513-5.82-.607-1.33-4.324-2.026-4.735-3.428-.412-1.403 2.339-3.995 2.13-5.44-.207-1.446-3.577-3.16-3.577-4.622 0-1.461 3.37-3.177 3.578-4.621.208-1.448-2.543-4.04-2.13-5.443.41-1.401 4.126-2.095 4.734-3.425.605-1.327-1.302-4.592-.513-5.82.79-1.23 4.553-.851 5.51-1.955.957-1.105.045-4.773 1.147-5.73 1.104-.957 4.607.467 5.838-.322 1.23-.79 1.387-4.568 2.716-5.175C23.643 4.269 26.6 6.62 28 6.209c1.402-.41 2.608-4.104 4.064-4.199 1.46-.093 3.625 2.884 5.085 2.884S40.787 1.8 42.233 2.01c1.446.208 2.664 3.787 4.066 4.199 1.4.41 4.357-1.94 5.688-1.335 1.33.607 1.488 4.386 2.716 5.175 1.23.789 4.731-.635 5.836.322 1.104.956.193 4.624 1.15 5.73.957 1.104 4.717.725 5.507 1.955.79 1.228-1.117 4.493-.513 5.82.608 1.33 4.325 2.024 4.736 3.425.41 1.404-2.339 3.996-2.132 5.443.208 1.445 3.578 3.162 3.578 4.621Z"/><path stroke="#39F" stroke-linecap="round" stroke-linejoin="round" stroke-opacity=".3" stroke-width="2.801" d="M15.347 47.864c-.745-1.543.647-3.871.258-5.581-.376-1.657-2.649-3.149-2.649-4.919 0-1.77 2.273-3.262 2.65-4.918.388-1.71-1.004-4.039-.259-5.582.756-1.568 3.452-1.927 4.528-3.274 1.08-1.353.835-4.06 2.189-5.142 1.347-1.075 3.929-.237 5.498-.993 1.544-.745 2.492-3.294 4.202-3.682 1.657-.377 3.614 1.499 5.384 1.499 1.77 0 3.727-1.876 5.384-1.5 1.711.39 2.66 2.938 4.203 3.683 1.569.756 4.15-.082 5.499.994 1.354 1.08 1.107 3.788 2.188 5.14 1.076 1.349 3.771 1.707 4.529 3.275.743 1.543-.649 3.871-.26 5.582.377 1.656 2.65 3.148 2.65 4.918s-2.273 3.262-2.65 4.919c-.389 1.71 1.003 4.038.26 5.58-.758 1.57-3.453 1.928-4.53 3.275"/><path fill="url(#a)" d="M27.775 35.33s2.321 6.637 3.021 9.443c1.78 7.137 6.915 9.028 8.158 11.55.977 1.981 1.96 3.72 3.319 5.998.456.766 1.35 1.158 2.21.923.933-.255 2.126-.634 2.974-1.09.778-.42 1.66-1.116 2.362-1.723.77-.666.865-1.798.296-2.644-1.077-1.601-1.75-2.766-2.285-4.1-1.231-3.07-.587-3.49.228-5.592.815-2.102.79-5.716 1.022-6.947.52-2.75 1.86-4.169.514-4.859-1.082-.554-2.59.898-3.083 2.577-.894 3.05-1.135 6.66-2.066-.353-.36-2.715-1.41-9.851-1.717-12.573-.106-.948-.684-1.614-1.46-1.512-.946.124-1.324.964-1.25 1.916.195 2.48.324 8.93.43 11.105.014.294-.23.55-.338.068-.556-2.472-2.077-10.967-2.605-13.736-.22-1.15-1.218-1.751-2.089-1.253-.582.333-.878 1.037-.772 1.72.396 2.56 2.021 13.674 2.021 13.674.156.792-.247.746-.415.212l-.03-.075s-2.854-8.384-3.438-10.554c-.242-.9-.815-1.688-1.692-1.441-.875.247-1.08 1.175-.866 2.082.613 2.588 2.608 9.953 3.17 12.209.24.966.06 1.03-.24.405-.348-.726-2.634-5.454-3.011-6.32-.357-.819-1.028-1.55-1.86-1.229-.834.322-.83 1.284-.508 2.118Z"/><path fill="url(#b)" d="M47.578 32.178s-3.28 7.982-4.058 10.767h-.002c-1.981 7.087-3.481 7.191-6.073 11.382-.171.298-.349.6-.533.903l-.005.008-.003.006c-1.205 1.979-2.699 4.062-4.495 6.225-.665.801-1.392 1.651-2.17 2.536a1.986 1.986 0 0 1-2.227.553c-1.327-.528-3.373-1.427-4.685-2.415-1.092-.821-2.284-2.162-3.129-3.19-.666-.813-.557-1.984.185-2.727.997-.998 1.841-1.904 2.485-2.68.678-.815 1.335-1.56 1.85-2.334 1.833-2.754.549-7.99.354-10.235-.194-2.246.075-4.644.707-5.726 1.966-3.361-.686-5.275 1.373-5.613 1.718-.283 2.125 3.254 1.822 5.647l.007-.003c-.603 4.745.699 2.77 1.434-.787.555-2.682 1.85-8.007 2.391-10.692.188-.935.82-1.547 1.585-1.38.932.206 1.236 1.076 1.08 2.018-.408 2.454-1.145 6.983-1.467 9.556-.044.349.234.53.37-.04.654-2.768 2.181-8.246 2.826-11.014.26-1.114 1.299-1.675 2.175-1.168.585.34.867 1.033.737 1.697-.483 2.484-1.901 11.092-1.901 11.092-.195.938.254.899.458.268 0 0 1.97-6.51 2.558-8.775.244-.938.844-1.769 1.784-1.532.94.236 1.173 1.195.959 2.14-.612 2.7-1.512 8.148-2.088 10.85-.247 1.159-.181 1.293.17.56.41-.853 2.782-5.996 3.185-6.852.38-.808 1.07-1.52 1.894-1.176.824.345.793 1.306.447 2.13Z"/><path stroke="#39F" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.521" d="M72.865 37.365c0 1.461-3.37 3.175-3.578 4.621-.207 1.446 2.542 4.038 2.132 5.44-.411 1.402-4.128 2.098-4.736 3.429-.607 1.33 1.303 4.593.513 5.82-.79 1.23-4.55.848-5.507 1.953-.958 1.106-.046 4.772-1.15 5.73-1.105.958-4.606-.467-5.836.322-1.228.79-1.387 4.568-2.716 5.173-1.33.61-4.289-1.746-5.688-1.336-1.402.413-2.62 3.993-4.066 4.2-1.446.208-3.624-2.883-5.083-2.883-1.46 0-3.625 2.977-5.084 2.883-1.457-.094-2.663-3.787-4.065-4.2-1.401-.41-4.36 1.945-5.688 1.336-1.33-.605-1.49-4.384-2.716-5.173-1.23-.79-4.733.635-5.838-.322-1.102-.958-.19-4.624-1.148-5.73-.956-1.105-4.719-.723-5.509-1.953-.788-1.227 1.119-4.49.513-5.82-.607-1.33-4.324-2.026-4.735-3.428-.412-1.403 2.339-3.995 2.13-5.44-.207-1.446-3.577-3.16-3.577-4.622 0-1.461 3.37-3.177 3.578-4.621.208-1.448-2.543-4.04-2.13-5.443.41-1.401 4.126-2.095 4.734-3.425.605-1.327-1.302-4.592-.513-5.82.79-1.23 4.553-.851 5.51-1.955.957-1.105.045-4.773 1.147-5.73 1.104-.957 4.607.467 5.838-.322 1.23-.79 1.387-4.568 2.716-5.175C23.643 4.269 26.6 6.62 28 6.209c1.402-.41 2.608-4.104 4.064-4.199 1.46-.093 3.625 2.884 5.085 2.884S40.787 1.8 42.233 2.01c1.446.208 2.664 3.787 4.066 4.199 1.4.41 4.357-1.94 5.688-1.335 1.33.607 1.488 4.386 2.716 5.175 1.23.789 4.731-.635 5.836.322 1.104.956.193 4.624 1.15 5.73.957 1.104 4.717.725 5.507 1.955.79 1.228-1.117 4.493-.513 5.82.608 1.33 4.325 2.024 4.736 3.425.41 1.404-2.339 3.996-2.132 5.443.208 1.445 3.578 3.162 3.578 4.621Z"/><defs><linearGradient id="a" x1="27.574" x2="52.981" y1="31.762" y2="33.726" gradientUnits="userSpaceOnUse"><stop stop-color="#005BB8"/><stop offset="1" stop-color="#0072E6"/></linearGradient><linearGradient id="b" x1="49.932" x2="14.728" y1="31.227" y2="35.937" gradientUnits="userSpaceOnUse"><stop stop-color="#007FFF"/><stop offset="1" stop-color="#39F"/></linearGradient></defs></svg>
diff --git a/docs/public/static/branding/about/illustrations/trust-light.svg b/docs/public/static/branding/about/illustrations/trust-light.svg
new file mode 100644
index 00000000000000..45464f8c9851d3
--- /dev/null
+++ b/docs/public/static/branding/about/illustrations/trust-light.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="75" height="92" fill="none"><path stroke="#8DCEFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.521" d="m38.916 71.682-4.175 11.42c-.599 1.638-2.818 1.876-3.75.401l-2.744-4.343a2.1 2.1 0 0 0-2.41-.88l-4.873 1.542c-1.668.528-3.212-1.094-2.604-2.734l3.171-8.553M38.703 70.426l3.008 13.356c.383 1.702 2.553 2.222 3.667.88l3.28-3.955a2.101 2.101 0 0 1 2.505-.564l4.65 2.165c1.582.737 3.32-.665 2.936-2.367l-3.13-13.875"/><path fill="#E7F2FE" fill-opacity=".5" d="M73.433 37.365c0 1.461-3.37 3.175-3.578 4.621-.207 1.446 2.542 4.038 2.131 5.44-.41 1.402-4.127 2.098-4.736 3.429-.607 1.33 1.303 4.593.513 5.82-.79 1.23-4.55.848-5.507 1.953-.958 1.106-.046 4.772-1.15 5.73-1.104.958-4.605-.467-5.836.322-1.228.79-1.386 4.568-2.715 5.173-1.331.61-4.29-1.746-5.689-1.336-1.402.413-2.62 3.993-4.065 4.2-1.447.208-3.625-2.883-5.084-2.883-1.459 0-3.625 2.977-5.084 2.883-1.456-.094-2.662-3.787-4.065-4.2-1.4-.41-4.36 1.945-5.688 1.336-1.33-.605-1.49-4.384-2.716-5.173-1.23-.79-4.732.635-5.837-.322-1.102-.958-.191-4.624-1.149-5.73-.956-1.105-4.718-.723-5.508-1.953-.788-1.227 1.118-4.49.512-5.82-.607-1.33-4.324-2.026-4.734-3.428-.412-1.403 2.338-3.995 2.13-5.44C5.37 40.54 2 38.826 2 37.364c0-1.461 3.37-3.177 3.578-4.621.208-1.448-2.542-4.04-2.13-5.443.41-1.401 4.126-2.095 4.734-3.425.605-1.327-1.301-4.592-.512-5.82.79-1.23 4.553-.851 5.508-1.955.959-1.105.047-4.773 1.149-5.73 1.104-.957 4.606.467 5.837-.322 1.23-.79 1.387-4.568 2.716-5.175 1.33-.605 4.287 1.746 5.689 1.335 1.402-.41 2.608-4.104 4.064-4.199 1.46-.093 3.624 2.884 5.084 2.884 1.46 0 3.637-3.093 5.084-2.884 1.445.208 2.663 3.787 4.065 4.199 1.4.41 4.358-1.94 5.689-1.335 1.329.607 1.487 4.386 2.715 5.175 1.23.789 4.732-.635 5.836.322 1.104.956.193 4.624 1.15 5.73.957 1.104 4.717.725 5.507 1.955.79 1.228-1.117 4.493-.513 5.82.609 1.33 4.325 2.024 4.736 3.425.41 1.404-2.338 3.996-2.131 5.443.208 1.445 3.578 3.162 3.578 4.621Z"/><path stroke="#C2E0FF" stroke-linecap="round" stroke-linejoin="round" stroke-opacity=".5" stroke-width="2.801" d="M15.914 47.864c-.744-1.543.647-3.871.259-5.581-.376-1.657-2.65-3.149-2.65-4.919 0-1.77 2.274-3.262 2.65-4.918.389-1.71-1.003-4.039-.259-5.582.757-1.568 3.452-1.927 4.528-3.274 1.081-1.353.835-4.06 2.19-5.142 1.346-1.075 3.928-.237 5.498-.993 1.543-.745 2.492-3.294 4.202-3.682 1.656-.377 3.614 1.499 5.384 1.499 1.77 0 3.727-1.876 5.383-1.5 1.712.39 2.66 2.938 4.204 3.683 1.568.756 4.15-.082 5.498.994 1.354 1.08 1.107 3.788 2.188 5.14 1.076 1.349 3.772 1.707 4.529 3.275.744 1.543-.648 3.871-.26 5.582.378 1.656 2.65 3.148 2.65 4.918s-2.272 3.262-2.65 4.919c-.388 1.71 1.004 4.038.26 5.58-.758 1.57-3.453 1.928-4.529 3.275"/><path fill="url(#a)" d="M28.342 35.33s2.322 6.637 3.021 9.443c1.78 7.137 6.915 9.028 8.159 11.55.977 1.981 1.96 3.72 3.318 5.998.456.766 1.35 1.158 2.21.923.933-.255 2.126-.634 2.974-1.09.778-.42 1.66-1.116 2.362-1.723.771-.666.865-1.798.296-2.644-1.076-1.601-1.75-2.766-2.285-4.1-1.23-3.07-.587-3.49.228-5.592.816-2.102.79-5.716 1.023-6.947.518-2.75 1.859-4.169.513-4.859-1.082-.554-2.59.898-3.083 2.577-.894 3.05-1.135 6.66-2.065-.353-.36-2.715-1.411-9.851-1.718-12.573-.106-.948-.684-1.614-1.46-1.512-.946.124-1.324.964-1.25 1.916.195 2.48.324 8.93.43 11.105.014.294-.23.55-.338.068-.556-2.472-2.077-10.967-2.605-13.736-.22-1.15-1.218-1.751-2.088-1.253-.582.333-.879 1.037-.773 1.72.397 2.56 2.022 13.674 2.022 13.674.155.792-.247.746-.415.212l-.03-.075s-2.855-8.384-3.44-10.554c-.24-.9-.813-1.688-1.69-1.441-.876.247-1.08 1.175-.866 2.082.612 2.588 2.607 9.953 3.17 12.209.24.966.06 1.03-.24.405-.349-.726-2.635-5.454-3.012-6.32-.356-.819-1.027-1.55-1.86-1.229-.834.322-.83 1.284-.508 2.118Z"/><path fill="url(#b)" d="M48.146 32.178s-3.28 7.982-4.058 10.767h-.002c-1.982 7.087-3.482 7.191-6.073 11.382-.172.298-.35.6-.534.903l-.004.008-.003.006c-1.205 1.979-2.7 4.062-4.495 6.225-.666.801-1.393 1.651-2.17 2.536a1.986 1.986 0 0 1-2.227.553c-1.328-.528-3.373-1.427-4.686-2.415-1.091-.821-2.284-2.162-3.128-3.19-.666-.813-.558-1.984.184-2.727.998-.998 1.842-1.904 2.486-2.68.677-.815 1.335-1.56 1.85-2.334 1.833-2.754.548-7.99.354-10.235-.195-2.246.074-4.644.707-5.726 1.965-3.361-.686-5.275 1.373-5.613 1.717-.283 2.125 3.254 1.821 5.647l.008-.003c-.603 4.745.698 2.77 1.434-.787.554-2.682 1.85-8.007 2.39-10.692.189-.935.821-1.547 1.586-1.38.932.206 1.235 1.076 1.079 2.018-.408 2.454-1.144 6.983-1.467 9.556-.044.349.234.53.37-.04.654-2.768 2.182-8.246 2.827-11.014.26-1.114 1.298-1.675 2.174-1.168.586.34.867 1.033.738 1.697-.483 2.484-1.902 11.092-1.902 11.092-.195.938.255.899.458.268 0 0 1.97-6.51 2.558-8.775.244-.938.844-1.769 1.784-1.532.94.236 1.174 1.195.96 2.14-.613 2.7-1.512 8.148-2.09 10.85-.246 1.159-.18 1.293.172.56.41-.853 2.782-5.996 3.184-6.852.38-.808 1.07-1.52 1.894-1.176.824.345.793 1.306.448 2.13Z"/><path stroke="#8DCEFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.521" d="M73.433 37.365c0 1.461-3.37 3.175-3.578 4.621-.207 1.446 2.542 4.038 2.131 5.44-.41 1.402-4.127 2.098-4.736 3.429-.607 1.33 1.303 4.593.513 5.82-.79 1.23-4.55.848-5.507 1.953-.958 1.106-.046 4.772-1.15 5.73-1.104.958-4.605-.467-5.836.322-1.228.79-1.386 4.568-2.715 5.173-1.331.61-4.29-1.746-5.689-1.336-1.402.413-2.62 3.993-4.065 4.2-1.447.208-3.625-2.883-5.084-2.883-1.459 0-3.625 2.977-5.084 2.883-1.456-.094-2.662-3.787-4.065-4.2-1.4-.41-4.36 1.945-5.688 1.336-1.33-.605-1.49-4.384-2.716-5.173-1.23-.79-4.732.635-5.837-.322-1.102-.958-.191-4.624-1.149-5.73-.956-1.105-4.718-.723-5.508-1.953-.788-1.227 1.118-4.49.512-5.82-.607-1.33-4.324-2.026-4.734-3.428-.412-1.403 2.338-3.995 2.13-5.44C5.37 40.54 2 38.826 2 37.364c0-1.461 3.37-3.177 3.578-4.621.208-1.448-2.542-4.04-2.13-5.443.41-1.401 4.126-2.095 4.734-3.425.605-1.327-1.301-4.592-.512-5.82.79-1.23 4.553-.851 5.508-1.955.959-1.105.047-4.773 1.149-5.73 1.104-.957 4.606.467 5.837-.322 1.23-.79 1.387-4.568 2.716-5.175 1.33-.605 4.287 1.746 5.689 1.335 1.402-.41 2.608-4.104 4.064-4.199 1.46-.093 3.624 2.884 5.084 2.884 1.46 0 3.637-3.093 5.084-2.884 1.445.208 2.663 3.787 4.065 4.199 1.4.41 4.358-1.94 5.689-1.335 1.329.607 1.487 4.386 2.715 5.175 1.23.789 4.732-.635 5.836.322 1.104.956.193 4.624 1.15 5.73.957 1.104 4.717.725 5.507 1.955.79 1.228-1.117 4.493-.513 5.82.609 1.33 4.325 2.024 4.736 3.425.41 1.404-2.338 3.996-2.131 5.443.208 1.445 3.578 3.162 3.578 4.621Z"/><defs><linearGradient id="a" x1="28.142" x2="53.548" y1="31.762" y2="33.726" gradientUnits="userSpaceOnUse"><stop stop-color="#004C99"/><stop offset="1" stop-color="#0072E6"/></linearGradient><linearGradient id="b" x1="50.499" x2="15.296" y1="31.227" y2="35.937" gradientUnits="userSpaceOnUse"><stop stop-color="#007FFF"/><stop offset="1" stop-color="#39F"/></linearGradient></defs></svg>
diff --git a/docs/src/components/about/AboutEnd.tsx b/docs/src/components/about/AboutEnd.tsx
new file mode 100644
index 00000000000000..77757e62292bcd
--- /dev/null
+++ b/docs/src/components/about/AboutEnd.tsx
@@ -0,0 +1,63 @@
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Typography from '@mui/material/Typography';
+import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded';
+import Link from 'docs/src/modules/components/Link';
+import GradientText from 'docs/src/components/typography/GradientText';
+import ROUTES from 'docs/src/route';
+import Section from 'docs/src/layouts/Section';
+import SectionHeadline from 'docs/src/components/typography/SectionHeadline';
+
+export default function AboutEnd() {
+  return (
+    <Section bg="gradient" sx={{ p: { sm: 8 } }}>
+      <Box
+        sx={{
+          display: 'flex',
+          flexDirection: 'column',
+          alignItems: 'center',
+          position: 'relative',
+        }}
+      >
+        <SectionHeadline
+          alwaysCenter
+          overline="Join us"
+          title={
+            <Typography variant="h2" sx={{ maxWidth: 600, mx: 'auto' }}>
+              <GradientText>Build the next generation</GradientText>
+              <br /> of tools for UI development
+            </Typography>
+          }
+          description="Together, we are enabling developers & designers to bring stunning UIs to life with unrivalled speed and ease."
+        />
+        <Button
+          component={Link}
+          noLinkStyle
+          href={ROUTES.careers}
+          endIcon={<KeyboardArrowRightRounded fontSize="small" />}
+          variant="contained"
+          sx={{ width: { xs: '100%', sm: 'fit-content' } }}
+        >
+          View careers
+        </Button>
+      </Box>
+      <Box
+        component="img"
+        src="/static/branding/about/illustrations/team-globe-distribution-light.png"
+        alt="A map illustration with pins loosely positioned where team members from MUI are located."
+        loading="lazy"
+        width="1100"
+        height="690"
+        sx={(theme) => ({
+          mt: -8,
+          display: { xs: 'none', sm: 'block' },
+          width: { sm: '100%' },
+          ...theme.applyDarkStyles({
+            content: 'url(/static/branding/about/illustrations/team-globe-distribution-dark.png)',
+          }),
+        })}
+      />
+    </Section>
+  );
+}
diff --git a/docs/src/components/about/AboutHero.tsx b/docs/src/components/about/AboutHero.tsx
new file mode 100644
index 00000000000000..d5ff899ceb7eea
--- /dev/null
+++ b/docs/src/components/about/AboutHero.tsx
@@ -0,0 +1,167 @@
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import Typography from '@mui/material/Typography';
+import { styled, keyframes } from '@mui/material/styles';
+import Section from 'docs/src/layouts/Section';
+import GradientText from 'docs/src/components/typography/GradientText';
+import TeamStatistics from 'docs/src/components/about/TeamStatistics';
+import SectionHeadline from 'docs/src/components/typography/SectionHeadline';
+
+const teamPhotos = [
+  {
+    img: '/static/branding/about/group-photo/teide-group.jpg',
+    title:
+      'A group photo of the MUI crew posing near the base of Mount Teide at the start of the hike.',
+  },
+  {
+    img: '/static/branding/about/group-photo/skiers.jpg',
+    title: 'MUI team members standing lined-up in the snow with their skigear.',
+  },
+  {
+    img: '/static/branding/about/group-photo/group-photo.jpg',
+    title: 'Photo of the MUI team in front of the pool at our accommodations in Tenerife',
+  },
+  {
+    img: '/static/branding/about/group-photo/team-dinner.png',
+    title: 'Members of the MUI team sitting around a large wooden dining table.',
+  },
+  {
+    img: '/static/branding/about/group-photo/working-table-tenerife.png',
+    title: 'The Toolpad team working together on a heads-down moment in Tenerife.',
+  },
+  {
+    img: '/static/branding/about/group-photo/scuba-gear.png',
+    title:
+      'MUI team members and their diving instructors pose in scuba gear before a successful scuba diving lesson.',
+  },
+  {
+    img: '/static/branding/about/group-photo/outdoor-focus-group.png',
+    title:
+      'An impromptu focus group gathered next to the pool with laptops to discuss cross-team marketing strategies.',
+  },
+  {
+    img: '/static/branding/about/group-photo/working-table-portugal.png',
+    title: 'MUI team members working together on a heads-down moment in Portugal.',
+  },
+  {
+    img: '/static/branding/about/group-photo/snow-tea.png',
+    title: 'The team shares a cup of tea up in the mountains of Chamonix, France.',
+  },
+  {
+    img: '/static/branding/about/group-photo/portugal-sight-seeing.png',
+    title: 'MUI team selfie while sightseeing in Lisbon, Portugal.',
+  },
+];
+
+const ImageContainer = styled('div')(() => ({
+  display: 'flex',
+  gap: 16,
+  justifyContent: 'center',
+}));
+
+const Image = styled('img')(({ theme }) => ({
+  width: 400,
+  height: 300,
+  boxSizing: 'content-box',
+  objectFit: 'cover',
+  borderRadius: theme.shape.borderRadius,
+  border: '1px solid',
+  borderColor: (theme.vars || theme).palette.divider,
+  boxShadow: `0px 2px 8px ${(theme.vars || theme).palette.grey[200]}`,
+  transition: 'all 100ms ease',
+  ...theme.applyDarkStyles({
+    borderColor: (theme.vars || theme).palette.primaryDark[600],
+    boxShadow: `0px 2px 8px ${(theme.vars || theme).palette.common.black}`,
+  }),
+}));
+
+const scroll = keyframes`
+  0% {
+    transform: translateX(0);
+  }
+  100% {
+    transform: translateX(-100%)
+  }
+`;
+
+function PhotoGallery() {
+  return (
+    <Box
+      sx={(theme) => ({
+        borderRadius: 1,
+        overflow: 'hidden',
+        position: 'relative',
+        minWidth: '100%',
+        display: 'flex',
+        gap: 2,
+        my: 5,
+        '& > div': {
+          animation: `${scroll} 120s linear infinite`,
+        },
+        '&::before, &::after': {
+          background: `linear-gradient(to right, #FFF 0%, rgba(255, 255, 255, 0) 100%)`,
+          content: "''",
+          height: '100%',
+          position: 'absolute',
+          width: 200,
+          zIndex: 1,
+          pointerEvents: 'none',
+        },
+        '&::before': {
+          right: { xs: -64, sm: -20 },
+          top: 0,
+          transform: 'rotateZ(180deg)',
+        },
+        '&::after': {
+          left: { xs: -64, sm: -20 },
+          top: 0,
+        },
+        ...theme.applyDarkStyles({
+          '&::before, &::after': {
+            background: `linear-gradient(to right, ${
+              (theme.vars || theme).palette.primaryDark[900]
+            } 0%, rgba(0, 0, 0, 0) 100%)`,
+          },
+        }),
+      })}
+    >
+      <ImageContainer>
+        {teamPhotos.map((item, index) => (
+          <Image
+            key={index}
+            src={item.img}
+            alt={item.title}
+            loading={index > 2 ? 'lazy' : undefined}
+            fetchPriority={index > 2 ? undefined : 'high'}
+          />
+        ))}
+      </ImageContainer>
+      <ImageContainer aria-hidden="true">
+        {/* aria-hidden is used here because this element is a copy from the above, meaning we want to hide it from screen readers. */}
+        {teamPhotos.map((item, index) => (
+          <Image key={index} src={item.img} alt={item.title} loading="lazy" />
+        ))}
+      </ImageContainer>
+    </Box>
+  );
+}
+
+export default function AboutHero() {
+  return (
+    <Section cozy bg="gradient">
+      <SectionHeadline
+        alwaysCenter
+        overline="About us"
+        title={
+          <Typography variant="h2" sx={{ maxWidth: 600, mx: 'auto' }}>
+            We&apos;re on a mission to make <br />{' '}
+            <GradientText>building better UIs effortless</GradientText>
+          </Typography>
+        }
+        description="Together, we are enabling developers & designers to bring stunning UIs to life with unrivalled speed and ease."
+      />
+      <PhotoGallery />
+      <TeamStatistics />
+    </Section>
+  );
+}
diff --git a/docs/src/components/about/HowToSupport.tsx b/docs/src/components/about/HowToSupport.tsx
new file mode 100644
index 00000000000000..e3346a64a40177
--- /dev/null
+++ b/docs/src/components/about/HowToSupport.tsx
@@ -0,0 +1,190 @@
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Grid from '@mui/material/Grid';
+import Paper from '@mui/material/Paper';
+import Typography from '@mui/material/Typography';
+import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded';
+import ForumRoundedIcon from '@mui/icons-material/ForumRounded';
+import PeopleRoundedIcon from '@mui/icons-material/PeopleRounded';
+import LocalAtmRoundedIcon from '@mui/icons-material/LocalAtmRounded';
+import GradientText from 'docs/src/components/typography/GradientText';
+import Link from 'docs/src/modules/components/Link';
+import Section from 'docs/src/layouts/Section';
+import SectionHeadline from 'docs/src/components/typography/SectionHeadline';
+import { GlowingIconContainer } from 'docs/src/components/action/InfoCard';
+
+function Widget({
+  children,
+  title,
+  icon,
+}: {
+  children: React.ReactNode;
+  title: string;
+  icon: React.ReactElement;
+}) {
+  return (
+    <Paper
+      variant="outlined"
+      sx={(theme) => ({
+        p: 4,
+        height: '100%',
+        display: 'flex',
+        flexDirection: 'column',
+        borderRadius: '12px',
+        border: '1px solid',
+        borderColor: 'grey.100',
+        background: `${(theme.vars || theme).palette.gradients.linearSubtle}`,
+        ...theme.applyDarkStyles({
+          bgcolor: 'primaryDark.900',
+          borderColor: 'primaryDark.700',
+          background: `${(theme.vars || theme).palette.gradients.linearSubtle}`,
+        }),
+      })}
+    >
+      <GlowingIconContainer icon={icon} />
+      <Typography
+        fontWeight="bold"
+        component="h3"
+        color="text.primary"
+        variant="body2"
+        mt={2}
+        mb={0.5}
+      >
+        {title}
+      </Typography>
+      {children}
+    </Paper>
+  );
+}
+
+export default function HowToSupport() {
+  return (
+    <Section cozy>
+      <SectionHeadline
+        overline="Support us"
+        title={
+          <Typography variant="h2" sx={{ maxWidth: 600, mb: 4 }}>
+            Learn how to support
+            <br /> <GradientText>MUI&apos;s growth</GradientText>
+          </Typography>
+        }
+        description=""
+      />
+      <Grid container spacing={3}>
+        <Grid item xs={12} sm={6} md={4}>
+          <Widget
+            icon={<ForumRoundedIcon fontSize="small" color="primary" />}
+            title="Give feedback"
+          >
+            <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
+              Tell us what and where we can improve or share your happy moments with us! You can
+              also up or downvote any page on our documentation. <br />
+              <br /> And lastly, from time to time, we send our community a survey for more
+              structured feedback, you&apos;re always invited to participate to share your thoughts.
+            </Typography>
+            <Button
+              component="a"
+              // @ts-expect-error
+              variant="link"
+              size="small"
+              href="https://github.com/mui/material-ui/issues?q=is%3Aissue+is%3Aopen+sort%3Areactions-%2B1-desc"
+              endIcon={<KeyboardArrowRightRounded />}
+              sx={{ ml: -1, mt: 'auto', width: 'fit-content' }}
+            >
+              Leave your feedback{' '}
+            </Button>
+          </Widget>
+        </Grid>
+        <Grid item xs={12} sm={6} md={4}>
+          <Widget
+            icon={<PeopleRoundedIcon fontSize="small" color="primary" />}
+            title="Join the community"
+          >
+            <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
+              Become a member of a huge community of developers supporting MUI. You can:
+            </Typography>
+            <Box
+              component="ul"
+              sx={{
+                typography: 'body2',
+                color: 'text.secondary',
+                pl: 2,
+                mb: 2,
+              }}
+            >
+              <li>
+                Add new features by{' '}
+                <Link href="https://github.com/mui/material-ui/blob/HEAD/CONTRIBUTING.md#your-first-pull-request">
+                  submitting a pull request
+                </Link>
+                .
+              </li>
+              <li>
+                Fix bugs or{' '}
+                <Link href="https://github.com/mui/material-ui/tree/HEAD/docs">
+                  improve our documentation
+                </Link>
+                .
+              </li>
+              <li>
+                Help others by reviewing and commenting on existing{' '}
+                <Link href="https://github.com/mui/material-ui/pulls">PRs</Link> and{' '}
+                <Link href="https://github.com/mui/material-ui/issues">issues</Link>.
+              </li>
+              <li>
+                Help <Link href="https://crowdin.com/project/material-ui-docs">translate</Link> the
+                documentation.
+              </li>
+              <li>
+                Answer questions on{' '}
+                <Link href="https://stackoverflow.com/questions/tagged/material-ui">
+                  Stack Overflow
+                </Link>
+                .
+              </li>
+            </Box>
+            <Button
+              component="a"
+              // @ts-expect-error
+              variant="link"
+              size="small"
+              href="https://github.com/mui/material-ui"
+              endIcon={<KeyboardArrowRightRounded />}
+              sx={{ ml: -1, mt: 'auto', width: 'fit-content' }}
+            >
+              See the repository
+            </Button>
+          </Widget>
+        </Grid>
+        <Grid item xs={12} sm={6} md={4}>
+          <Widget
+            icon={<LocalAtmRoundedIcon fontSize="small" color="primary" />}
+            title="Support us financially"
+          >
+            <Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
+              If you use MUI in a commercial project and would like to support its continued
+              development by becoming a Sponsor, or in a side or hobby project and would like to
+              become a Backer, you can do so through {'Open Collective'}.
+              <br />
+              <br />
+              All funds donated are managed transparently, and Sponsors receive recognition in the
+              README and on the MUI home page.
+            </Typography>
+            <Button
+              component="a"
+              // @ts-expect-error
+              variant="link"
+              size="small"
+              href="https://opencollective.com/mui"
+              endIcon={<KeyboardArrowRightRounded />}
+              sx={{ ml: -1, mt: 'auto', width: 'fit-content' }}
+            >
+              {'See Open Collective'}
+            </Button>
+          </Widget>
+        </Grid>
+      </Grid>
+    </Section>
+  );
+}
diff --git a/docs/src/components/about/OurValues.tsx b/docs/src/components/about/OurValues.tsx
new file mode 100644
index 00000000000000..40b58370b82d19
--- /dev/null
+++ b/docs/src/components/about/OurValues.tsx
@@ -0,0 +1,140 @@
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Grid from '@mui/material/Grid';
+import Paper from '@mui/material/Paper';
+import Typography from '@mui/material/Typography';
+import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded';
+import Link from 'docs/src/modules/components/Link';
+import GradientText from 'docs/src/components/typography/GradientText';
+import ROUTES from 'docs/src/route';
+import Section from 'docs/src/layouts/Section';
+import SectionHeadline from 'docs/src/components/typography/SectionHeadline';
+
+const values = [
+  {
+    title: 'Put community first 💙',
+    description: 'We never lose sight of who we’re serving and why.',
+    lightIcon: 'url(/static/branding/about/illustrations/community-light.svg)',
+    darkIcon: 'url(/static/branding/about/illustrations/community-dark.svg)',
+    width: 92,
+    height: 84,
+  },
+  {
+    title: 'Avoid bureaucracy 🚫',
+    description: 'We’re so not corporate — and we like it that way.',
+    lightIcon: 'url(/static/branding/about/illustrations/bureaucracy-light.svg)',
+    darkIcon: 'url(/static/branding/about/illustrations/bureaucracy-dark.svg)',
+    width: 81,
+    height: 94,
+  },
+  {
+    title: 'Chase “better” 🌱',
+    description: 'We’re driven by an unending desire to improve.',
+    lightIcon: 'url(/static/branding/about/illustrations/better-light.svg)',
+    darkIcon: 'url(/static/branding/about/illustrations/better-dark.svg)',
+    width: 89,
+    height: 89,
+  },
+  {
+    title: 'Trust and deliver together 🚀',
+    description: 'We choose to cultivate unity as the core of achievement.',
+    lightIcon: 'url(/static/branding/about/illustrations/trust-light.svg)',
+    darkIcon: 'url(/static/branding/about/illustrations/trust-dark.svg)',
+    width: 75,
+    height: 92,
+  },
+];
+
+export default function OurValues() {
+  return (
+    <Section cozy>
+      <Box
+        sx={{
+          display: 'flex',
+          flexDirection: 'column',
+        }}
+      >
+        <SectionHeadline
+          overline="Our values"
+          title={
+            <Typography variant="h2">
+              The MUI <GradientText>team pact</GradientText>
+            </Typography>
+          }
+          description="They explain the behaviors and mindsets we actively encourage, discourage, and why. They serve as a guide toward better decision-making, results, and experiences at work."
+        />
+        <Button
+          component={Link}
+          noLinkStyle
+          href={ROUTES.handbook}
+          endIcon={<KeyboardArrowRightRounded fontSize="small" />}
+          variant="contained"
+          sx={{ width: { xs: '100%', sm: 'fit-content' } }}
+        >
+          View our handbook
+        </Button>
+      </Box>
+      <Grid container spacing={3} sx={{ mt: { xs: 1, sm: 2 } }}>
+        {values.map(({ title, description, darkIcon, lightIcon, height, width }) => (
+          <Grid key={title} item xs={12} md={3}>
+            <Paper
+              variant="outlined"
+              sx={(theme) => ({
+                p: 4,
+                height: '100%',
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'space-between',
+                gap: 1.5,
+                background: `${(theme.vars || theme).palette.gradients.linearSubtle}`,
+                ...theme.applyDarkStyles({
+                  bgcolor: 'primaryDark.900',
+                  background: `${(theme.vars || theme).palette.gradients.linearSubtle}`,
+                  borderColor: 'primaryDark.700',
+                }),
+              })}
+            >
+              <Box
+                sx={(theme) => ({
+                  background: `${lightIcon}`,
+                  ...theme.applyDarkStyles({
+                    background: `${darkIcon}`,
+                  }),
+                })}
+                width={width}
+                height={height}
+              />
+              <Box sx={{ flexGrow: 1 }}>
+                <Typography
+                  fontWeight="bold"
+                  component="h3"
+                  variant="body2"
+                  sx={(theme) => ({
+                    mb: 0.5,
+                    color: (theme.vars || theme).palette.text.primary,
+                    '&::first-letter': {
+                      mr: 0.1,
+                      fontSize: theme.typography.pxToRem(16),
+                      color: (theme.vars || theme).palette.primary.main,
+                    },
+                    ...theme.applyDarkStyles({
+                      '&::first-letter': {
+                        color: (theme.vars || theme).palette.primary[400],
+                      },
+                    }),
+                  })}
+                >
+                  {title}
+                </Typography>
+                <Typography variant="body2" color="text.secondary">
+                  {description}
+                </Typography>
+              </Box>
+            </Paper>
+          </Grid>
+        ))}
+      </Grid>
+    </Section>
+  );
+}
diff --git a/docs/src/components/about/Team.tsx b/docs/src/components/about/Team.tsx
new file mode 100644
index 00000000000000..a361923e50d58b
--- /dev/null
+++ b/docs/src/components/about/Team.tsx
@@ -0,0 +1,395 @@
+import * as React from 'react';
+import Avatar from '@mui/material/Avatar';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Container from '@mui/material/Container';
+import Divider from '@mui/material/Divider';
+import IconButton from '@mui/material/IconButton';
+import Grid from '@mui/material/Grid';
+import Paper, { PaperProps } from '@mui/material/Paper';
+import Typography from '@mui/material/Typography';
+import Tooltip from '@mui/material/Tooltip';
+import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded';
+import TwitterIcon from '@mui/icons-material/Twitter';
+import GitHubIcon from '@mui/icons-material/GitHub';
+import Link from 'docs/src/modules/components/Link';
+import ROUTES from 'docs/src/route';
+import Section from 'docs/src/layouts/Section';
+import SectionHeadline from 'docs/src/components/typography/SectionHeadline';
+import GradientText from 'docs/src/components/typography/GradientText';
+import teamMembers from 'docs/data/about/teamMembers.json';
+
+interface Profile {
+  name: string;
+  /**
+   * Role, what are you working on?
+   */
+  title: string;
+  /**
+   * Country where you live in, ISO 3166-1.
+   */
+  locationCountry: string; // https://flagpedia.net/download/api
+  /**
+   * Image URL.
+   */
+  src?: string;
+  /**
+   * Lives in.
+   */
+  location?: string;
+  /**
+   * Short summary about you.
+   */
+  about?: string;
+  github?: string;
+  twitter?: string;
+}
+
+function Person(props: Profile & { sx?: PaperProps['sx'] }) {
+  return (
+    <Paper variant="outlined" sx={{ p: 2, height: '100%', ...props.sx }}>
+      <Box
+        sx={{
+          display: 'flex',
+          alignItems: 'flex-start',
+          flexWrap: 'wrap',
+          '& > div': { minWidth: 'clamp(0px, (150px - 100%) * 999 ,100%)' },
+        }}
+      >
+        <Tooltip
+          title={props.location || false}
+          placement="right-end"
+          describeChild
+          PopperProps={{
+            popperOptions: {
+              modifiers: [
+                {
+                  name: 'offset',
+                  options: {
+                    offset: [3, 2],
+                  },
+                },
+              ],
+            },
+          }}
+        >
+          <Box sx={{ position: 'relative', display: 'inline-block' }}>
+            <Avatar
+              variant="rounded"
+              imgProps={{
+                width: '70',
+                height: '70',
+                loading: 'lazy',
+              }}
+              src={props.src}
+              alt={props.name}
+              {...(props.src?.startsWith('https://avatars.githubusercontent.com') && {
+                src: `${props.src}?s=70`,
+                srcSet: `${props.src}?s=140 2x`,
+              })}
+              sx={(theme) => ({
+                width: 70,
+                height: 70,
+                borderRadius: 1,
+                border: '1px solid',
+                borderColor: 'grey.100',
+                backgroundColor: 'primary.50',
+                ...theme.applyDarkStyles({
+                  backgroundColor: 'primary.900',
+                  borderColor: 'primaryDark.500',
+                }),
+              })}
+            />
+            <Box
+              sx={(theme) => ({
+                width: 24,
+                height: 24,
+                display: 'flex',
+                justifyContent: 'center',
+                position: 'absolute',
+                bottom: 0,
+                right: 0,
+                backgroundColor: '#FFF',
+                borderRadius: 40,
+                border: '2px solid',
+                borderColor: 'primary.50',
+                boxShadow: '0px 2px 8px rgba(0, 0, 0, 0.15)',
+                transform: 'translateX(50%)',
+                overflow: 'hidden',
+                ...theme.applyDarkStyles({
+                  borderColor: 'primary.200',
+                }),
+              })}
+            >
+              <img
+                loading="lazy"
+                height="20"
+                width="40"
+                src={`https://flagcdn.com/${props.locationCountry}.svg`}
+                alt=""
+              />
+            </Box>
+          </Box>
+        </Tooltip>
+        <Box sx={{ mt: -0.5, mr: -0.5, ml: 'auto' }}>
+          {props.github && (
+            <IconButton
+              aria-label={`${props.name} github`}
+              component="a"
+              href={`https://github.com/${props.github}`}
+              target="_blank"
+              rel="noreferrer noopener"
+            >
+              <GitHubIcon fontSize="small" sx={{ color: 'grey.500' }} />
+            </IconButton>
+          )}
+          {props.twitter && (
+            <IconButton
+              aria-label={`${props.name} twitter`}
+              component="a"
+              href={`https://twitter.com/${props.twitter}`}
+              target="_blank"
+              rel="noreferrer noopener"
+            >
+              <TwitterIcon fontSize="small" sx={{ color: 'grey.500' }} />
+            </IconButton>
+          )}
+        </Box>
+      </Box>
+      <Typography variant="body2" fontWeight="bold" sx={{ mt: 2, mb: 0.5 }}>
+        {props.name}
+      </Typography>
+      <Typography variant="body2" color="text.secondary">
+        {props.title}
+      </Typography>
+      {props.about && <Divider sx={{ my: 1.5 }} />}
+      {props.about && (
+        <Typography variant="body2" color="grey.600">
+          {props.about}
+        </Typography>
+      )}
+    </Paper>
+  );
+}
+
+const contributors = [
+  {
+    name: 'Sebastian Silbermann',
+    github: 'eps1lon',
+    title: 'MUI Core, everything Open Source',
+    location: 'Berlin, Germany',
+    locationCountry: 'de',
+    src: 'https://avatars.githubusercontent.com/u/12292047',
+    twitter: 'sebsilbermann',
+  },
+  {
+    name: 'Ryan Cogswell',
+    github: 'ryancogswell',
+    title: 'Stack Overflow top contributor',
+    location: 'Minnesota, United States',
+    locationCountry: 'us',
+    src: 'https://avatars.githubusercontent.com/u/287804',
+  },
+  {
+    name: 'Yan Lee',
+    github: 'AGDholo',
+    title: 'Chinese docs',
+    location: 'China',
+    locationCountry: 'cn',
+    src: 'https://avatars.githubusercontent.com/u/13300332',
+  },
+  {
+    name: 'Jairon Alves Lima',
+    github: 'jaironalves',
+    title: 'Brazilian Portuguese docs',
+    location: 'São Paulo, Brazil',
+    locationCountry: 'br',
+    src: 'https://avatars.githubusercontent.com/u/29267813',
+  },
+  {
+    name: 'Danica Shen',
+    github: 'DDDDDanica',
+    title: 'Chinese docs',
+    location: 'Ireland',
+    locationCountry: 'ie',
+    src: 'https://avatars.githubusercontent.com/u/12678455',
+  },
+];
+
+const emeriti = [
+  {
+    name: 'Hai Nguyen',
+    github: 'hai-cea',
+    twitter: 'haicea',
+    title: 'MUI Core, v0.x creator',
+    location: 'Dallas, US',
+    locationCountry: 'us',
+    src: 'https://avatars.githubusercontent.com/u/2007468',
+  },
+  {
+    name: 'Nathan Marks',
+    github: 'nathanmarks',
+    title: 'MUI Core, v1.x co-creator',
+    location: 'Toronto, CA',
+    locationCountry: 'ca',
+    src: 'https://avatars.githubusercontent.com/u/4420103',
+  },
+  {
+    name: 'Kevin Ross',
+    github: 'rosskevin',
+    twitter: 'rosskevin',
+    title: 'MUI Core, flow',
+    location: 'Franklin, US',
+    locationCountry: 'us',
+    src: 'https://avatars.githubusercontent.com/u/136564',
+  },
+  {
+    name: 'Sebastian Sebald',
+    github: 'sebald',
+    twitter: 'sebastiansebald',
+    title: 'MUI Core',
+    location: 'Freiburg, Germany',
+    locationCountry: 'de',
+    src: 'https://avatars.githubusercontent.com/u/985701',
+  },
+  {
+    name: 'Ken Gregory',
+    github: 'kgregory',
+    title: 'MUI Core',
+    location: 'New Jersey, US',
+    locationCountry: 'us',
+    src: 'https://avatars.githubusercontent.com/u/3155127',
+  },
+  {
+    name: 'Tom Crockett',
+    github: 'pelotom',
+    twitter: 'pelotom',
+    title: 'MUI Core',
+    location: 'Los Angeles, US',
+    locationCountry: 'us',
+    src: 'https://avatars.githubusercontent.com/u/128019',
+  },
+  {
+    name: 'Maik Marschner',
+    github: 'leMaik',
+    twitter: 'leMaikOfficial',
+    title: 'MUI Core',
+    location: 'Hannover, Germany',
+    locationCountry: 'de',
+    src: 'https://avatars.githubusercontent.com/u/5544859',
+  },
+  {
+    name: 'Oleg Slobodskoi',
+    github: 'kof',
+    twitter: 'oleg008',
+    title: 'MUI Core, JSS',
+    location: 'Berlin, Germany',
+    locationCountry: 'de',
+    src: 'https://avatars.githubusercontent.com/u/52824',
+  },
+  {
+    name: 'Dmitriy Kovalenko',
+    github: 'dmtrKovalenko',
+    twitter: 'goose_plus_plus',
+    title: 'MUI X, date pickers',
+    location: 'Kharkiv, Ukraine',
+    locationCountry: 'ua',
+    src: 'https://avatars.githubusercontent.com/u/16926049',
+  },
+  {
+    name: 'Josh Wooding',
+    github: 'joshwooding',
+    twitter: 'JoshWooding_',
+    title: 'MUI Core, J.P. Morgan',
+    location: 'London, UK',
+    locationCountry: 'gb',
+    src: 'https://avatars.githubusercontent.com/u/12938082',
+  },
+];
+
+export default function Team() {
+  return (
+    <React.Fragment>
+      <Section cozy>
+        <Box
+          sx={{
+            my: 4,
+            display: 'flex',
+            flexDirection: 'column',
+          }}
+        >
+          <SectionHeadline
+            overline="Team"
+            title={
+              <Typography variant="h2" id="muiers">
+                Meet the <GradientText>MUIers</GradientText>
+              </Typography>
+            }
+            description="Contributing from all corners of the world, MUI is a global, fully-remote team & community."
+          />
+          <Button
+            component={Link}
+            noLinkStyle
+            href={ROUTES.careers}
+            endIcon={<KeyboardArrowRightRounded fontSize="small" />}
+            variant="contained"
+            sx={{ width: { xs: '100%', sm: 'fit-content' } }}
+          >
+            View careers
+          </Button>
+        </Box>
+        <Grid container spacing={2}>
+          {(teamMembers as Array<Profile>).map((profileJson) => {
+            const profile = {
+              src: `/static/branding/about/${profileJson.name
+                .split(' ')
+                .map((x) => x.toLowerCase())
+                .join('-')}.png`,
+              ...profileJson,
+            };
+            return (
+              <Grid key={profile.name} item xs={12} sm={6} md={3}>
+                <Person {...profile} />
+              </Grid>
+            );
+          })}
+        </Grid>
+      </Section>
+      <Divider />
+      {/* Community contributors */}
+      <Box data-mui-color-scheme="dark" sx={{ bgcolor: 'primaryDark.900' }}>
+        <Container sx={{ py: { xs: 4, sm: 8 } }}>
+          <Typography component="h3" variant="h4" color="primary.200" fontWeight="semiBold">
+            Community contributors
+          </Typography>
+          <Typography color="text.secondary" sx={{ maxWidth: { md: 500 } }}>
+            Special members of the community deserve a shout-out for their ever-lasting impact on
+            MUI&apos;s products.
+          </Typography>
+          <Grid container spacing={2} mt={2}>
+            {contributors.map((profile) => (
+              <Grid key={profile.name} item xs={12} sm={6} md={3}>
+                <Person {...profile} sx={{ bgcolor: 'primaryDark.600' }} />
+              </Grid>
+            ))}
+          </Grid>
+          <Divider sx={{ my: { xs: 2, sm: 6 } }} />
+          <Typography component="h3" variant="h4" color="warning.300" fontWeight="semiBold">
+            Community emeriti
+          </Typography>
+          <Typography color="text.secondary" sx={{ maxWidth: { md: 500 } }}>
+            We honor some no-longer-active core team members who have made valuable contributions in
+            the past. They advise us from time to time.
+          </Typography>
+          <Grid container spacing={2} mt={2}>
+            {emeriti.map((profile) => (
+              <Grid key={profile.name} item xs={12} sm={6} md={3}>
+                <Person {...profile} sx={{ bgcolor: 'primaryDark.600' }} />
+              </Grid>
+            ))}
+          </Grid>
+        </Container>
+      </Box>
+    </React.Fragment>
+  );
+}
diff --git a/docs/src/components/about/TeamStatistics.tsx b/docs/src/components/about/TeamStatistics.tsx
new file mode 100644
index 00000000000000..a05ccc95f87984
--- /dev/null
+++ b/docs/src/components/about/TeamStatistics.tsx
@@ -0,0 +1,37 @@
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import Typography from '@mui/material/Typography';
+
+const data = [
+  { number: '2014', metadata: 'The starting year' },
+  { number: '100%', metadata: 'Remote global team' },
+  { number: '20+', metadata: 'Countries represented' },
+];
+
+export default function TeamStatistics() {
+  return (
+    <Box sx={{ display: 'flex', justifyContent: 'center', gap: 2 }}>
+      {data.map((item) => (
+        <Box key={item.number} sx={{ height: '100%', width: { xs: '100%', sm: 200 } }}>
+          <Typography
+            component="p"
+            variant="h4"
+            fontWeight="bold"
+            sx={(theme) => ({
+              textAlign: { xs: 'left', sm: 'center' },
+              color: 'primary.main',
+              ...theme.applyDarkStyles({
+                color: 'primary.200',
+              }),
+            })}
+          >
+            {item.number}
+          </Typography>
+          <Typography color="text.secondary" sx={{ textAlign: { xs: 'left', sm: 'center' } }}>
+            {item.metadata}
+          </Typography>
+        </Box>
+      ))}
+    </Box>
+  );
+}
diff --git a/docs/src/components/action/InfoCard.tsx b/docs/src/components/action/InfoCard.tsx
index 9e702aab1f592c..dfe90ba4ef635a 100644
--- a/docs/src/components/action/InfoCard.tsx
+++ b/docs/src/components/action/InfoCard.tsx
@@ -4,6 +4,38 @@ import Paper from '@mui/material/Paper';
 import Typography from '@mui/material/Typography';
 import Link from 'docs/src/modules/components/Link';
 
+interface GlowingIconContainerProps {
+  icon: React.ReactNode;
+}
+
+export function GlowingIconContainer({ icon }: GlowingIconContainerProps) {
+  return (
+    <Box
+      sx={(theme) => ({
+        width: 40,
+        height: 40,
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        borderRadius: 1,
+        border: '1px solid',
+        borderColor: 'primary.200',
+        bgcolor: 'primary.50',
+        boxShadow:
+          '0px 1px 6px 0px rgba(194, 224, 255, 1), 0px 2px 30px 0px rgba(234, 237, 241, 0.3) inset',
+        ...theme.applyDarkStyles({
+          borderColor: 'primary.400',
+          bgcolor: 'primary.900',
+          boxShadow:
+            '0px 1px 6px 0px rgba(0, 89, 178, 1), 0px 2px 30px 0px rgba(0, 0, 0, 0.25) inset',
+        }),
+      })}
+    >
+      {icon}
+    </Box>
+  );
+}
+
 interface InfoCardProps {
   icon: React.ReactNode;
   title: string;
@@ -29,29 +61,7 @@ export default function InfoCard({ icon, title, description, link }: InfoCardPro
         }),
       })}
     >
-      <Box
-        sx={(theme) => ({
-          width: 40,
-          height: 40,
-          display: 'flex',
-          justifyContent: 'center',
-          alignItems: 'center',
-          borderRadius: 1,
-          border: '1px solid',
-          borderColor: 'primary.200',
-          bgcolor: 'primary.50',
-          boxShadow:
-            '0px 1px 6px 0px rgba(194, 224, 255, 1), 0px 2px 30px 0px rgba(234, 237, 241, 0.3) inset',
-          ...theme.applyDarkStyles({
-            borderColor: 'primary.400',
-            bgcolor: 'primary.900',
-            boxShadow:
-              '0px 1px 6px 0px rgba(0, 89, 178, 1), 0px 2px 30px 0px rgba(0, 0, 0, 0.25) inset',
-          }),
-        })}
-      >
-        {icon}
-      </Box>
+      <GlowingIconContainer icon={icon} />
       <Typography
         fontWeight="bold"
         component="h3"
diff --git a/docs/src/components/typography/SectionHeadline.tsx b/docs/src/components/typography/SectionHeadline.tsx
index 15e12590b67681..0e7dec6656d30a 100644
--- a/docs/src/components/typography/SectionHeadline.tsx
+++ b/docs/src/components/typography/SectionHeadline.tsx
@@ -4,7 +4,7 @@ import Typography from '@mui/material/Typography';
 interface SectionHeadlineProps {
   description?: React.ReactNode;
   id?: string;
-  overline: React.ReactNode;
+  overline?: React.ReactNode;
   title: string | React.ReactElement;
   alwaysCenter?: boolean;
   /**
@@ -17,24 +17,23 @@ export default function SectionHeadline(props: SectionHeadlineProps) {
   const { description, id, overline, title, alwaysCenter = false, inverted = false } = props;
   return (
     <React.Fragment>
-      <Typography
-        id={id}
-        component="h2"
-        fontWeight="bold"
-        variant="body2"
-        sx={(theme) => ({
-          mb: 1,
-          color: 'primary.600',
-          ...theme.applyDarkStyles({
-            color: 'primary.300',
-          }),
-          ...(alwaysCenter && {
-            textAlign: 'center',
-          }),
-        })}
-      >
-        {overline}
-      </Typography>
+      {overline && (
+        <Typography
+          id={id}
+          component="h2"
+          variant="body2"
+          fontWeight="bold"
+          color="primary.main"
+          sx={{
+            mb: 1,
+            ...(alwaysCenter && {
+              textAlign: 'center',
+            }),
+          }}
+        >
+          {overline}
+        </Typography>
+      )}
       {typeof title === 'string' ? (
         <Typography
           variant="h2"
diff --git a/docs/src/modules/brandingTheme.ts b/docs/src/modules/brandingTheme.ts
index 644593bbabfa5d..cf71e165bd13cf 100644
--- a/docs/src/modules/brandingTheme.ts
+++ b/docs/src/modules/brandingTheme.ts
@@ -473,6 +473,20 @@ export function getThemedComponents(): ThemeOptions {
               '& > span': { transition: '0.2s', marginLeft: 4 },
               '&:hover > span': { transform: 'translateX(2px)' },
             }),
+            ...(ownerState.size === 'medium' && {
+              padding: theme.spacing('8px', '12px'),
+              '& > span': { transition: '0.2s', marginLeft: 4 },
+              '&:hover > span': { transform: 'translateX(2px)' },
+            }),
+            ...(ownerState.size === 'small' && {
+              padding: theme.spacing(0.5, 1),
+              fontFamily: theme.typography.fontFamily,
+              fontSize: defaultTheme.typography.pxToRem(13),
+              fontWeight: theme.typography.fontWeightSemiBold,
+              borderRadius: 8,
+              '& > span': { transition: '0.2s', marginLeft: 4 },
+              '&:hover > span': { transform: 'translateX(2px)' },
+            }),
             ...(ownerState.variant === 'outlined' &&
               ownerState.color === 'secondary' && {
                 color: (theme.vars || theme).palette.text.secondary,
@@ -522,13 +536,6 @@ export function getThemedComponents(): ThemeOptions {
                   },
                 }),
               }),
-            ...(ownerState.size === 'small' && {
-              padding: theme.spacing(0.5, 1),
-              fontFamily: theme.typography.fontFamily,
-              fontSize: '0.75rem',
-              fontWeight: theme.typography.fontWeightSemiBold,
-              borderRadius: '6px',
-            }),
             ...(ownerState.variant === 'contained' &&
               ownerState.color === 'primary' && {
                 color: '#FFF',
@@ -683,16 +690,19 @@ export function getThemedComponents(): ThemeOptions {
             // @ts-ignore internal repo module augmentation issue
             props: { variant: 'link' },
             style: ({ theme }) => ({
+              marginBottom: 1,
               fontSize: theme.typography.pxToRem(14),
-              fontWeight: 700,
+              fontWeight: theme.typography.fontWeightBold,
               color: (theme.vars || theme).palette.primary[600],
+              '&:hover': {
+                backgroundColor: (theme.vars || theme).palette.primary[50],
+              },
               ...theme.applyDarkStyles({
                 color: (theme.vars || theme).palette.primary[300],
+                '&:hover': {
+                  backgroundColor: alpha(theme.palette.primary[800], 0.3),
+                },
               }),
-              mb: 1,
-              '& svg': {
-                ml: -0.5,
-              },
             }),
           },
         ],
diff --git a/docs/src/modules/components/HighlightedCode.test.js b/docs/src/modules/components/HighlightedCode.test.js
index 737a50cb584195..8129c9ee38def0 100644
--- a/docs/src/modules/components/HighlightedCode.test.js
+++ b/docs/src/modules/components/HighlightedCode.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import { getDesignTokens } from 'docs/src/modules/brandingTheme';
 import HighlightedCode from 'docs/src/modules/components/HighlightedCode';
diff --git a/docs/src/modules/components/ThemeViewer.tsx b/docs/src/modules/components/ThemeViewer.tsx
index 02fcc9884c994b..0c7bcd9b035a3a 100644
--- a/docs/src/modules/components/ThemeViewer.tsx
+++ b/docs/src/modules/components/ThemeViewer.tsx
@@ -7,6 +7,7 @@ import CollapseIcon from '@mui/icons-material/ChevronRight';
 import { TreeView } from '@mui/x-tree-view/TreeView';
 import { TreeItem as MuiTreeItem, treeItemClasses } from '@mui/x-tree-view/TreeItem';
 import { lighten } from '@mui/material/styles';
+import { blue, blueDark } from 'docs/src/modules/brandingTheme';
 
 function getType(value: any) {
   if (Array.isArray(value)) {
@@ -99,12 +100,18 @@ function ObjectEntryLabel(props: { objectKey: string; objectValue: any }) {
 
 const TreeItem = styled(MuiTreeItem)({
   [`&:focus > .${treeItemClasses.content}`]: {
-    backgroundColor: lighten('#333', 0.08),
-    outline: `2px dashed ${lighten('#333', 0.3)}`,
+    backgroundColor: lighten(blue[900], 0.05),
+    outline: `2px dashed ${lighten(blue[900], 0.3)}`,
   },
   [`& .${treeItemClasses.content}`]: {
+    padding: 4,
+    borderRadius: '12px',
     '&:hover': {
-      backgroundColor: lighten('#333', 0.08),
+      backgroundColor: lighten(blueDark[900], 0.1),
+    },
+    [`& .${treeItemClasses.label}`]: {
+      fontFamily: 'Menlo, Consolas',
+      fontSize: '0.825rem',
     },
   },
 });
@@ -189,13 +196,20 @@ export default function ThemeViewer({
 
   return (
     <TreeView
-      sx={{ bgcolor: '#333', color: '#fff', borderRadius: 1, p: 1 }}
       key={key}
       defaultCollapseIcon={<ExpandIcon />}
       defaultEndIcon={<div style={{ width: 24 }} />}
       defaultExpanded={defaultExpanded}
       defaultExpandIcon={<CollapseIcon />}
       {...other}
+      sx={{
+        color: '#FFF',
+        p: 1.5,
+        bgcolor: '#0F1924', // one-off code container color
+        borderRadius: 3,
+        border: '1px solid',
+        borderColor: blueDark[700],
+      }}
     >
       {Object.keys(data).map((objectKey) => {
         return (
diff --git a/package.json b/package.json
index f91171692e12cf..fa114ab4fb2885 100644
--- a/package.json
+++ b/package.json
@@ -48,9 +48,9 @@
     "start": "yarn && yarn docs:dev",
     "t": "node test/cli.js",
     "test": "yarn eslint && yarn typescript && yarn test:coverage",
-    "test:coverage": "cross-env NODE_ENV=test BABEL_ENV=coverage nyc --reporter=text mocha 'packages/**/*.test.{js,ts,tsx}' 'docs/**/*.test.{js,ts,tsx}' 'test/utils/**/*.test.{js,ts,tsx}'",
-    "test:coverage:ci": "cross-env NODE_ENV=test BABEL_ENV=coverage nyc --reporter=lcov mocha 'packages/**/*.test.{js,ts,tsx}' 'docs/**/*.test.{js,ts,tsx}' 'test/utils/**/*.test.{js,ts,tsx}'",
-    "test:coverage:html": "cross-env NODE_ENV=test BABEL_ENV=coverage nyc --reporter=html mocha 'packages/**/*.test.{js,ts,tsx}' 'docs/**/*.test.{js,ts,tsx}' 'test/utils/**/*.test.{js,ts,tsx}'",
+    "test:coverage": "cross-env NODE_ENV=test BABEL_ENV=coverage nyc --reporter=text mocha 'packages/**/*.test.{js,ts,tsx}' 'docs/**/*.test.{js,ts,tsx}'",
+    "test:coverage:ci": "cross-env NODE_ENV=test BABEL_ENV=coverage nyc --reporter=lcov mocha 'packages/**/*.test.{js,ts,tsx}' 'docs/**/*.test.{js,ts,tsx}'",
+    "test:coverage:html": "cross-env NODE_ENV=test BABEL_ENV=coverage nyc --reporter=html mocha 'packages/**/*.test.{js,ts,tsx}' 'docs/**/*.test.{js,ts,tsx}'",
     "test:e2e": "cross-env NODE_ENV=production yarn test:e2e:build && concurrently --success first --kill-others \"yarn test:e2e:run\" \"yarn test:e2e:server\"",
     "test:e2e:build": "webpack --config test/e2e/webpack.config.js",
     "test:e2e:dev": "concurrently \"yarn test:e2e:build --watch\" \"yarn test:e2e:server\"",
@@ -66,7 +66,7 @@
     "test:regressions:run": "mocha --config test/regressions/.mocharc.js --delay 'test/regressions/**/*.test.js'",
     "test:regressions:server": "serve test/regressions -p 5001",
     "test:umd": "node packages/mui-material/test/umd/run.js",
-    "test:unit": "cross-env NODE_ENV=test mocha 'packages/**/*.test.{js,ts,tsx}' 'docs/**/*.test.{js,ts,tsx}' 'test/utils/**/*.test.{js,ts,tsx}'",
+    "test:unit": "cross-env NODE_ENV=test mocha 'packages/**/*.test.{js,ts,tsx}' 'docs/**/*.test.{js,ts,tsx}'",
     "test:argos": "node ./scripts/pushArgos.mjs",
     "typescript": "lerna run --no-bail --parallel typescript",
     "typescript:ci": "lerna run --concurrency 5 --no-bail --no-sort typescript",
diff --git a/packages/eslint-plugin-material-ui/src/rules/disallow-active-elements-as-key-event-target.test.js b/packages/eslint-plugin-material-ui/src/rules/disallow-active-elements-as-key-event-target.test.js
index eb3e7a8ddead5d..785736f28d1aad 100644
--- a/packages/eslint-plugin-material-ui/src/rules/disallow-active-elements-as-key-event-target.test.js
+++ b/packages/eslint-plugin-material-ui/src/rules/disallow-active-elements-as-key-event-target.test.js
@@ -7,13 +7,13 @@ const ruleTester = new eslint.RuleTester({
 });
 ruleTester.run('disallow-active-element-as-key-event-target', rule, {
   valid: [
-    "import { fireEvent } from 'test/utils';\nfireEvent.keyDown(getByRole('button'), { key: ' ' })",
-    "import { fireEvent } from 'test/utils';\nfireEvent.keyDown(document.body, { key: 'Esc' })",
-    "import { fireEvent } from 'test/utils';\nfireEvent.keyUp(document.body, { key: 'Tab' })",
+    "import { fireEvent } from '@mui-internal/test-utils';\nfireEvent.keyDown(getByRole('button'), { key: ' ' })",
+    "import { fireEvent } from '@mui-internal/test-utils';\nfireEvent.keyDown(document.body, { key: 'Esc' })",
+    "import { fireEvent } from '@mui-internal/test-utils';\nfireEvent.keyUp(document.body, { key: 'Tab' })",
   ],
   invalid: [
     {
-      code: "import { fireEvent } from 'test/utils';\nfireEvent.keyUp(document.activeElement, { key: 'LeftArrow' })",
+      code: "import { fireEvent } from '@mui-internal/test-utils';\nfireEvent.keyUp(document.activeElement, { key: 'LeftArrow' })",
       errors: [
         {
           message:
@@ -23,7 +23,7 @@ ruleTester.run('disallow-active-element-as-key-event-target', rule, {
       ],
     },
     {
-      code: "import { fireEvent } from 'test/utils';\nfireEvent.keyDown(document.activeElement, { key: 'DownArrow' })",
+      code: "import { fireEvent } from '@mui-internal/test-utils';\nfireEvent.keyDown(document.activeElement, { key: 'DownArrow' })",
       errors: [
         {
           message:
@@ -54,7 +54,7 @@ ruleTester.run('disallow-active-element-as-key-event-target', rule, {
     },
     {
       // test non-null assertion operator
-      code: "import { fireEvent } from 'test/utils';\nfireEvent.keyUp(document.activeElement!, { key: 'LeftArrow' })",
+      code: "import { fireEvent } from '@mui-internal/test-utils';\nfireEvent.keyUp(document.activeElement!, { key: 'LeftArrow' })",
       errors: [
         {
           message:
diff --git a/packages/mui-base/package.json b/packages/mui-base/package.json
index 5dd89f61e2d26d..e0fe85e6682ce7 100644
--- a/packages/mui-base/package.json
+++ b/packages/mui-base/package.json
@@ -51,6 +51,7 @@
   },
   "devDependencies": {
     "@mui/material": "^5.14.10",
+    "@mui-internal/test-utils": "^1.0.0",
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.4.3",
     "@types/chai": "^4.3.6",
@@ -63,8 +64,7 @@
     "lodash": "^4.17.21",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "sinon": "^15.2.0",
-    "test": "^5.0.0"
+    "sinon": "^15.2.0"
   },
   "peerDependencies": {
     "@types/react": "^17.0.0 || ^18.0.0",
diff --git a/packages/mui-base/src/Badge/Badge.test.tsx b/packages/mui-base/src/Badge/Badge.test.tsx
index e49cf7c4e487ca..06a2ab6eeba209 100644
--- a/packages/mui-base/src/Badge/Badge.test.tsx
+++ b/packages/mui-base/src/Badge/Badge.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, createMount, describeConformanceUnstyled } from 'test/utils';
+import { createRenderer, createMount, describeConformanceUnstyled } from '@mui-internal/test-utils';
 import { Badge, badgeClasses as classes } from '@mui/base/Badge';
 
 describe('<Badge />', () => {
diff --git a/packages/mui-base/src/Button/Button.test.tsx b/packages/mui-base/src/Button/Button.test.tsx
index 38877a7f18c83b..cfd65c73aae6e9 100644
--- a/packages/mui-base/src/Button/Button.test.tsx
+++ b/packages/mui-base/src/Button/Button.test.tsx
@@ -5,7 +5,7 @@ import {
   createRenderer,
   describeConformanceUnstyled,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import { Button, buttonClasses } from '@mui/base/Button';
diff --git a/packages/mui-base/src/ClickAwayListener/ClickAwayListener.test.js b/packages/mui-base/src/ClickAwayListener/ClickAwayListener.test.js
index a72f3d0da0cc76..a0032961f41db8 100644
--- a/packages/mui-base/src/ClickAwayListener/ClickAwayListener.test.js
+++ b/packages/mui-base/src/ClickAwayListener/ClickAwayListener.test.js
@@ -2,7 +2,13 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { act, createRenderer, fireEvent, fireDiscreteEvent, screen } from 'test/utils';
+import {
+  act,
+  createRenderer,
+  fireEvent,
+  fireDiscreteEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import { Portal } from '@mui/base/Portal';
 import { ClickAwayListener } from '@mui/base/ClickAwayListener';
 
diff --git a/packages/mui-base/src/Dropdown/Dropdown.test.tsx b/packages/mui-base/src/Dropdown/Dropdown.test.tsx
index 1144a2290b1f46..7ce8d6d1f50102 100644
--- a/packages/mui-base/src/Dropdown/Dropdown.test.tsx
+++ b/packages/mui-base/src/Dropdown/Dropdown.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { act, createRenderer } from 'test/utils';
+import { act, createRenderer } from '@mui-internal/test-utils';
 import { Dropdown } from '@mui/base/Dropdown';
 import { DropdownContext } from '@mui/base/useDropdown';
 import { MenuButton } from '@mui/base/MenuButton';
diff --git a/packages/mui-base/src/FocusTrap/FocusTrap.test.tsx b/packages/mui-base/src/FocusTrap/FocusTrap.test.tsx
index 54d37b3cf80f25..b7ef8a3e020440 100644
--- a/packages/mui-base/src/FocusTrap/FocusTrap.test.tsx
+++ b/packages/mui-base/src/FocusTrap/FocusTrap.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { expect } from 'chai';
-import { act, createRenderer, screen } from 'test/utils';
+import { act, createRenderer, screen } from '@mui-internal/test-utils';
 import { FocusTrap } from '@mui/base/FocusTrap';
 import { Portal } from '@mui/base/Portal';
 
diff --git a/packages/mui-base/src/FormControl/FormControl.test.tsx b/packages/mui-base/src/FormControl/FormControl.test.tsx
index e977ed3605f244..77e28098291c80 100644
--- a/packages/mui-base/src/FormControl/FormControl.test.tsx
+++ b/packages/mui-base/src/FormControl/FormControl.test.tsx
@@ -1,7 +1,12 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createMount, createRenderer, describeConformanceUnstyled, fireEvent } from 'test/utils';
+import {
+  createMount,
+  createRenderer,
+  describeConformanceUnstyled,
+  fireEvent,
+} from '@mui-internal/test-utils';
 import { FormControl, formControlClasses, useFormControlContext } from '@mui/base/FormControl';
 
 describe('<FormControl />', () => {
diff --git a/packages/mui-base/src/Input/Input.test.tsx b/packages/mui-base/src/Input/Input.test.tsx
index 59f8458827d73e..d287be11ac25cd 100644
--- a/packages/mui-base/src/Input/Input.test.tsx
+++ b/packages/mui-base/src/Input/Input.test.tsx
@@ -5,7 +5,7 @@ import {
   describeConformanceUnstyled,
   fireEvent,
   screen,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import { Input, inputClasses } from '@mui/base/Input';
diff --git a/packages/mui-base/src/Menu/Menu.test.tsx b/packages/mui-base/src/Menu/Menu.test.tsx
index 7d2d637910bd1b..25f520d1569a2a 100644
--- a/packages/mui-base/src/Menu/Menu.test.tsx
+++ b/packages/mui-base/src/Menu/Menu.test.tsx
@@ -7,7 +7,7 @@ import {
   describeConformanceUnstyled,
   fireEvent,
   act,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { Menu, menuClasses } from '@mui/base/Menu';
 import { MenuItem } from '@mui/base/MenuItem';
 import { DropdownContext, DropdownContextValue } from '@mui/base/useDropdown';
diff --git a/packages/mui-base/src/MenuButton/MenuButton.test.tsx b/packages/mui-base/src/MenuButton/MenuButton.test.tsx
index 49ec949c233d06..44e359d2087448 100644
--- a/packages/mui-base/src/MenuButton/MenuButton.test.tsx
+++ b/packages/mui-base/src/MenuButton/MenuButton.test.tsx
@@ -7,7 +7,7 @@ import {
   createRenderer,
   describeConformanceUnstyled,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { MenuButton, menuButtonClasses } from '@mui/base/MenuButton';
 import { DropdownContext, DropdownContextValue, DropdownActionTypes } from '@mui/base/useDropdown';
 
diff --git a/packages/mui-base/src/MenuItem/MenuItem.test.tsx b/packages/mui-base/src/MenuItem/MenuItem.test.tsx
index e9f4f8953c6882..de5ca5bf01cec8 100644
--- a/packages/mui-base/src/MenuItem/MenuItem.test.tsx
+++ b/packages/mui-base/src/MenuItem/MenuItem.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createMount, createRenderer, describeConformanceUnstyled } from 'test/utils';
+import { createMount, createRenderer, describeConformanceUnstyled } from '@mui-internal/test-utils';
 import { MenuItem, menuItemClasses } from '@mui/base/MenuItem';
 import { MenuProvider } from '@mui/base/useMenu';
 
diff --git a/packages/mui-base/src/Modal/Modal.test.tsx b/packages/mui-base/src/Modal/Modal.test.tsx
index 35061f632f30cc..701fca622fd470 100644
--- a/packages/mui-base/src/Modal/Modal.test.tsx
+++ b/packages/mui-base/src/Modal/Modal.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createMount, createRenderer, describeConformanceUnstyled } from 'test/utils';
+import { createMount, createRenderer, describeConformanceUnstyled } from '@mui-internal/test-utils';
 import { Modal, modalClasses as classes, ModalRootSlotProps } from '@mui/base/Modal';
 
 describe('<Modal />', () => {
diff --git a/packages/mui-base/src/NoSsr/NoSsr.test.tsx b/packages/mui-base/src/NoSsr/NoSsr.test.tsx
index e0ccc25f82ec6e..16a1a6e3cdf9f1 100644
--- a/packages/mui-base/src/NoSsr/NoSsr.test.tsx
+++ b/packages/mui-base/src/NoSsr/NoSsr.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { NoSsr } from '@mui/base/NoSsr';
 
 describe('<NoSsr />', () => {
diff --git a/packages/mui-base/src/Option/Option.test.tsx b/packages/mui-base/src/Option/Option.test.tsx
index 9a9d294939919c..d34b4b7040ef9f 100644
--- a/packages/mui-base/src/Option/Option.test.tsx
+++ b/packages/mui-base/src/Option/Option.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createMount, createRenderer, describeConformanceUnstyled } from 'test/utils';
+import { createMount, createRenderer, describeConformanceUnstyled } from '@mui-internal/test-utils';
 import { Option, optionClasses } from '@mui/base/Option';
 import { SelectProvider } from '../useSelect/SelectProvider';
 
diff --git a/packages/mui-base/src/OptionGroup/OptionGroup.test.tsx b/packages/mui-base/src/OptionGroup/OptionGroup.test.tsx
index 320687241f5242..6e8e5f20ee190c 100644
--- a/packages/mui-base/src/OptionGroup/OptionGroup.test.tsx
+++ b/packages/mui-base/src/OptionGroup/OptionGroup.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createMount, createRenderer, describeConformanceUnstyled } from 'test/utils';
+import { createMount, createRenderer, describeConformanceUnstyled } from '@mui-internal/test-utils';
 import { OptionGroup, optionGroupClasses } from '@mui/base/OptionGroup';
 
 describe('<OptionGroup />', () => {
diff --git a/packages/mui-base/src/Popper/Popper.test.tsx b/packages/mui-base/src/Popper/Popper.test.tsx
index 194972e0a63c4f..404c4bbc822131 100644
--- a/packages/mui-base/src/Popper/Popper.test.tsx
+++ b/packages/mui-base/src/Popper/Popper.test.tsx
@@ -1,6 +1,11 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, createMount, describeConformanceUnstyled, screen } from 'test/utils';
+import {
+  createRenderer,
+  createMount,
+  describeConformanceUnstyled,
+  screen,
+} from '@mui-internal/test-utils';
 import { Popper, popperClasses } from '@mui/base/Popper';
 
 describe('<Popper />', () => {
diff --git a/packages/mui-base/src/Portal/Portal.test.tsx b/packages/mui-base/src/Portal/Portal.test.tsx
index 382af766bfae9c..2d0091ac5539fb 100644
--- a/packages/mui-base/src/Portal/Portal.test.tsx
+++ b/packages/mui-base/src/Portal/Portal.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { Portal, PortalProps } from '@mui/base/Portal';
 
 describe('<Portal />', () => {
diff --git a/packages/mui-base/src/Select/Select.test.tsx b/packages/mui-base/src/Select/Select.test.tsx
index 3511327037c924..145bfe0ae4e002 100644
--- a/packages/mui-base/src/Select/Select.test.tsx
+++ b/packages/mui-base/src/Select/Select.test.tsx
@@ -9,7 +9,7 @@ import {
   userEvent,
   act,
   screen,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { Select, SelectListboxSlotProps, selectClasses } from '@mui/base/Select';
 import { useOption, SelectOption } from '@mui/base/useOption';
 import { Option, OptionProps, optionClasses } from '@mui/base/Option';
diff --git a/packages/mui-base/src/Slider/Slider.test.tsx b/packages/mui-base/src/Slider/Slider.test.tsx
index 787b7ddd2e1b85..8905a763709add 100644
--- a/packages/mui-base/src/Slider/Slider.test.tsx
+++ b/packages/mui-base/src/Slider/Slider.test.tsx
@@ -8,7 +8,7 @@ import {
   describeConformanceUnstyled,
   fireEvent,
   screen,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import {
   Slider,
   sliderClasses as classes,
diff --git a/packages/mui-base/src/Snackbar/Snackbar.test.tsx b/packages/mui-base/src/Snackbar/Snackbar.test.tsx
index 11f1a5431e74e2..0f4fe6824ffbf2 100644
--- a/packages/mui-base/src/Snackbar/Snackbar.test.tsx
+++ b/packages/mui-base/src/Snackbar/Snackbar.test.tsx
@@ -7,7 +7,7 @@ import {
   createMount,
   describeConformanceUnstyled,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { Snackbar, snackbarClasses as classes } from '@mui/base/Snackbar';
 
 describe('<Snackbar />', () => {
diff --git a/packages/mui-base/src/Switch/Switch.test.tsx b/packages/mui-base/src/Switch/Switch.test.tsx
index 65b603e83a347d..6861f25b3b779d 100644
--- a/packages/mui-base/src/Switch/Switch.test.tsx
+++ b/packages/mui-base/src/Switch/Switch.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createMount, createRenderer, describeConformanceUnstyled } from 'test/utils';
+import { createMount, createRenderer, describeConformanceUnstyled } from '@mui-internal/test-utils';
 import { expect } from 'chai';
 import { Switch, SwitchOwnerState, switchClasses } from '@mui/base/Switch';
 
diff --git a/packages/mui-base/src/Tab/Tab.test.tsx b/packages/mui-base/src/Tab/Tab.test.tsx
index 056cbf45483e74..9f03a094bb4c24 100644
--- a/packages/mui-base/src/Tab/Tab.test.tsx
+++ b/packages/mui-base/src/Tab/Tab.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createMount, createRenderer, describeConformanceUnstyled } from 'test/utils';
+import { createMount, createRenderer, describeConformanceUnstyled } from '@mui-internal/test-utils';
 import { Tab, tabClasses } from '@mui/base/Tab';
 import { TabsListProvider, TabsListProviderValue } from '../useTabsList';
 import { TabsContext } from '../Tabs';
diff --git a/packages/mui-base/src/TabPanel/TabPanel.test.tsx b/packages/mui-base/src/TabPanel/TabPanel.test.tsx
index 453984c6c60334..5be5722b97017d 100644
--- a/packages/mui-base/src/TabPanel/TabPanel.test.tsx
+++ b/packages/mui-base/src/TabPanel/TabPanel.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createMount, createRenderer, describeConformanceUnstyled } from 'test/utils';
+import { createMount, createRenderer, describeConformanceUnstyled } from '@mui-internal/test-utils';
 import { TabPanel, tabPanelClasses } from '@mui/base/TabPanel';
 import { TabsProvider, TabsProviderValue } from '../useTabs';
 
diff --git a/packages/mui-base/src/TablePagination/TablePagination.test.tsx b/packages/mui-base/src/TablePagination/TablePagination.test.tsx
index fb55ab9d930756..813898a236b710 100644
--- a/packages/mui-base/src/TablePagination/TablePagination.test.tsx
+++ b/packages/mui-base/src/TablePagination/TablePagination.test.tsx
@@ -2,7 +2,12 @@ import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import PropTypes from 'prop-types';
-import { describeConformanceUnstyled, fireEvent, createRenderer, createMount } from 'test/utils';
+import {
+  describeConformanceUnstyled,
+  fireEvent,
+  createRenderer,
+  createMount,
+} from '@mui-internal/test-utils';
 import TableFooter from '@mui/material/TableFooter';
 import TableRow from '@mui/material/TableRow';
 import {
diff --git a/packages/mui-base/src/Tabs/Tabs.test.tsx b/packages/mui-base/src/Tabs/Tabs.test.tsx
index 564a59877784c8..8096e1404054d5 100644
--- a/packages/mui-base/src/Tabs/Tabs.test.tsx
+++ b/packages/mui-base/src/Tabs/Tabs.test.tsx
@@ -8,7 +8,7 @@ import {
   fireEvent,
   screen,
   createMount,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { Tab } from '@mui/base/Tab';
 import { Tabs, tabsClasses as classes, TabsProps } from '@mui/base/Tabs';
 import { TabsList } from '@mui/base/TabsList';
diff --git a/packages/mui-base/src/TabsList/TabsList.test.tsx b/packages/mui-base/src/TabsList/TabsList.test.tsx
index 2294d482656af6..0c547161abe083 100644
--- a/packages/mui-base/src/TabsList/TabsList.test.tsx
+++ b/packages/mui-base/src/TabsList/TabsList.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createMount, createRenderer, describeConformanceUnstyled } from 'test/utils';
+import { createMount, createRenderer, describeConformanceUnstyled } from '@mui-internal/test-utils';
 import { TabsContext } from '@mui/base/Tabs';
 import { TabsList, tabsListClasses } from '@mui/base/TabsList';
 
diff --git a/packages/mui-base/src/TextareaAutosize/TextareaAutosize.test.tsx b/packages/mui-base/src/TextareaAutosize/TextareaAutosize.test.tsx
index 3d70576baacd46..76db8c8d003cd9 100644
--- a/packages/mui-base/src/TextareaAutosize/TextareaAutosize.test.tsx
+++ b/packages/mui-base/src/TextareaAutosize/TextareaAutosize.test.tsx
@@ -10,7 +10,7 @@ import {
   createRenderer,
   fireEvent,
   strictModeDoubleLoggingSuppressed,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { TextareaAutosize } from '@mui/base/TextareaAutosize';
 
 function getStyleValue(value: string) {
diff --git a/packages/mui-base/src/Unstable_NumberInput/NumberInput.test.tsx b/packages/mui-base/src/Unstable_NumberInput/NumberInput.test.tsx
index 968b5dc55b5fce..2137df1b057c9d 100644
--- a/packages/mui-base/src/Unstable_NumberInput/NumberInput.test.tsx
+++ b/packages/mui-base/src/Unstable_NumberInput/NumberInput.test.tsx
@@ -8,7 +8,7 @@ import {
   createRenderer,
   describeConformanceUnstyled,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import {
   Unstable_NumberInput as NumberInput,
   numberInputClasses,
diff --git a/packages/mui-base/src/Unstable_Popup/Popup.test.tsx b/packages/mui-base/src/Unstable_Popup/Popup.test.tsx
index 958b6d9be06c84..a0d7d3b4b7598d 100644
--- a/packages/mui-base/src/Unstable_Popup/Popup.test.tsx
+++ b/packages/mui-base/src/Unstable_Popup/Popup.test.tsx
@@ -7,7 +7,7 @@ import {
   describeConformanceUnstyled,
   screen,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import {
   Unstable_Popup as Popup,
   popupClasses,
diff --git a/packages/mui-base/src/unstable_useNumberInput/useNumberInput.test.tsx b/packages/mui-base/src/unstable_useNumberInput/useNumberInput.test.tsx
index 53946ece059bdb..3163a2878f98ba 100644
--- a/packages/mui-base/src/unstable_useNumberInput/useNumberInput.test.tsx
+++ b/packages/mui-base/src/unstable_useNumberInput/useNumberInput.test.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import userEvent from '@testing-library/user-event';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import {
   unstable_useNumberInput as useNumberInput,
   UseNumberInputParameters,
diff --git a/packages/mui-base/src/useAutocomplete/useAutocomplete.test.js b/packages/mui-base/src/useAutocomplete/useAutocomplete.test.js
index 5ae4fc1a476188..0386731e59eeb8 100644
--- a/packages/mui-base/src/useAutocomplete/useAutocomplete.test.js
+++ b/packages/mui-base/src/useAutocomplete/useAutocomplete.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, screen, ErrorBoundary, act, fireEvent } from 'test/utils';
+import { createRenderer, screen, ErrorBoundary, act, fireEvent } from '@mui-internal/test-utils';
 import { spy } from 'sinon';
 import { useAutocomplete, createFilterOptions } from '@mui/base/useAutocomplete';
 
diff --git a/packages/mui-base/src/useButton/useButton.test.tsx b/packages/mui-base/src/useButton/useButton.test.tsx
index a0315a28a60ef9..860114c3eba9fb 100644
--- a/packages/mui-base/src/useButton/useButton.test.tsx
+++ b/packages/mui-base/src/useButton/useButton.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { act, createRenderer, fireEvent } from 'test/utils';
+import { act, createRenderer, fireEvent } from '@mui-internal/test-utils';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import { useButton } from '@mui/base/useButton';
diff --git a/packages/mui-base/src/useInput/useInput.test.tsx b/packages/mui-base/src/useInput/useInput.test.tsx
index 8cf1ef0b52f0c2..8f6622c2b36949 100644
--- a/packages/mui-base/src/useInput/useInput.test.tsx
+++ b/packages/mui-base/src/useInput/useInput.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { act, createRenderer } from 'test/utils';
+import { act, createRenderer } from '@mui-internal/test-utils';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import { useInput } from './useInput';
diff --git a/packages/mui-base/src/useList/useList.test.tsx b/packages/mui-base/src/useList/useList.test.tsx
index 31689bb6e4a82e..7e8ffa6f1ce2fb 100644
--- a/packages/mui-base/src/useList/useList.test.tsx
+++ b/packages/mui-base/src/useList/useList.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { SinonSpy, spy } from 'sinon';
-import { createRenderer, createEvent, fireEvent } from 'test/utils';
+import { createRenderer, createEvent, fireEvent } from '@mui-internal/test-utils';
 import { useList } from './useList';
 
 describe('useList', () => {
diff --git a/packages/mui-base/src/useMenu/useMenu.test.js b/packages/mui-base/src/useMenu/useMenu.test.js
index 589f5b04c07bfa..d3973de7d06f3f 100644
--- a/packages/mui-base/src/useMenu/useMenu.test.js
+++ b/packages/mui-base/src/useMenu/useMenu.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, screen, fireEvent } from 'test/utils';
+import { createRenderer, screen, fireEvent } from '@mui-internal/test-utils';
 import { MenuItem } from '../MenuItem';
 import { useMenu } from './useMenu';
 
diff --git a/packages/mui-base/src/useMenuButton/useMenuButton.test.tsx b/packages/mui-base/src/useMenuButton/useMenuButton.test.tsx
index a732764606a58a..d14beef942ad9a 100644
--- a/packages/mui-base/src/useMenuButton/useMenuButton.test.tsx
+++ b/packages/mui-base/src/useMenuButton/useMenuButton.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, screen, fireEvent } from 'test/utils';
+import { createRenderer, screen, fireEvent } from '@mui-internal/test-utils';
 import { DropdownContext, DropdownContextValue } from '@mui/base/useDropdown';
 import { useMenuButton } from './useMenuButton';
 
diff --git a/packages/mui-base/src/useMenuItem/useMenuItem.test.tsx b/packages/mui-base/src/useMenuItem/useMenuItem.test.tsx
index 0b9d51fe974882..a599bfb52ae110 100644
--- a/packages/mui-base/src/useMenuItem/useMenuItem.test.tsx
+++ b/packages/mui-base/src/useMenuItem/useMenuItem.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, screen, fireEvent } from 'test/utils';
+import { createRenderer, screen, fireEvent } from '@mui-internal/test-utils';
 import { Menu } from '../Menu';
 import { useMenuItem } from './useMenuItem';
 
diff --git a/packages/mui-base/src/useSnackbar/useSnackbar.test.tsx b/packages/mui-base/src/useSnackbar/useSnackbar.test.tsx
index c3608906ab554c..6ee48a71e0e017 100644
--- a/packages/mui-base/src/useSnackbar/useSnackbar.test.tsx
+++ b/packages/mui-base/src/useSnackbar/useSnackbar.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { fireEvent, createRenderer } from 'test/utils';
+import { fireEvent, createRenderer } from '@mui-internal/test-utils';
 import { useSnackbar, UseSnackbarParameters } from '@mui/base/useSnackbar';
 
 describe('useSnackbar', () => {
diff --git a/packages/mui-base/src/useSwitch/useSwitch.test.tsx b/packages/mui-base/src/useSwitch/useSwitch.test.tsx
index 194f05069afabe..0414f65ba3d0c2 100644
--- a/packages/mui-base/src/useSwitch/useSwitch.test.tsx
+++ b/packages/mui-base/src/useSwitch/useSwitch.test.tsx
@@ -8,7 +8,7 @@ import {
   programmaticFocusTriggersFocusVisible,
   screen,
   simulatePointerDevice,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { useSwitch, UseSwitchParameters } from '@mui/base/useSwitch';
 
 describe('useSwitch', () => {
diff --git a/packages/mui-base/src/utils/ClassNameConfigurator.test.tsx b/packages/mui-base/src/utils/ClassNameConfigurator.test.tsx
index 27a38e3a1611d5..85d6db68f7d791 100644
--- a/packages/mui-base/src/utils/ClassNameConfigurator.test.tsx
+++ b/packages/mui-base/src/utils/ClassNameConfigurator.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { expect } from 'chai';
 import { Switch, switchClasses } from '@mui/base/Switch';
 import { ClassNameConfigurator } from '@mui/base/utils/ClassNameConfigurator';
diff --git a/packages/mui-base/src/utils/prepareForSlot.test.tsx b/packages/mui-base/src/utils/prepareForSlot.test.tsx
index 29fe298bde164a..7b26144b2e6e79 100644
--- a/packages/mui-base/src/utils/prepareForSlot.test.tsx
+++ b/packages/mui-base/src/utils/prepareForSlot.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { Button } from '@mui/base/Button';
 import { prepareForSlot } from './prepareForSlot';
 
diff --git a/packages/mui-base/src/utils/useCompound.test.tsx b/packages/mui-base/src/utils/useCompound.test.tsx
index a7214fda0efc54..8a0361fa7e7d42 100644
--- a/packages/mui-base/src/utils/useCompound.test.tsx
+++ b/packages/mui-base/src/utils/useCompound.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { render } from 'test/utils';
+import { render } from '@mui-internal/test-utils';
 import { CompoundComponentContext, useCompoundParent } from './useCompound';
 import { useCompoundItem } from './useCompoundItem';
 
diff --git a/packages/mui-base/src/utils/useControllableReducer.test.tsx b/packages/mui-base/src/utils/useControllableReducer.test.tsx
index 87b4b1204b7a29..e6a77bd08eaacb 100644
--- a/packages/mui-base/src/utils/useControllableReducer.test.tsx
+++ b/packages/mui-base/src/utils/useControllableReducer.test.tsx
@@ -1,7 +1,7 @@
 import { expect } from 'chai';
 import * as React from 'react';
 import { spy } from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { useControllableReducer } from './useControllableReducer';
 import { ControllableReducerParameters } from './useControllableReducer.types';
 
diff --git a/packages/mui-base/src/utils/useSlotProps.test.tsx b/packages/mui-base/src/utils/useSlotProps.test.tsx
index 600ba65a066e50..367aeba5ee67cb 100644
--- a/packages/mui-base/src/utils/useSlotProps.test.tsx
+++ b/packages/mui-base/src/utils/useSlotProps.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { EventHandlers } from '@mui/base';
 import { useSlotProps, UseSlotPropsParameters, UseSlotPropsResult } from './useSlotProps';
 
diff --git a/packages/mui-joy/package.json b/packages/mui-joy/package.json
index a09b5f0058afd1..39f0a357baa5a4 100644
--- a/packages/mui-joy/package.json
+++ b/packages/mui-joy/package.json
@@ -49,6 +49,7 @@
   },
   "devDependencies": {
     "@mui/material": "^5.14.10",
+    "@mui-internal/test-utils": "^1.0.0",
     "@types/chai": "^4.3.6",
     "@types/prop-types": "^15.7.5",
     "@types/react": "^18.2.21",
@@ -60,8 +61,7 @@
     "next": "^13.4.19",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "sinon": "^15.2.0",
-    "test": "^5.0.0"
+    "sinon": "^15.2.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",
diff --git a/packages/mui-joy/src/Accordion/Accordion.test.tsx b/packages/mui-joy/src/Accordion/Accordion.test.tsx
index f6139486246885..a26905361028b5 100644
--- a/packages/mui-joy/src/Accordion/Accordion.test.tsx
+++ b/packages/mui-joy/src/Accordion/Accordion.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, describeConformance, fireEvent } from 'test/utils';
+import { createRenderer, describeConformance, fireEvent } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Accordion, { accordionClasses as classes } from '@mui/joy/Accordion';
 import AccordionSummary from '@mui/joy/AccordionSummary';
diff --git a/packages/mui-joy/src/AccordionDetails/AccordionDetails.test.tsx b/packages/mui-joy/src/AccordionDetails/AccordionDetails.test.tsx
index 2051ac9c97a0a2..5afd57b2794f3f 100644
--- a/packages/mui-joy/src/AccordionDetails/AccordionDetails.test.tsx
+++ b/packages/mui-joy/src/AccordionDetails/AccordionDetails.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, fireEvent, screen } from 'test/utils';
+import { createRenderer, describeConformance, fireEvent, screen } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Accordion from '@mui/joy/Accordion';
 import AccordionSummary from '@mui/joy/AccordionSummary';
diff --git a/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx b/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx
index abb5e61b810f29..50dbfbd9de058d 100644
--- a/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx
+++ b/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import AccordionGroup, { accordionGroupClasses as classes } from '@mui/joy/AccordionGroup';
 
diff --git a/packages/mui-joy/src/AccordionSummary/AccordionSummary.test.tsx b/packages/mui-joy/src/AccordionSummary/AccordionSummary.test.tsx
index 38e6992b813812..4c21ff09e95ce4 100644
--- a/packages/mui-joy/src/AccordionSummary/AccordionSummary.test.tsx
+++ b/packages/mui-joy/src/AccordionSummary/AccordionSummary.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import AccordionSummary, { accordionSummaryClasses as classes } from '@mui/joy/AccordionSummary';
 
diff --git a/packages/mui-joy/src/Alert/Alert.test.tsx b/packages/mui-joy/src/Alert/Alert.test.tsx
index 8edc33de165dd9..58003f6ebe9363 100644
--- a/packages/mui-joy/src/Alert/Alert.test.tsx
+++ b/packages/mui-joy/src/Alert/Alert.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Alert, { AlertClassKey, alertClasses as classes } from '@mui/joy/Alert';
diff --git a/packages/mui-joy/src/AspectRatio/AspectRatio.test.tsx b/packages/mui-joy/src/AspectRatio/AspectRatio.test.tsx
index 5dc77a5ba452fb..855482a1a59530 100644
--- a/packages/mui-joy/src/AspectRatio/AspectRatio.test.tsx
+++ b/packages/mui-joy/src/AspectRatio/AspectRatio.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import AspectRatio, {
diff --git a/packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx b/packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx
index 1c3da3551ba3b0..4fbe3908ea0834 100644
--- a/packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx
+++ b/packages/mui-joy/src/Autocomplete/Autocomplete.test.tsx
@@ -10,7 +10,7 @@ import {
   fireEvent,
   strictModeDoubleLoggingSuppressed,
   describeJoyColorInversion,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import Autocomplete, {
   autocompleteClasses as classes,
   createFilterOptions,
diff --git a/packages/mui-joy/src/AutocompleteListbox/AutocompleteListbox.test.tsx b/packages/mui-joy/src/AutocompleteListbox/AutocompleteListbox.test.tsx
index 5a134270a0dddb..d2aa9408bbc062 100644
--- a/packages/mui-joy/src/AutocompleteListbox/AutocompleteListbox.test.tsx
+++ b/packages/mui-joy/src/AutocompleteListbox/AutocompleteListbox.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import AutocompleteListbox, {
   autocompleteListboxClasses as classes,
diff --git a/packages/mui-joy/src/AutocompleteOption/AutocompleteOption.test.tsx b/packages/mui-joy/src/AutocompleteOption/AutocompleteOption.test.tsx
index 30337a4f1c2664..2e3cbd1519b956 100644
--- a/packages/mui-joy/src/AutocompleteOption/AutocompleteOption.test.tsx
+++ b/packages/mui-joy/src/AutocompleteOption/AutocompleteOption.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import AutocompleteOption, {
   autocompleteOptionClasses as classes,
diff --git a/packages/mui-joy/src/Avatar/Avatar.test.tsx b/packages/mui-joy/src/Avatar/Avatar.test.tsx
index e37db3caf2b486..c1d9bf1be2aabf 100644
--- a/packages/mui-joy/src/Avatar/Avatar.test.tsx
+++ b/packages/mui-joy/src/Avatar/Avatar.test.tsx
@@ -6,7 +6,7 @@ import {
   describeConformance,
   describeJoyColorInversion,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Avatar, { AvatarClassKey, avatarClasses as classes } from '@mui/joy/Avatar';
diff --git a/packages/mui-joy/src/AvatarGroup/AvatarGroup.test.tsx b/packages/mui-joy/src/AvatarGroup/AvatarGroup.test.tsx
index 3b66ccbf96c150..debab8f46265ea 100644
--- a/packages/mui-joy/src/AvatarGroup/AvatarGroup.test.tsx
+++ b/packages/mui-joy/src/AvatarGroup/AvatarGroup.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import AvatarGroup, { avatarGroupClasses as classes } from '@mui/joy/AvatarGroup';
 import Avatar, { avatarClasses } from '@mui/joy/Avatar';
diff --git a/packages/mui-joy/src/Badge/Badge.test.tsx b/packages/mui-joy/src/Badge/Badge.test.tsx
index 13921cb3f5d864..672b81c87d3ae2 100644
--- a/packages/mui-joy/src/Badge/Badge.test.tsx
+++ b/packages/mui-joy/src/Badge/Badge.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Badge, { BadgeClassKey, BadgeOrigin, badgeClasses as classes } from '@mui/joy/Badge';
diff --git a/packages/mui-joy/src/Box/Box.test.tsx b/packages/mui-joy/src/Box/Box.test.tsx
index 552cdfa3b30d23..ac4108897d991c 100644
--- a/packages/mui-joy/src/Box/Box.test.tsx
+++ b/packages/mui-joy/src/Box/Box.test.tsx
@@ -1,7 +1,7 @@
 /* eslint-disable material-ui/no-empty-box */
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider, CssVarsProvider, extendTheme, PalettePrimary } from '@mui/joy/styles';
 import { unstable_ClassNameGenerator as ClassNameGenerator } from '@mui/joy/className';
 import Box from '@mui/joy/Box';
diff --git a/packages/mui-joy/src/Breadcrumbs/Breadcrumbs.test.tsx b/packages/mui-joy/src/Breadcrumbs/Breadcrumbs.test.tsx
index 4768e6c84d5edb..937ad578eb4e2a 100644
--- a/packages/mui-joy/src/Breadcrumbs/Breadcrumbs.test.tsx
+++ b/packages/mui-joy/src/Breadcrumbs/Breadcrumbs.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Breadcrumbs, {
diff --git a/packages/mui-joy/src/Button/Button.test.tsx b/packages/mui-joy/src/Button/Button.test.tsx
index 0770d8664f43b2..69d504e45780d3 100644
--- a/packages/mui-joy/src/Button/Button.test.tsx
+++ b/packages/mui-joy/src/Button/Button.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import Button, { buttonClasses as classes } from '@mui/joy/Button';
 import { ThemeProvider } from '@mui/joy/styles';
 
diff --git a/packages/mui-joy/src/ButtonGroup/ButtonGroup.test.tsx b/packages/mui-joy/src/ButtonGroup/ButtonGroup.test.tsx
index a709c1e23ab5fc..f18621a9955fd6 100644
--- a/packages/mui-joy/src/ButtonGroup/ButtonGroup.test.tsx
+++ b/packages/mui-joy/src/ButtonGroup/ButtonGroup.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import ButtonGroup, {
diff --git a/packages/mui-joy/src/Card/Card.test.tsx b/packages/mui-joy/src/Card/Card.test.tsx
index ae773620f6869e..88272f6688a1c5 100644
--- a/packages/mui-joy/src/Card/Card.test.tsx
+++ b/packages/mui-joy/src/Card/Card.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Card, { cardClasses as classes, CardClassKey } from '@mui/joy/Card';
diff --git a/packages/mui-joy/src/CardActions/CardActions.test.tsx b/packages/mui-joy/src/CardActions/CardActions.test.tsx
index d128e67c0f692f..3a5f0f6bc8b499 100644
--- a/packages/mui-joy/src/CardActions/CardActions.test.tsx
+++ b/packages/mui-joy/src/CardActions/CardActions.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import CardActions, { cardActionsClasses as classes } from '@mui/joy/CardActions';
 
diff --git a/packages/mui-joy/src/CardContent/CardContent.test.tsx b/packages/mui-joy/src/CardContent/CardContent.test.tsx
index bcedfa180b8f33..f457f9260369da 100644
--- a/packages/mui-joy/src/CardContent/CardContent.test.tsx
+++ b/packages/mui-joy/src/CardContent/CardContent.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import CardContent, { cardContentClasses as classes } from '@mui/joy/CardContent';
 
diff --git a/packages/mui-joy/src/CardCover/CardCover.test.tsx b/packages/mui-joy/src/CardCover/CardCover.test.tsx
index ec5b940bf75130..8c3a228d56ab79 100644
--- a/packages/mui-joy/src/CardCover/CardCover.test.tsx
+++ b/packages/mui-joy/src/CardCover/CardCover.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import CardCover, { cardCoverClasses as classes } from '@mui/joy/CardCover';
 
diff --git a/packages/mui-joy/src/CardOverflow/CardOverflow.test.tsx b/packages/mui-joy/src/CardOverflow/CardOverflow.test.tsx
index 0a677d2469d4da..33619311553c68 100644
--- a/packages/mui-joy/src/CardOverflow/CardOverflow.test.tsx
+++ b/packages/mui-joy/src/CardOverflow/CardOverflow.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import CardOverflow, {
diff --git a/packages/mui-joy/src/Checkbox/Checkbox.test.tsx b/packages/mui-joy/src/Checkbox/Checkbox.test.tsx
index 61c396d2840a17..a52ee390e075a6 100644
--- a/packages/mui-joy/src/Checkbox/Checkbox.test.tsx
+++ b/packages/mui-joy/src/Checkbox/Checkbox.test.tsx
@@ -6,7 +6,7 @@ import {
   createRenderer,
   fireEvent,
   describeJoyColorInversion,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import Checkbox, { checkboxClasses as classes } from '@mui/joy/Checkbox';
 import { ThemeProvider } from '@mui/joy/styles';
 import CloseIcon from '../internal/svg-icons/Close';
diff --git a/packages/mui-joy/src/Chip/Chip.test.tsx b/packages/mui-joy/src/Chip/Chip.test.tsx
index 1a45600c0ecb88..952079d7dd80a6 100644
--- a/packages/mui-joy/src/Chip/Chip.test.tsx
+++ b/packages/mui-joy/src/Chip/Chip.test.tsx
@@ -6,7 +6,7 @@ import {
   describeConformance,
   describeJoyColorInversion,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Chip, { ChipClassKey, chipClasses as classes } from '@mui/joy/Chip';
diff --git a/packages/mui-joy/src/ChipDelete/ChipDelete.test.tsx b/packages/mui-joy/src/ChipDelete/ChipDelete.test.tsx
index ba9328c78b8d51..b6ff05e0483838 100644
--- a/packages/mui-joy/src/ChipDelete/ChipDelete.test.tsx
+++ b/packages/mui-joy/src/ChipDelete/ChipDelete.test.tsx
@@ -7,7 +7,7 @@ import {
   describeJoyColorInversion,
   act,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Chip from '@mui/joy/Chip';
 import ChipDelete, { chipDeleteClasses as classes } from '@mui/joy/ChipDelete';
diff --git a/packages/mui-joy/src/CircularProgress/CircularProgress.test.tsx b/packages/mui-joy/src/CircularProgress/CircularProgress.test.tsx
index 6e4b421cbc37c4..8316f1454bb014 100644
--- a/packages/mui-joy/src/CircularProgress/CircularProgress.test.tsx
+++ b/packages/mui-joy/src/CircularProgress/CircularProgress.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import CircularProgress, { circularProgressClasses as classes } from '@mui/joy/CircularProgress';
diff --git a/packages/mui-joy/src/Container/Container.test.tsx b/packages/mui-joy/src/Container/Container.test.tsx
index 4fd0d207ed2b46..9094c70a701358 100644
--- a/packages/mui-joy/src/Container/Container.test.tsx
+++ b/packages/mui-joy/src/Container/Container.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Container, { containerClasses as classes } from '@mui/joy/Container';
 
diff --git a/packages/mui-joy/src/DialogActions/DialogActions.test.tsx b/packages/mui-joy/src/DialogActions/DialogActions.test.tsx
index 22185193135585..00cb6e9070239a 100644
--- a/packages/mui-joy/src/DialogActions/DialogActions.test.tsx
+++ b/packages/mui-joy/src/DialogActions/DialogActions.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import DialogActions, { dialogActionsClasses as classes } from '@mui/joy/DialogActions';
 
diff --git a/packages/mui-joy/src/DialogContent/DialogContent.test.tsx b/packages/mui-joy/src/DialogContent/DialogContent.test.tsx
index f764ffcbb98439..be5e64079572ef 100644
--- a/packages/mui-joy/src/DialogContent/DialogContent.test.tsx
+++ b/packages/mui-joy/src/DialogContent/DialogContent.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import DialogContent, { dialogContentClasses as classes } from '@mui/joy/DialogContent';
 
diff --git a/packages/mui-joy/src/DialogTitle/DialogTitle.test.tsx b/packages/mui-joy/src/DialogTitle/DialogTitle.test.tsx
index bcedfa180b8f33..f457f9260369da 100644
--- a/packages/mui-joy/src/DialogTitle/DialogTitle.test.tsx
+++ b/packages/mui-joy/src/DialogTitle/DialogTitle.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import CardContent, { cardContentClasses as classes } from '@mui/joy/CardContent';
 
diff --git a/packages/mui-joy/src/Divider/Divider.test.tsx b/packages/mui-joy/src/Divider/Divider.test.tsx
index aab564a1f3848a..efe1574a149619 100644
--- a/packages/mui-joy/src/Divider/Divider.test.tsx
+++ b/packages/mui-joy/src/Divider/Divider.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Divider, { dividerClasses as classes } from '@mui/joy/Divider';
 
diff --git a/packages/mui-joy/src/Drawer/Drawer.test.tsx b/packages/mui-joy/src/Drawer/Drawer.test.tsx
index e57b781b144ec1..786dd8e6452248 100644
--- a/packages/mui-joy/src/Drawer/Drawer.test.tsx
+++ b/packages/mui-joy/src/Drawer/Drawer.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Drawer, { drawerClasses as classes } from '@mui/joy/Drawer';
 
diff --git a/packages/mui-joy/src/FormControl/FormControl.test.tsx b/packages/mui-joy/src/FormControl/FormControl.test.tsx
index b3dc5d7d9a8cbb..1ef6de294d1b5a 100644
--- a/packages/mui-joy/src/FormControl/FormControl.test.tsx
+++ b/packages/mui-joy/src/FormControl/FormControl.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import FormControl, { formControlClasses as classes } from '@mui/joy/FormControl';
diff --git a/packages/mui-joy/src/FormHelperText/FormHelperText.test.tsx b/packages/mui-joy/src/FormHelperText/FormHelperText.test.tsx
index e82dd4d6108661..48b5c31cb221ba 100644
--- a/packages/mui-joy/src/FormHelperText/FormHelperText.test.tsx
+++ b/packages/mui-joy/src/FormHelperText/FormHelperText.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import FormHelperText, { formHelperTextClasses as classes } from '@mui/joy/FormHelperText';
 
diff --git a/packages/mui-joy/src/FormLabel/FormLabel.test.tsx b/packages/mui-joy/src/FormLabel/FormLabel.test.tsx
index a98c55e967c2c9..ec5cb89df1e1db 100644
--- a/packages/mui-joy/src/FormLabel/FormLabel.test.tsx
+++ b/packages/mui-joy/src/FormLabel/FormLabel.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import FormLabel, { formLabelClasses as classes } from '@mui/joy/FormLabel';
 
diff --git a/packages/mui-joy/src/Grid/Grid.test.tsx b/packages/mui-joy/src/Grid/Grid.test.tsx
index 577d6c75187ae1..06a9c77a84701e 100644
--- a/packages/mui-joy/src/Grid/Grid.test.tsx
+++ b/packages/mui-joy/src/Grid/Grid.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Grid, { gridClasses as classes } from '@mui/joy/Grid';
 
diff --git a/packages/mui-joy/src/IconButton/IconButton.test.tsx b/packages/mui-joy/src/IconButton/IconButton.test.tsx
index 258fa9025a7977..358c1fb4e89a80 100644
--- a/packages/mui-joy/src/IconButton/IconButton.test.tsx
+++ b/packages/mui-joy/src/IconButton/IconButton.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import IconButton, { iconButtonClasses as classes } from '@mui/joy/IconButton';
 import { ThemeProvider } from '@mui/joy/styles';
 
diff --git a/packages/mui-joy/src/Input/Input.test.tsx b/packages/mui-joy/src/Input/Input.test.tsx
index 991362f9522b98..839ab09b864861 100644
--- a/packages/mui-joy/src/Input/Input.test.tsx
+++ b/packages/mui-joy/src/Input/Input.test.tsx
@@ -8,7 +8,7 @@ import {
   screen,
   act,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import Input, { inputClasses as classes } from '@mui/joy/Input';
 import { ThemeProvider } from '@mui/joy/styles';
 
diff --git a/packages/mui-joy/src/LinearProgress/LinearProgress.test.tsx b/packages/mui-joy/src/LinearProgress/LinearProgress.test.tsx
index ceb9ced2abb27a..1cdac10d1daab2 100644
--- a/packages/mui-joy/src/LinearProgress/LinearProgress.test.tsx
+++ b/packages/mui-joy/src/LinearProgress/LinearProgress.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import LinearProgress, { linearProgressClasses as classes } from '@mui/joy/LinearProgress';
diff --git a/packages/mui-joy/src/Link/Link.test.tsx b/packages/mui-joy/src/Link/Link.test.tsx
index 33c188aa2fab95..f5ec486606602e 100644
--- a/packages/mui-joy/src/Link/Link.test.tsx
+++ b/packages/mui-joy/src/Link/Link.test.tsx
@@ -7,7 +7,7 @@ import {
   fireEvent,
   describeConformance,
   describeJoyColorInversion,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import Link, { LinkClassKey, linkClasses as classes } from '@mui/joy/Link';
 import Typography from '@mui/joy/Typography';
diff --git a/packages/mui-joy/src/List/List.test.tsx b/packages/mui-joy/src/List/List.test.tsx
index d1d4c908eecb0b..5959b877d3619f 100644
--- a/packages/mui-joy/src/List/List.test.tsx
+++ b/packages/mui-joy/src/List/List.test.tsx
@@ -1,6 +1,11 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, screen, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  screen,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import List, { listClasses as classes } from '@mui/joy/List';
 import ListItem from '@mui/joy/ListItem';
diff --git a/packages/mui-joy/src/ListDivider/ListDivider.test.tsx b/packages/mui-joy/src/ListDivider/ListDivider.test.tsx
index fc7c2bde18cf6c..1a6515afaa5d73 100644
--- a/packages/mui-joy/src/ListDivider/ListDivider.test.tsx
+++ b/packages/mui-joy/src/ListDivider/ListDivider.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, screen } from 'test/utils';
+import { describeConformance, createRenderer, screen } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import List from '@mui/joy/List';
 import ListDivider, { listDividerClasses as classes } from '@mui/joy/ListDivider';
diff --git a/packages/mui-joy/src/ListItem/ListItem.test.tsx b/packages/mui-joy/src/ListItem/ListItem.test.tsx
index bc10d7db269953..9275155bcfbd99 100644
--- a/packages/mui-joy/src/ListItem/ListItem.test.tsx
+++ b/packages/mui-joy/src/ListItem/ListItem.test.tsx
@@ -1,6 +1,11 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, screen, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  screen,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import MenuList from '@mui/joy/MenuList';
 import List from '@mui/joy/List';
diff --git a/packages/mui-joy/src/ListItemButton/ListItemButton.test.tsx b/packages/mui-joy/src/ListItemButton/ListItemButton.test.tsx
index 5ab7c298db99fb..4d84724100881f 100644
--- a/packages/mui-joy/src/ListItemButton/ListItemButton.test.tsx
+++ b/packages/mui-joy/src/ListItemButton/ListItemButton.test.tsx
@@ -6,7 +6,7 @@ import {
   createRenderer,
   act,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import ListItemButton, { listItemButtonClasses as classes } from '@mui/joy/ListItemButton';
 
diff --git a/packages/mui-joy/src/ListItemContent/ListItemContent.test.tsx b/packages/mui-joy/src/ListItemContent/ListItemContent.test.tsx
index 63b0ba0d99328e..5727a4fecda71b 100644
--- a/packages/mui-joy/src/ListItemContent/ListItemContent.test.tsx
+++ b/packages/mui-joy/src/ListItemContent/ListItemContent.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import ListItemContent, { listItemContentClasses as classes } from '@mui/joy/ListItemContent';
 
diff --git a/packages/mui-joy/src/ListItemDecorator/ListItemDecorator.test.tsx b/packages/mui-joy/src/ListItemDecorator/ListItemDecorator.test.tsx
index 79aed7bc933374..1b0bad3280aaa8 100644
--- a/packages/mui-joy/src/ListItemDecorator/ListItemDecorator.test.tsx
+++ b/packages/mui-joy/src/ListItemDecorator/ListItemDecorator.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import ListItemDecorator, { listItemDecoratorClasses as classes } from '@mui/joy/ListItemDecorator';
 
diff --git a/packages/mui-joy/src/ListSubheader/ListSubheader.test.tsx b/packages/mui-joy/src/ListSubheader/ListSubheader.test.tsx
index d09aadf428a89a..0e406e20ed9473 100644
--- a/packages/mui-joy/src/ListSubheader/ListSubheader.test.tsx
+++ b/packages/mui-joy/src/ListSubheader/ListSubheader.test.tsx
@@ -1,7 +1,11 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, createRenderer, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import ListSubheader, { listSubheaderClasses as classes } from '@mui/joy/ListSubheader';
 import ListSubheaderDispatch from './ListSubheaderContext';
diff --git a/packages/mui-joy/src/Menu/Menu.test.tsx b/packages/mui-joy/src/Menu/Menu.test.tsx
index 6a9abc45921766..143b191faab91e 100644
--- a/packages/mui-joy/src/Menu/Menu.test.tsx
+++ b/packages/mui-joy/src/Menu/Menu.test.tsx
@@ -8,7 +8,7 @@ import {
   screen,
   fireEvent,
   describeJoyColorInversion,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { Popper as PopperUnstyled } from '@mui/base/Popper';
 import { DropdownContext, DropdownContextValue } from '@mui/base/useDropdown';
 import { ThemeProvider } from '@mui/joy/styles';
diff --git a/packages/mui-joy/src/MenuButton/MenuButton.test.tsx b/packages/mui-joy/src/MenuButton/MenuButton.test.tsx
index db611630242781..ba265e18575be2 100644
--- a/packages/mui-joy/src/MenuButton/MenuButton.test.tsx
+++ b/packages/mui-joy/src/MenuButton/MenuButton.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { DropdownContext, DropdownContextValue } from '@mui/base/useDropdown';
 import { ThemeProvider } from '@mui/joy/styles';
 import MenuButton, { menuButtonClasses as classes } from '@mui/joy/MenuButton';
diff --git a/packages/mui-joy/src/MenuItem/MenuItem.test.tsx b/packages/mui-joy/src/MenuItem/MenuItem.test.tsx
index 661ce4dadecf81..3bce808e700b04 100644
--- a/packages/mui-joy/src/MenuItem/MenuItem.test.tsx
+++ b/packages/mui-joy/src/MenuItem/MenuItem.test.tsx
@@ -8,7 +8,7 @@ import {
   fireEvent,
   screen,
   describeJoyColorInversion,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { MenuProvider, MenuProviderValue } from '@mui/base/useMenu';
 import { ThemeProvider } from '@mui/joy/styles';
 import MenuItem, { menuItemClasses as classes } from '@mui/joy/MenuItem';
diff --git a/packages/mui-joy/src/MenuList/MenuList.test.tsx b/packages/mui-joy/src/MenuList/MenuList.test.tsx
index 8861d7d436f146..a95592b17bc4b3 100644
--- a/packages/mui-joy/src/MenuList/MenuList.test.tsx
+++ b/packages/mui-joy/src/MenuList/MenuList.test.tsx
@@ -1,6 +1,11 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, screen, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  screen,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import MenuList, { menuListClasses as classes } from '@mui/joy/MenuList';
 
diff --git a/packages/mui-joy/src/Modal/Modal.test.tsx b/packages/mui-joy/src/Modal/Modal.test.tsx
index 15415281cb7593..3d79c7b8cd6969 100644
--- a/packages/mui-joy/src/Modal/Modal.test.tsx
+++ b/packages/mui-joy/src/Modal/Modal.test.tsx
@@ -2,7 +2,13 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { spy } from 'sinon';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, act, fireEvent, within } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  act,
+  fireEvent,
+  within,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Modal, { modalClasses as classes, ModalProps } from '@mui/joy/Modal';
 
diff --git a/packages/mui-joy/src/ModalClose/ModalClose.test.tsx b/packages/mui-joy/src/ModalClose/ModalClose.test.tsx
index 48f9a37da4c332..4bd68b15827b79 100644
--- a/packages/mui-joy/src/ModalClose/ModalClose.test.tsx
+++ b/packages/mui-joy/src/ModalClose/ModalClose.test.tsx
@@ -6,7 +6,7 @@ import {
   describeConformance,
   describeJoyColorInversion,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Modal from '@mui/joy/Modal';
diff --git a/packages/mui-joy/src/ModalDialog/ModalDialog.test.tsx b/packages/mui-joy/src/ModalDialog/ModalDialog.test.tsx
index 437c52036b6fc8..c07f4e3e5d84e2 100644
--- a/packages/mui-joy/src/ModalDialog/ModalDialog.test.tsx
+++ b/packages/mui-joy/src/ModalDialog/ModalDialog.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import ModalDialog, { modalDialogClasses as classes } from '@mui/joy/ModalDialog';
diff --git a/packages/mui-joy/src/ModalOverflow/ModalOverflow.test.tsx b/packages/mui-joy/src/ModalOverflow/ModalOverflow.test.tsx
index 6b2268cc25fffb..4b33be3c56985f 100644
--- a/packages/mui-joy/src/ModalOverflow/ModalOverflow.test.tsx
+++ b/packages/mui-joy/src/ModalOverflow/ModalOverflow.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import ModalOverflow, { modalOverflowClasses as classes } from '@mui/joy/ModalOverflow';
 
diff --git a/packages/mui-joy/src/Radio/Radio.test.tsx b/packages/mui-joy/src/Radio/Radio.test.tsx
index a3460d781e2260..eaf3bf40235e82 100644
--- a/packages/mui-joy/src/Radio/Radio.test.tsx
+++ b/packages/mui-joy/src/Radio/Radio.test.tsx
@@ -6,7 +6,7 @@ import {
   createRenderer,
   fireEvent,
   describeJoyColorInversion,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import Radio, { radioClasses as classes } from '@mui/joy/Radio';
 import { ThemeProvider } from '@mui/joy/styles';
 
diff --git a/packages/mui-joy/src/RadioGroup/RadioGroup.test.tsx b/packages/mui-joy/src/RadioGroup/RadioGroup.test.tsx
index 90f2665ad56884..1c622252b9cff3 100644
--- a/packages/mui-joy/src/RadioGroup/RadioGroup.test.tsx
+++ b/packages/mui-joy/src/RadioGroup/RadioGroup.test.tsx
@@ -2,7 +2,13 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import RadioGroup, { radioGroupClasses as classes, RadioGroupProps } from '@mui/joy/RadioGroup';
 import Radio from '@mui/joy/Radio';
 import { ThemeProvider } from '@mui/joy/styles';
diff --git a/packages/mui-joy/src/ScopedCssBaseline/ScopedCssBaseline.test.tsx b/packages/mui-joy/src/ScopedCssBaseline/ScopedCssBaseline.test.tsx
index 19802b8143d99f..064797f0a7a41d 100644
--- a/packages/mui-joy/src/ScopedCssBaseline/ScopedCssBaseline.test.tsx
+++ b/packages/mui-joy/src/ScopedCssBaseline/ScopedCssBaseline.test.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import ScopedCssBaseline, { scopedCssBaselineClasses as classes } from '@mui/joy/ScopedCssBaseline';
 
diff --git a/packages/mui-joy/src/Select/Select.test.tsx b/packages/mui-joy/src/Select/Select.test.tsx
index 5a777cde503109..239871e5a8e49f 100644
--- a/packages/mui-joy/src/Select/Select.test.tsx
+++ b/packages/mui-joy/src/Select/Select.test.tsx
@@ -8,7 +8,7 @@ import {
   createRenderer,
   fireEvent,
   screen,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Select, { selectClasses as classes, SelectOption } from '@mui/joy/Select';
 import Option from '@mui/joy/Option';
diff --git a/packages/mui-joy/src/Sheet/Sheet.test.tsx b/packages/mui-joy/src/Sheet/Sheet.test.tsx
index 210529638d6d8c..6b9c58e3752461 100644
--- a/packages/mui-joy/src/Sheet/Sheet.test.tsx
+++ b/packages/mui-joy/src/Sheet/Sheet.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Sheet, { sheetClasses as classes, SheetClassKey } from '@mui/joy/Sheet';
diff --git a/packages/mui-joy/src/Skeleton/Skeleton.test.tsx b/packages/mui-joy/src/Skeleton/Skeleton.test.tsx
index 0c130cd18a70c9..854409169b2710 100644
--- a/packages/mui-joy/src/Skeleton/Skeleton.test.tsx
+++ b/packages/mui-joy/src/Skeleton/Skeleton.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Skeleton, { skeletonClasses as classes } from '@mui/joy/Skeleton';
 
diff --git a/packages/mui-joy/src/Slider/Slider.test.tsx b/packages/mui-joy/src/Slider/Slider.test.tsx
index 40767eb0060e85..8e2a08410db6e6 100644
--- a/packages/mui-joy/src/Slider/Slider.test.tsx
+++ b/packages/mui-joy/src/Slider/Slider.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import Slider, { sliderClasses as classes } from '@mui/joy/Slider';
 import { ThemeProvider } from '@mui/joy/styles';
 
diff --git a/packages/mui-joy/src/Stack/Stack.test.tsx b/packages/mui-joy/src/Stack/Stack.test.tsx
index 44dd7ecead741c..bf4552bd2abe00 100644
--- a/packages/mui-joy/src/Stack/Stack.test.tsx
+++ b/packages/mui-joy/src/Stack/Stack.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Stack, { stackClasses as classes } from '@mui/joy/Stack';
 
diff --git a/packages/mui-joy/src/SvgIcon/SvgIcon.test.tsx b/packages/mui-joy/src/SvgIcon/SvgIcon.test.tsx
index a24cf0f87cfe4c..47f169e59abf0f 100644
--- a/packages/mui-joy/src/SvgIcon/SvgIcon.test.tsx
+++ b/packages/mui-joy/src/SvgIcon/SvgIcon.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import SvgIcon, {
   svgIconClasses as classes,
diff --git a/packages/mui-joy/src/Switch/Switch.test.tsx b/packages/mui-joy/src/Switch/Switch.test.tsx
index ea44532064c45a..014c0baf54c62c 100644
--- a/packages/mui-joy/src/Switch/Switch.test.tsx
+++ b/packages/mui-joy/src/Switch/Switch.test.tsx
@@ -7,7 +7,7 @@ import {
   createRenderer,
   fireEvent,
   screen,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import Switch, { switchClasses as classes } from '@mui/joy/Switch';
 import { ThemeProvider } from '@mui/joy/styles';
 
diff --git a/packages/mui-joy/src/Tab/Tab.test.tsx b/packages/mui-joy/src/Tab/Tab.test.tsx
index a7ddb7a211d651..538a9845f194f7 100644
--- a/packages/mui-joy/src/Tab/Tab.test.tsx
+++ b/packages/mui-joy/src/Tab/Tab.test.tsx
@@ -1,6 +1,11 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, screen, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  screen,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { TabsProps } from '@mui/base/Tabs';
 import { useTabs, TabsProvider as BaseTabsProvider } from '@mui/base/useTabs';
 import { useTabsList, TabsListProvider as BaseTabsListProvider } from '@mui/base/useTabsList';
diff --git a/packages/mui-joy/src/TabList/TabList.test.tsx b/packages/mui-joy/src/TabList/TabList.test.tsx
index e470696b27412c..5dbd76080dcacd 100644
--- a/packages/mui-joy/src/TabList/TabList.test.tsx
+++ b/packages/mui-joy/src/TabList/TabList.test.tsx
@@ -1,6 +1,11 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, screen, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  screen,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { TabsProps } from '@mui/base/Tabs';
 import { useTabs, TabsProvider as BaseTabsProvider } from '@mui/base/useTabs';
 import { ThemeProvider } from '@mui/joy/styles';
diff --git a/packages/mui-joy/src/TabPanel/TabPanel.test.tsx b/packages/mui-joy/src/TabPanel/TabPanel.test.tsx
index 5b92545f915479..cab2e72d8dd44b 100644
--- a/packages/mui-joy/src/TabPanel/TabPanel.test.tsx
+++ b/packages/mui-joy/src/TabPanel/TabPanel.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, screen } from 'test/utils';
+import { describeConformance, createRenderer, screen } from '@mui-internal/test-utils';
 import { TabsProps } from '@mui/base/Tabs';
 import { useTabs, TabsProvider as BaseTabsProvider } from '@mui/base/useTabs';
 import { ThemeProvider } from '@mui/joy/styles';
diff --git a/packages/mui-joy/src/Table/Table.test.tsx b/packages/mui-joy/src/Table/Table.test.tsx
index 13c88b34a59962..843f73cf9bdf7b 100644
--- a/packages/mui-joy/src/Table/Table.test.tsx
+++ b/packages/mui-joy/src/Table/Table.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Table, { tableClasses as classes } from '@mui/joy/Table';
diff --git a/packages/mui-joy/src/Tabs/Tabs.test.tsx b/packages/mui-joy/src/Tabs/Tabs.test.tsx
index 3d470173bfb424..56052e1b00d5bd 100644
--- a/packages/mui-joy/src/Tabs/Tabs.test.tsx
+++ b/packages/mui-joy/src/Tabs/Tabs.test.tsx
@@ -1,6 +1,11 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, screen, describeJoyColorInversion } from 'test/utils';
+import {
+  describeConformance,
+  createRenderer,
+  screen,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import Tabs, { tabsClasses as classes } from '@mui/joy/Tabs';
 import SizeTabsContext from './SizeTabsContext';
diff --git a/packages/mui-joy/src/Textarea/Textarea.test.tsx b/packages/mui-joy/src/Textarea/Textarea.test.tsx
index dfe176c48421b9..9df58d9be64752 100644
--- a/packages/mui-joy/src/Textarea/Textarea.test.tsx
+++ b/packages/mui-joy/src/Textarea/Textarea.test.tsx
@@ -8,7 +8,7 @@ import {
   screen,
   act,
   fireEvent,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import Textarea, { textareaClasses as classes } from '@mui/joy/Textarea';
 import { ThemeProvider } from '@mui/joy/styles';
 
diff --git a/packages/mui-joy/src/ToggleButtonGroup/ToggleButtonGroup.test.tsx b/packages/mui-joy/src/ToggleButtonGroup/ToggleButtonGroup.test.tsx
index 40a27fe0703948..9ab59c31f052eb 100644
--- a/packages/mui-joy/src/ToggleButtonGroup/ToggleButtonGroup.test.tsx
+++ b/packages/mui-joy/src/ToggleButtonGroup/ToggleButtonGroup.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, describeConformance, screen } from 'test/utils';
+import { createRenderer, describeConformance, screen } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/joy/styles';
 import ToggleButtonGroup, { toggleButtonGroupClasses as classes } from '@mui/joy/ToggleButtonGroup';
 import Button from '@mui/joy/Button';
diff --git a/packages/mui-joy/src/Tooltip/Tooltip.test.tsx b/packages/mui-joy/src/Tooltip/Tooltip.test.tsx
index fedcb3f3232120..92daed9f4dda4f 100644
--- a/packages/mui-joy/src/Tooltip/Tooltip.test.tsx
+++ b/packages/mui-joy/src/Tooltip/Tooltip.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { PopperProps } from '@mui/base';
 import { ThemeProvider } from '@mui/joy/styles';
diff --git a/packages/mui-joy/src/Typography/Typography.test.tsx b/packages/mui-joy/src/Typography/Typography.test.tsx
index a3432137248a05..b372586094dfe6 100644
--- a/packages/mui-joy/src/Typography/Typography.test.tsx
+++ b/packages/mui-joy/src/Typography/Typography.test.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, describeJoyColorInversion } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  describeJoyColorInversion,
+} from '@mui-internal/test-utils';
 import Typography, { typographyClasses as classes, TypographyProps } from '@mui/joy/Typography';
 import { ThemeProvider } from '@mui/joy/styles';
 
diff --git a/packages/mui-joy/src/styles/ColorInversion.test.js b/packages/mui-joy/src/styles/ColorInversion.test.js
index 6da281dde59606..7b1a4af927157b 100644
--- a/packages/mui-joy/src/styles/ColorInversion.test.js
+++ b/packages/mui-joy/src/styles/ColorInversion.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import sinon from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import useThemeProps from './useThemeProps';
 import ThemeProvider from './ThemeProvider';
 import ColorInversion, { useColorInversion } from './ColorInversion';
diff --git a/packages/mui-joy/src/styles/CssVarsProvider.test.tsx b/packages/mui-joy/src/styles/CssVarsProvider.test.tsx
index 038856181aa8fd..7d139fda1b3ec7 100644
--- a/packages/mui-joy/src/styles/CssVarsProvider.test.tsx
+++ b/packages/mui-joy/src/styles/CssVarsProvider.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import { CssVarsProvider, extendTheme, useTheme, shouldSkipGeneratingVar } from '@mui/joy/styles';
 
 describe('[Joy] CssVarsProvider', () => {
diff --git a/packages/mui-joy/src/styles/ThemeProvider.test.tsx b/packages/mui-joy/src/styles/ThemeProvider.test.tsx
index ea4eabf0b0abdd..584192f0748373 100644
--- a/packages/mui-joy/src/styles/ThemeProvider.test.tsx
+++ b/packages/mui-joy/src/styles/ThemeProvider.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider, useTheme } from '@mui/joy/styles';
 import defaultTheme from './defaultTheme';
 
diff --git a/packages/mui-joy/src/styles/extendTheme.test.js b/packages/mui-joy/src/styles/extendTheme.test.js
index 93d26913c93f62..88a47614004503 100644
--- a/packages/mui-joy/src/styles/extendTheme.test.js
+++ b/packages/mui-joy/src/styles/extendTheme.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { extendTheme, useTheme, CssVarsProvider } from '@mui/joy/styles';
 
 describe('extendTheme', () => {
diff --git a/packages/mui-joy/src/styles/styled.test.tsx b/packages/mui-joy/src/styles/styled.test.tsx
index 8ce677f6efd539..7a555ddaababef 100644
--- a/packages/mui-joy/src/styles/styled.test.tsx
+++ b/packages/mui-joy/src/styles/styled.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { CssVarsProvider, ThemeProvider, styled, extendTheme } from '@mui/joy/styles';
 import defaultTheme from './defaultTheme';
 
diff --git a/packages/mui-joy/src/styles/variantColorInheritance.test.tsx b/packages/mui-joy/src/styles/variantColorInheritance.test.tsx
index e6271640e026a7..d6f967869565ee 100644
--- a/packages/mui-joy/src/styles/variantColorInheritance.test.tsx
+++ b/packages/mui-joy/src/styles/variantColorInheritance.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { VariantColorProvider, useVariantColor } from './variantColorInheritance';
 
 describe('VariantColorProvider', () => {
diff --git a/packages/mui-joy/src/utils/useSlot.test.tsx b/packages/mui-joy/src/utils/useSlot.test.tsx
index 3bac136dc2ed64..0684216f95ac35 100644
--- a/packages/mui-joy/src/utils/useSlot.test.tsx
+++ b/packages/mui-joy/src/utils/useSlot.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { Popper } from '@mui/base/Popper';
 import { ColorPaletteProp, styled, VariantProp } from '../styles';
 import { CreateSlotsAndSlotProps, SlotProps } from './types';
diff --git a/packages/mui-joy/test/integration/TabsIntegration.test.tsx b/packages/mui-joy/test/integration/TabsIntegration.test.tsx
index b99a03e927a7a6..6a27f964e0cbb0 100644
--- a/packages/mui-joy/test/integration/TabsIntegration.test.tsx
+++ b/packages/mui-joy/test/integration/TabsIntegration.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import Tabs from '@mui/joy/Tabs';
 import TabList from '@mui/joy/TabList';
 import Tab from '@mui/joy/Tab';
diff --git a/packages/mui-lab/package.json b/packages/mui-lab/package.json
index b1e6cfc7f20366..2a5bc0b929513c 100644
--- a/packages/mui-lab/package.json
+++ b/packages/mui-lab/package.json
@@ -51,6 +51,7 @@
     "prop-types": "^15.8.1"
   },
   "devDependencies": {
+    "@mui-internal/test-utils": "^1.0.0",
     "@types/chai": "^4.3.6",
     "@types/prop-types": "^15.7.5",
     "@types/react": "^18.2.21",
@@ -59,8 +60,7 @@
     "chai": "^4.3.8",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "sinon": "^15.2.0",
-    "test": "^5.0.0"
+    "sinon": "^15.2.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",
diff --git a/packages/mui-lab/src/LoadingButton/LoadingButton.test.js b/packages/mui-lab/src/LoadingButton/LoadingButton.test.js
index 6de4f929436a77..ceea7217e298c8 100644
--- a/packages/mui-lab/src/LoadingButton/LoadingButton.test.js
+++ b/packages/mui-lab/src/LoadingButton/LoadingButton.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance, screen, within } from 'test/utils';
+import { createRenderer, describeConformance, screen, within } from '@mui-internal/test-utils';
 import { expect } from 'chai';
 import Button from '@mui/material/Button';
 import LoadingButton, { loadingButtonClasses as classes } from '@mui/lab/LoadingButton';
diff --git a/packages/mui-lab/src/Masonry/Masonry.test.js b/packages/mui-lab/src/Masonry/Masonry.test.js
index f09a0c69b0ae27..7320e3aaaf49df 100644
--- a/packages/mui-lab/src/Masonry/Masonry.test.js
+++ b/packages/mui-lab/src/Masonry/Masonry.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { expect } from 'chai';
 import { createTheme } from '@mui/material/styles';
 import defaultTheme from '@mui/material/styles/defaultTheme';
diff --git a/packages/mui-lab/src/TabContext/TabContext.test.js b/packages/mui-lab/src/TabContext/TabContext.test.js
index 802c39e44b1f32..657bae9e853620 100644
--- a/packages/mui-lab/src/TabContext/TabContext.test.js
+++ b/packages/mui-lab/src/TabContext/TabContext.test.js
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import * as ReactDOMServer from 'react-dom/server';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import TabContext, { getPanelId, getTabId, useTabContext } from './TabContext';
 
 describe('<TabContext />', () => {
diff --git a/packages/mui-lab/src/TabList/TabList.test.js b/packages/mui-lab/src/TabList/TabList.test.js
index 8a99d65603c5b1..6419a4cb31c9f6 100644
--- a/packages/mui-lab/src/TabList/TabList.test.js
+++ b/packages/mui-lab/src/TabList/TabList.test.js
@@ -1,7 +1,7 @@
 // @ts-check
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Tab from '@mui/material/Tab';
 import Tabs, { tabsClasses as classes } from '@mui/material/Tabs';
 import TabList from './TabList';
diff --git a/packages/mui-lab/src/TabPanel/TabPanel.test.tsx b/packages/mui-lab/src/TabPanel/TabPanel.test.tsx
index 47908a1d1cd14b..00db045f2b2a60 100644
--- a/packages/mui-lab/src/TabPanel/TabPanel.test.tsx
+++ b/packages/mui-lab/src/TabPanel/TabPanel.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TabPanel, { tabPanelClasses as classes } from '@mui/lab/TabPanel';
 import TabContext from '../TabContext';
 
diff --git a/packages/mui-lab/src/Timeline/Timeline.test.tsx b/packages/mui-lab/src/Timeline/Timeline.test.tsx
index 1c0aab5da7d025..bdec9ccdfdd988 100644
--- a/packages/mui-lab/src/Timeline/Timeline.test.tsx
+++ b/packages/mui-lab/src/Timeline/Timeline.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, screen } from 'test/utils';
+import { createRenderer, describeConformance, screen } from '@mui-internal/test-utils';
 import Timeline, { timelineClasses as classes } from '@mui/lab/Timeline';
 
 describe('<Timeline />', () => {
diff --git a/packages/mui-lab/src/TimelineConnector/TimelineConnector.test.js b/packages/mui-lab/src/TimelineConnector/TimelineConnector.test.js
index d6e9bf06b43172..48bb30ebca0a27 100644
--- a/packages/mui-lab/src/TimelineConnector/TimelineConnector.test.js
+++ b/packages/mui-lab/src/TimelineConnector/TimelineConnector.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TimelineConnector, { timelineConnectorClasses as classes } from '@mui/lab/TimelineConnector';
 
 describe('<TimelineConnector />', () => {
diff --git a/packages/mui-lab/src/TimelineContent/TimelineContent.test.js b/packages/mui-lab/src/TimelineContent/TimelineContent.test.js
index 7af431ccf15dcf..bae2b2dd90e6c4 100644
--- a/packages/mui-lab/src/TimelineContent/TimelineContent.test.js
+++ b/packages/mui-lab/src/TimelineContent/TimelineContent.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Typography from '@mui/material/Typography';
 import Timeline from '@mui/lab/Timeline';
 import TimelineItem from '@mui/lab/TimelineItem';
diff --git a/packages/mui-lab/src/TimelineDot/TimelineDot.test.js b/packages/mui-lab/src/TimelineDot/TimelineDot.test.js
index 2e301df522812e..8a6619363b972a 100644
--- a/packages/mui-lab/src/TimelineDot/TimelineDot.test.js
+++ b/packages/mui-lab/src/TimelineDot/TimelineDot.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TimelineDot, { timelineDotClasses as classes } from '@mui/lab/TimelineDot';
 
 describe('<TimelineDot />', () => {
diff --git a/packages/mui-lab/src/TimelineItem/TimelineItem.test.js b/packages/mui-lab/src/TimelineItem/TimelineItem.test.js
index 961d96a7e285a0..532af2a2fac603 100644
--- a/packages/mui-lab/src/TimelineItem/TimelineItem.test.js
+++ b/packages/mui-lab/src/TimelineItem/TimelineItem.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TimelineItem, { timelineItemClasses as classes } from '@mui/lab/TimelineItem';
 
 describe('<TimelineItem />', () => {
diff --git a/packages/mui-lab/src/TimelineOppositeContent/TimelineOppositeContent.test.js b/packages/mui-lab/src/TimelineOppositeContent/TimelineOppositeContent.test.js
index d32183fdd18e0e..0b3087893f291e 100644
--- a/packages/mui-lab/src/TimelineOppositeContent/TimelineOppositeContent.test.js
+++ b/packages/mui-lab/src/TimelineOppositeContent/TimelineOppositeContent.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Typography from '@mui/material/Typography';
 import Timeline from '@mui/lab/Timeline';
 import TimelineItem from '@mui/lab/TimelineItem';
diff --git a/packages/mui-lab/src/TimelineSeparator/TimelineSeparator.test.js b/packages/mui-lab/src/TimelineSeparator/TimelineSeparator.test.js
index 22d69543ab8872..e2c9f61aa7d109 100644
--- a/packages/mui-lab/src/TimelineSeparator/TimelineSeparator.test.js
+++ b/packages/mui-lab/src/TimelineSeparator/TimelineSeparator.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TimelineSeparator, { timelineSeparatorClasses as classes } from '@mui/lab/TimelineSeparator';
 
 describe('<TimelineSeparator />', () => {
diff --git a/packages/mui-lab/test/integration/Tabs.test.js b/packages/mui-lab/test/integration/Tabs.test.js
index 14537af5e135c3..4106b9f10a8e22 100644
--- a/packages/mui-lab/test/integration/Tabs.test.js
+++ b/packages/mui-lab/test/integration/Tabs.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import Tab from '@mui/material/Tab';
 import TabContext from '@mui/lab/TabContext';
 import TabList from '@mui/lab/TabList';
diff --git a/packages/mui-material-next/package.json b/packages/mui-material-next/package.json
index 462ac7d3bf6399..d23ba729f2d107 100644
--- a/packages/mui-material-next/package.json
+++ b/packages/mui-material-next/package.json
@@ -52,6 +52,7 @@
     "react-transition-group": "^4.4.5"
   },
   "devDependencies": {
+    "@mui-internal/test-utils": "^1.0.0",
     "@testing-library/user-event": "^14.4.3",
     "@types/chai": "^4.3.6",
     "@types/prop-types": "^15.7.5",
@@ -63,8 +64,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.15.0",
-    "sinon": "^15.2.0",
-    "test": "^5.0.0"
+    "sinon": "^15.2.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",
diff --git a/packages/mui-material-next/src/Badge/Badge.test.tsx b/packages/mui-material-next/src/Badge/Badge.test.tsx
index 0af87fc8dc9463..22d881a4e1a0a7 100644
--- a/packages/mui-material-next/src/Badge/Badge.test.tsx
+++ b/packages/mui-material-next/src/Badge/Badge.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Badge, { badgeClasses as classes } from '@mui/material-next/Badge';
 import { CssVarsProvider, extendTheme } from '@mui/material-next/styles';
 
diff --git a/packages/mui-material-next/src/Button/Button.test.js b/packages/mui-material-next/src/Button/Button.test.js
index 79e5a0017b72f4..7edd62846b1603 100644
--- a/packages/mui-material-next/src/Button/Button.test.js
+++ b/packages/mui-material-next/src/Button/Button.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, createRenderer, fireEvent, act } from 'test/utils';
+import { describeConformance, createRenderer, fireEvent, act } from '@mui-internal/test-utils';
 import { camelCase } from 'lodash';
 import Button, { buttonClasses as classes } from '@mui/material-next/Button';
 import { CssVarsProvider, extendTheme } from '@mui/material-next/styles';
diff --git a/packages/mui-material-next/src/ButtonBase/ButtonBase.test.tsx b/packages/mui-material-next/src/ButtonBase/ButtonBase.test.tsx
index ab5d5da6070aba..a5ae1e5528469c 100644
--- a/packages/mui-material-next/src/ButtonBase/ButtonBase.test.tsx
+++ b/packages/mui-material-next/src/ButtonBase/ButtonBase.test.tsx
@@ -12,7 +12,7 @@ import {
   focusVisible,
   simulatePointerDevice,
   programmaticFocusTriggersFocusVisible,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import PropTypes from 'prop-types';
 import { MuiCancellableEventHandler } from '@mui/base/utils/MuiCancellableEvent';
 import { CssVarsProvider, extendTheme } from '@mui/material-next/styles';
diff --git a/packages/mui-material-next/src/ButtonBase/Ripple.test.js b/packages/mui-material-next/src/ButtonBase/Ripple.test.js
index 6993128652e400..fa583ab6a62244 100644
--- a/packages/mui-material-next/src/ButtonBase/Ripple.test.js
+++ b/packages/mui-material-next/src/ButtonBase/Ripple.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import Ripple from './Ripple';
 import classes from './touchRippleClasses';
 
diff --git a/packages/mui-material-next/src/ButtonBase/TouchRipple.test.js b/packages/mui-material-next/src/ButtonBase/TouchRipple.test.js
index c2aedceff0a208..a056cea0f10d60 100644
--- a/packages/mui-material-next/src/ButtonBase/TouchRipple.test.js
+++ b/packages/mui-material-next/src/ButtonBase/TouchRipple.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, act, createRenderer } from 'test/utils';
+import { describeConformance, act, createRenderer } from '@mui-internal/test-utils';
 import TouchRipple, { DELAY_RIPPLE } from './TouchRipple';
 
 const cb = () => {};
diff --git a/packages/mui-material-next/src/Chip/Chip.test.tsx b/packages/mui-material-next/src/Chip/Chip.test.tsx
index c702e4197fe620..5656832e68678d 100644
--- a/packages/mui-material-next/src/Chip/Chip.test.tsx
+++ b/packages/mui-material-next/src/Chip/Chip.test.tsx
@@ -10,7 +10,7 @@ import {
   focusVisible,
   simulatePointerDevice,
   programmaticFocusTriggersFocusVisible,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { hexToRgb } from '@mui/system';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { createTheme } from '@mui/material/styles';
diff --git a/packages/mui-material-next/src/FormControl/FormControl.test.js b/packages/mui-material-next/src/FormControl/FormControl.test.js
index 4ad1deed7f5295..0027766b0f3a8e 100644
--- a/packages/mui-material-next/src/FormControl/FormControl.test.js
+++ b/packages/mui-material-next/src/FormControl/FormControl.test.js
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer } from 'test/utils';
+import { describeConformance, act, createRenderer } from '@mui-internal/test-utils';
 import FormControl, { formControlClasses as classes } from '@mui/material-next/FormControl';
 // TODO: replace with material-next/OutlinedInput
 import InputBase from '@mui/material-next/InputBase';
diff --git a/packages/mui-material-next/src/Input/Input.test.js b/packages/mui-material-next/src/Input/Input.test.js
index 57cc9e4a9097fb..1882b3e36d6024 100644
--- a/packages/mui-material-next/src/Input/Input.test.js
+++ b/packages/mui-material-next/src/Input/Input.test.js
@@ -2,7 +2,13 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import Input, { inputClasses as classes } from '@mui/material-next/Input';
 
 describe('<Input />', () => {
diff --git a/packages/mui-material-next/src/InputBase/InputBase.test.js b/packages/mui-material-next/src/InputBase/InputBase.test.js
index a45e864d9e5917..3774b529c76751 100644
--- a/packages/mui-material-next/src/InputBase/InputBase.test.js
+++ b/packages/mui-material-next/src/InputBase/InputBase.test.js
@@ -3,7 +3,13 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@emotion/react';
 import FormControl, { useFormControl } from '@mui/material/FormControl';
 import InputAdornment from '@mui/material/InputAdornment';
diff --git a/packages/mui-material-next/src/Slider/Slider.test.js b/packages/mui-material-next/src/Slider/Slider.test.js
index 2dd6de50c8a409..da7dc8d96917b4 100644
--- a/packages/mui-material-next/src/Slider/Slider.test.js
+++ b/packages/mui-material-next/src/Slider/Slider.test.js
@@ -2,7 +2,13 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { spy, stub } from 'sinon';
 import { expect } from 'chai';
-import { describeConformance, act, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import { Slider as BaseSlider } from '@mui/base/Slider';
 import { CssVarsProvider, extendTheme } from '@mui/material-next/styles';
 import Slider, { sliderClasses as classes } from '@mui/material-next/Slider';
diff --git a/packages/mui-material-next/src/Tab/Tab.test.js b/packages/mui-material-next/src/Tab/Tab.test.js
index 9aada780240f64..ac5fdb6e89c8e9 100644
--- a/packages/mui-material-next/src/Tab/Tab.test.js
+++ b/packages/mui-material-next/src/Tab/Tab.test.js
@@ -3,7 +3,7 @@ import Tab, { tabClasses as classes } from '@mui/material/Tab';
 import { expect } from 'chai';
 import * as React from 'react';
 import { spy } from 'sinon';
-import { act, createRenderer, describeConformance, fireEvent } from 'test/utils';
+import { act, createRenderer, describeConformance, fireEvent } from '@mui-internal/test-utils';
 
 describe('<Tab />', () => {
   const { render } = createRenderer();
diff --git a/packages/mui-material-next/src/TabScrollButton/TabScrollButton.test.js b/packages/mui-material-next/src/TabScrollButton/TabScrollButton.test.js
index 4b4834d442141e..ee5440fc203fd8 100644
--- a/packages/mui-material-next/src/TabScrollButton/TabScrollButton.test.js
+++ b/packages/mui-material-next/src/TabScrollButton/TabScrollButton.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TabScrollButton, {
   tabScrollButtonClasses as classes,
 } from '@mui/material-next/TabScrollButton';
diff --git a/packages/mui-material-next/src/TablePagination/TablePagination.test.js b/packages/mui-material-next/src/TablePagination/TablePagination.test.js
index e3052bb9bbe3ab..aaf143d62a87b5 100644
--- a/packages/mui-material-next/src/TablePagination/TablePagination.test.js
+++ b/packages/mui-material-next/src/TablePagination/TablePagination.test.js
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import PropTypes from 'prop-types';
-import { describeConformance, fireEvent, createRenderer } from 'test/utils';
+import { describeConformance, fireEvent, createRenderer } from '@mui-internal/test-utils';
 import TableFooter from '@mui/material/TableFooter';
 import TableCell from '@mui/material/TableCell';
 import TableRow from '@mui/material/TableRow';
diff --git a/packages/mui-material-next/src/Tabs/ScrollbarSize.test.js b/packages/mui-material-next/src/Tabs/ScrollbarSize.test.js
index 261a636223a50b..eb6e6899303525 100644
--- a/packages/mui-material-next/src/Tabs/ScrollbarSize.test.js
+++ b/packages/mui-material-next/src/Tabs/ScrollbarSize.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy, stub } from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import ScrollbarSize from './ScrollbarSize';
 
 describe('<ScrollbarSize />', () => {
diff --git a/packages/mui-material-next/src/Tabs/Tabs.test.js b/packages/mui-material-next/src/Tabs/Tabs.test.js
index cc68b2830a8fe8..085af0c5d1e9af 100644
--- a/packages/mui-material-next/src/Tabs/Tabs.test.js
+++ b/packages/mui-material-next/src/Tabs/Tabs.test.js
@@ -8,7 +8,7 @@ import {
   fireEvent,
   screen,
   strictModeDoubleLoggingSuppressed,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import Tab from '@mui/material-next/Tab';
diff --git a/packages/mui-material-next/src/styles/styled.test.js b/packages/mui-material-next/src/styles/styled.test.js
index 28d4a0ef06dae6..720850622207fe 100644
--- a/packages/mui-material-next/src/styles/styled.test.js
+++ b/packages/mui-material-next/src/styles/styled.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import { styled } from '@mui/material-next/styles';
 
 describe('styled', () => {
diff --git a/packages/mui-material/package.json b/packages/mui-material/package.json
index 47b0ff68ea034e..381860fc3a8aed 100644
--- a/packages/mui-material/package.json
+++ b/packages/mui-material/package.json
@@ -59,6 +59,7 @@
     "@mui/icons-material": "^5.14.9",
     "@mui/lab": "^5.0.0-alpha.145",
     "@mui/styles": "^5.14.10",
+    "@mui-internal/test-utils": "^1.0.0",
     "@popperjs/core": "^2.11.8",
     "@rollup/plugin-replace": "^5.0.2",
     "@testing-library/dom": "^9.3.1",
@@ -84,8 +85,7 @@
     "rollup-plugin-node-globals": "^1.4.0",
     "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-terser": "^7.0.2",
-    "sinon": "^15.2.0",
-    "test": "^5.0.0"
+    "sinon": "^15.2.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",
diff --git a/packages/mui-material/src/Accordion/Accordion.test.js b/packages/mui-material/src/Accordion/Accordion.test.js
index ac7b9507bedd24..60d596a0abf0e2 100644
--- a/packages/mui-material/src/Accordion/Accordion.test.js
+++ b/packages/mui-material/src/Accordion/Accordion.test.js
@@ -2,7 +2,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, createRenderer, fireEvent } from 'test/utils';
+import { describeConformance, createRenderer, fireEvent } from '@mui-internal/test-utils';
 import Accordion, { accordionClasses as classes } from '@mui/material/Accordion';
 import Paper from '@mui/material/Paper';
 import AccordionSummary from '@mui/material/AccordionSummary';
diff --git a/packages/mui-material/src/AccordionActions/AccordionActions.test.js b/packages/mui-material/src/AccordionActions/AccordionActions.test.js
index 03ab384751d557..82f6abbc674d5d 100644
--- a/packages/mui-material/src/AccordionActions/AccordionActions.test.js
+++ b/packages/mui-material/src/AccordionActions/AccordionActions.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import AccordionActions, {
   accordionActionsClasses as classes,
 } from '@mui/material/AccordionActions';
diff --git a/packages/mui-material/src/AccordionDetails/AccordionDetails.test.js b/packages/mui-material/src/AccordionDetails/AccordionDetails.test.js
index 08d38664921cbd..ced854a3fbbbcb 100644
--- a/packages/mui-material/src/AccordionDetails/AccordionDetails.test.js
+++ b/packages/mui-material/src/AccordionDetails/AccordionDetails.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import AccordionDetails, {
   accordionDetailsClasses as classes,
 } from '@mui/material/AccordionDetails';
diff --git a/packages/mui-material/src/AccordionSummary/AccordionSummary.test.js b/packages/mui-material/src/AccordionSummary/AccordionSummary.test.js
index 10f24117c82498..8db043bb46dada 100644
--- a/packages/mui-material/src/AccordionSummary/AccordionSummary.test.js
+++ b/packages/mui-material/src/AccordionSummary/AccordionSummary.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer, fireEvent } from 'test/utils';
+import { describeConformance, act, createRenderer, fireEvent } from '@mui-internal/test-utils';
 import AccordionSummary, {
   accordionSummaryClasses as classes,
 } from '@mui/material/AccordionSummary';
diff --git a/packages/mui-material/src/Alert/Alert.test.js b/packages/mui-material/src/Alert/Alert.test.js
index 430d6880d42a0d..8914928c7ff6b4 100644
--- a/packages/mui-material/src/Alert/Alert.test.js
+++ b/packages/mui-material/src/Alert/Alert.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, screen } from 'test/utils';
+import { createRenderer, describeConformance, screen } from '@mui-internal/test-utils';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import Alert, { alertClasses as classes } from '@mui/material/Alert';
 import Paper, { paperClasses } from '@mui/material/Paper';
diff --git a/packages/mui-material/src/AlertTitle/AlertTitle.test.js b/packages/mui-material/src/AlertTitle/AlertTitle.test.js
index 642af29b0ee89e..986029a69be08e 100644
--- a/packages/mui-material/src/AlertTitle/AlertTitle.test.js
+++ b/packages/mui-material/src/AlertTitle/AlertTitle.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import AlertTitle, { alertTitleClasses as classes } from '@mui/material/AlertTitle';
 import Typography from '@mui/material/Typography';
 
diff --git a/packages/mui-material/src/AppBar/AppBar.test.js b/packages/mui-material/src/AppBar/AppBar.test.js
index 066f137f40c5c3..33f2c038013a45 100644
--- a/packages/mui-material/src/AppBar/AppBar.test.js
+++ b/packages/mui-material/src/AppBar/AppBar.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, screen } from 'test/utils';
+import { createRenderer, describeConformance, screen } from '@mui-internal/test-utils';
 import AppBar, { appBarClasses as classes } from '@mui/material/AppBar';
 import Paper from '@mui/material/Paper';
 
diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.test.js b/packages/mui-material/src/Autocomplete/Autocomplete.test.js
index c8705e8f340829..c2a42e332e7cf3 100644
--- a/packages/mui-material/src/Autocomplete/Autocomplete.test.js
+++ b/packages/mui-material/src/Autocomplete/Autocomplete.test.js
@@ -8,7 +8,7 @@ import {
   fireEvent,
   screen,
   strictModeDoubleLoggingSuppressed,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { spy } from 'sinon';
 import userEvent from '@testing-library/user-event';
 import Box from '@mui/system/Box';
diff --git a/packages/mui-material/src/Avatar/Avatar.test.js b/packages/mui-material/src/Avatar/Avatar.test.js
index 0d5ef55142e152..3ece7858bb378c 100644
--- a/packages/mui-material/src/Avatar/Avatar.test.js
+++ b/packages/mui-material/src/Avatar/Avatar.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, fireEvent, describeConformance } from 'test/utils';
+import { createRenderer, fireEvent, describeConformance } from '@mui-internal/test-utils';
 import { spy } from 'sinon';
 import Avatar, { avatarClasses as classes } from '@mui/material/Avatar';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
diff --git a/packages/mui-material/src/AvatarGroup/AvatarGroup.test.js b/packages/mui-material/src/AvatarGroup/AvatarGroup.test.js
index 632a2b182c3418..26764b881281b3 100644
--- a/packages/mui-material/src/AvatarGroup/AvatarGroup.test.js
+++ b/packages/mui-material/src/AvatarGroup/AvatarGroup.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import Avatar from '@mui/material/Avatar';
 import AvatarGroup, { avatarGroupClasses as classes } from '@mui/material/AvatarGroup';
 
diff --git a/packages/mui-material/src/Backdrop/Backdrop.test.js b/packages/mui-material/src/Backdrop/Backdrop.test.js
index 6433b5712a7235..13a8f92f3f01d8 100644
--- a/packages/mui-material/src/Backdrop/Backdrop.test.js
+++ b/packages/mui-material/src/Backdrop/Backdrop.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Backdrop, { backdropClasses as classes } from '@mui/material/Backdrop';
 import Fade from '@mui/material/Fade';
 
diff --git a/packages/mui-material/src/Badge/Badge.test.js b/packages/mui-material/src/Badge/Badge.test.js
index 2206c1a8661a38..b76c788a843bf4 100644
--- a/packages/mui-material/src/Badge/Badge.test.js
+++ b/packages/mui-material/src/Badge/Badge.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Badge, { badgeClasses as classes } from '@mui/material/Badge';
 
 function findBadgeRoot(container) {
diff --git a/packages/mui-material/src/BottomNavigation/BottomNavigation.test.js b/packages/mui-material/src/BottomNavigation/BottomNavigation.test.js
index b92cd86fab4cde..66fa1028947f76 100755
--- a/packages/mui-material/src/BottomNavigation/BottomNavigation.test.js
+++ b/packages/mui-material/src/BottomNavigation/BottomNavigation.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, createRenderer, fireEvent } from 'test/utils';
+import { describeConformance, createRenderer, fireEvent } from '@mui-internal/test-utils';
 import BottomNavigation, {
   bottomNavigationClasses as classes,
 } from '@mui/material/BottomNavigation';
diff --git a/packages/mui-material/src/BottomNavigationAction/BottomNavigationAction.test.js b/packages/mui-material/src/BottomNavigationAction/BottomNavigationAction.test.js
index 70ecd2b506c3e6..57604a6232b138 100644
--- a/packages/mui-material/src/BottomNavigationAction/BottomNavigationAction.test.js
+++ b/packages/mui-material/src/BottomNavigationAction/BottomNavigationAction.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, createRenderer, within } from 'test/utils';
+import { describeConformance, createRenderer, within } from '@mui-internal/test-utils';
 import BottomNavigationAction, {
   bottomNavigationActionClasses as classes,
 } from '@mui/material/BottomNavigationAction';
diff --git a/packages/mui-material/src/Box/Box.test.js b/packages/mui-material/src/Box/Box.test.js
index aef94b0454fef9..b25089a467b311 100644
--- a/packages/mui-material/src/Box/Box.test.js
+++ b/packages/mui-material/src/Box/Box.test.js
@@ -1,7 +1,7 @@
 /* eslint-disable material-ui/no-empty-box */
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import Box from '@mui/material/Box';
 import { unstable_ClassNameGenerator as ClassNameGenerator } from '@mui/material/className';
diff --git a/packages/mui-material/src/Breadcrumbs/BreadcrumbCollapsed.test.js b/packages/mui-material/src/Breadcrumbs/BreadcrumbCollapsed.test.js
index 141b323a513aa5..a5d1542fe008b2 100644
--- a/packages/mui-material/src/Breadcrumbs/BreadcrumbCollapsed.test.js
+++ b/packages/mui-material/src/Breadcrumbs/BreadcrumbCollapsed.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { fireEvent, createRenderer } from 'test/utils';
+import { fireEvent, createRenderer } from '@mui-internal/test-utils';
 import BreadcrumbCollapsed from './BreadcrumbCollapsed';
 
 describe('<BreadcrumbCollapsed />', () => {
diff --git a/packages/mui-material/src/Breadcrumbs/Breadcrumbs.test.js b/packages/mui-material/src/Breadcrumbs/Breadcrumbs.test.js
index 912c95172ec178..468fbf4a608224 100644
--- a/packages/mui-material/src/Breadcrumbs/Breadcrumbs.test.js
+++ b/packages/mui-material/src/Breadcrumbs/Breadcrumbs.test.js
@@ -6,7 +6,7 @@ import {
   createRenderer,
   screen,
   strictModeDoubleLoggingSuppressed,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import Breadcrumbs, { breadcrumbsClasses as classes } from '@mui/material/Breadcrumbs';
 import Typography from '@mui/material/Typography';
 import FirstPageIcon from '../internal/svg-icons/FirstPage';
diff --git a/packages/mui-material/src/Button/Button.test.js b/packages/mui-material/src/Button/Button.test.js
index a531e303a12243..76381c29cec6f8 100644
--- a/packages/mui-material/src/Button/Button.test.js
+++ b/packages/mui-material/src/Button/Button.test.js
@@ -1,6 +1,12 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, act, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import { ClassNames } from '@emotion/react';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import Button, { buttonClasses as classes } from '@mui/material/Button';
diff --git a/packages/mui-material/src/ButtonBase/ButtonBase.test.js b/packages/mui-material/src/ButtonBase/ButtonBase.test.js
index 079846a3ea0d78..27d5b00c226cd1 100644
--- a/packages/mui-material/src/ButtonBase/ButtonBase.test.js
+++ b/packages/mui-material/src/ButtonBase/ButtonBase.test.js
@@ -11,7 +11,7 @@ import {
   focusVisible,
   simulatePointerDevice,
   programmaticFocusTriggersFocusVisible,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import PropTypes from 'prop-types';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import ButtonBase, { buttonBaseClasses as classes } from '@mui/material/ButtonBase';
diff --git a/packages/mui-material/src/ButtonBase/Ripple.test.js b/packages/mui-material/src/ButtonBase/Ripple.test.js
index 4c445dc4f6c065..23e325362196b9 100644
--- a/packages/mui-material/src/ButtonBase/Ripple.test.js
+++ b/packages/mui-material/src/ButtonBase/Ripple.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import Ripple from './Ripple';
 import classes from './touchRippleClasses';
 
diff --git a/packages/mui-material/src/ButtonBase/TouchRipple.test.js b/packages/mui-material/src/ButtonBase/TouchRipple.test.js
index 5342e235152473..3c32076db30668 100644
--- a/packages/mui-material/src/ButtonBase/TouchRipple.test.js
+++ b/packages/mui-material/src/ButtonBase/TouchRipple.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, act, createRenderer } from 'test/utils';
+import { describeConformance, act, createRenderer } from '@mui-internal/test-utils';
 import TouchRipple, { DELAY_RIPPLE } from './TouchRipple';
 
 const cb = () => {};
diff --git a/packages/mui-material/src/ButtonGroup/ButtonGroup.test.js b/packages/mui-material/src/ButtonGroup/ButtonGroup.test.js
index e79439f7b13cba..809ad92a059cd4 100644
--- a/packages/mui-material/src/ButtonGroup/ButtonGroup.test.js
+++ b/packages/mui-material/src/ButtonGroup/ButtonGroup.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, screen } from 'test/utils';
+import { createRenderer, describeConformance, screen } from '@mui-internal/test-utils';
 import ButtonGroup, { buttonGroupClasses as classes } from '@mui/material/ButtonGroup';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import Button, { buttonClasses } from '@mui/material/Button';
diff --git a/packages/mui-material/src/Card/Card.test.tsx b/packages/mui-material/src/Card/Card.test.tsx
index 11d7bb2a21c93a..d6ee9fdcd3bea1 100644
--- a/packages/mui-material/src/Card/Card.test.tsx
+++ b/packages/mui-material/src/Card/Card.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Card, { cardClasses as classes } from '@mui/material/Card';
 import Paper from '@mui/material/Paper';
 
diff --git a/packages/mui-material/src/CardActionArea/CardActionArea.test.js b/packages/mui-material/src/CardActionArea/CardActionArea.test.js
index d3d9db7d1ce49c..1d878f74a37e9b 100644
--- a/packages/mui-material/src/CardActionArea/CardActionArea.test.js
+++ b/packages/mui-material/src/CardActionArea/CardActionArea.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import CardActionArea, { cardActionAreaClasses as classes } from '@mui/material/CardActionArea';
 import ButtonBase from '@mui/material/ButtonBase';
 
diff --git a/packages/mui-material/src/CardActions/CardActions.test.js b/packages/mui-material/src/CardActions/CardActions.test.js
index 821827d7a516ff..734aa0c294be0a 100644
--- a/packages/mui-material/src/CardActions/CardActions.test.js
+++ b/packages/mui-material/src/CardActions/CardActions.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import CardActions, { cardActionsClasses as classes } from '@mui/material/CardActions';
 
 describe('<CardActions />', () => {
diff --git a/packages/mui-material/src/CardContent/CardContent.test.js b/packages/mui-material/src/CardContent/CardContent.test.js
index d7c92860c2f9f4..2ac705d5f40c49 100644
--- a/packages/mui-material/src/CardContent/CardContent.test.js
+++ b/packages/mui-material/src/CardContent/CardContent.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import CardContent, { cardContentClasses as classes } from '@mui/material/CardContent';
 
 describe('<CardContent />', () => {
diff --git a/packages/mui-material/src/CardHeader/CardHeader.test.js b/packages/mui-material/src/CardHeader/CardHeader.test.js
index 59de5b89f0e2fe..e78678b846cf81 100644
--- a/packages/mui-material/src/CardHeader/CardHeader.test.js
+++ b/packages/mui-material/src/CardHeader/CardHeader.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { typographyClasses } from '@mui/material/Typography';
 import CardHeader, { cardHeaderClasses as classes } from '@mui/material/CardHeader';
 
diff --git a/packages/mui-material/src/CardMedia/CardMedia.test.js b/packages/mui-material/src/CardMedia/CardMedia.test.js
index 294346fe273fc7..b538f30603ac37 100644
--- a/packages/mui-material/src/CardMedia/CardMedia.test.js
+++ b/packages/mui-material/src/CardMedia/CardMedia.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, screen } from 'test/utils';
+import { createRenderer, describeConformance, screen } from '@mui-internal/test-utils';
 import CardMedia, { cardMediaClasses as classes } from '@mui/material/CardMedia';
 
 describe('<CardMedia />', () => {
diff --git a/packages/mui-material/src/Checkbox/Checkbox.test.js b/packages/mui-material/src/Checkbox/Checkbox.test.js
index 9d7f03b8b267cc..900c02f5879e62 100644
--- a/packages/mui-material/src/Checkbox/Checkbox.test.js
+++ b/packages/mui-material/src/Checkbox/Checkbox.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer } from 'test/utils';
+import { describeConformance, act, createRenderer } from '@mui-internal/test-utils';
 import Checkbox, { checkboxClasses as classes } from '@mui/material/Checkbox';
 import FormControl from '@mui/material/FormControl';
 import ButtonBase from '@mui/material/ButtonBase';
diff --git a/packages/mui-material/src/Chip/Chip.test.js b/packages/mui-material/src/Chip/Chip.test.js
index dd5c45175c6f48..9c46654465cb14 100644
--- a/packages/mui-material/src/Chip/Chip.test.js
+++ b/packages/mui-material/src/Chip/Chip.test.js
@@ -9,7 +9,7 @@ import {
   focusVisible,
   simulatePointerDevice,
   programmaticFocusTriggersFocusVisible,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import Avatar from '@mui/material/Avatar';
 import Chip, { chipClasses as classes } from '@mui/material/Chip';
 import {
diff --git a/packages/mui-material/src/CircularProgress/CircularProgress.test.js b/packages/mui-material/src/CircularProgress/CircularProgress.test.js
index 9df1871fea0270..bc21d0569eb17e 100644
--- a/packages/mui-material/src/CircularProgress/CircularProgress.test.js
+++ b/packages/mui-material/src/CircularProgress/CircularProgress.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import CircularProgress, {
   circularProgressClasses as classes,
 } from '@mui/material/CircularProgress';
diff --git a/packages/mui-material/src/Collapse/Collapse.test.js b/packages/mui-material/src/Collapse/Collapse.test.js
index afc48de4aebaf5..e5489956ea46f5 100644
--- a/packages/mui-material/src/Collapse/Collapse.test.js
+++ b/packages/mui-material/src/Collapse/Collapse.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy, stub } from 'sinon';
-import { act, createRenderer, describeConformance } from 'test/utils';
+import { act, createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { Transition } from 'react-transition-group';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import Collapse, { collapseClasses as classes } from '@mui/material/Collapse';
diff --git a/packages/mui-material/src/Container/Container.test.js b/packages/mui-material/src/Container/Container.test.js
index c0ed5d82ab34b1..1747d8ffb00248 100644
--- a/packages/mui-material/src/Container/Container.test.js
+++ b/packages/mui-material/src/Container/Container.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import Container, { containerClasses as classes } from '@mui/material/Container';
 
 describe('<Container />', () => {
diff --git a/packages/mui-material/src/CssBaseline/CssBaseline.test.js b/packages/mui-material/src/CssBaseline/CssBaseline.test.js
index b6a443ac148bd0..af2be310779777 100644
--- a/packages/mui-material/src/CssBaseline/CssBaseline.test.js
+++ b/packages/mui-material/src/CssBaseline/CssBaseline.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import CssBaseline from '@mui/material/CssBaseline';
 import { ThemeProvider, createTheme, hexToRgb } from '@mui/material/styles';
 
diff --git a/packages/mui-material/src/Dialog/Dialog.test.js b/packages/mui-material/src/Dialog/Dialog.test.js
index 6373cf216ab6be..0280c5810a0e2a 100644
--- a/packages/mui-material/src/Dialog/Dialog.test.js
+++ b/packages/mui-material/src/Dialog/Dialog.test.js
@@ -1,7 +1,13 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import Modal from '@mui/material/Modal';
 import Dialog, { dialogClasses as classes } from '@mui/material/Dialog';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
@@ -19,14 +25,14 @@ function userClick(element) {
 }
 
 /**
- * @param {typeof import('test/utils').screen} view
+ * @param {typeof import('@mui-internal/test-utils').screen} view
  */
 function findBackdrop(view) {
   return view.getByRole('dialog').parentElement;
 }
 
 /**
- * @param {typeof import('test/utils').screen} view
+ * @param {typeof import('@mui-internal/test-utils').screen} view
  */
 function clickBackdrop(view) {
   userClick(findBackdrop(view));
diff --git a/packages/mui-material/src/DialogActions/DialogActions.test.js b/packages/mui-material/src/DialogActions/DialogActions.test.js
index e852dc8669a48a..e5c0426fd8a836 100644
--- a/packages/mui-material/src/DialogActions/DialogActions.test.js
+++ b/packages/mui-material/src/DialogActions/DialogActions.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import DialogActions, { dialogActionsClasses as classes } from '@mui/material/DialogActions';
 
 describe('<DialogActions />', () => {
diff --git a/packages/mui-material/src/DialogContent/DialogContent.test.js b/packages/mui-material/src/DialogContent/DialogContent.test.js
index 7c482c8f66772e..ba7041fbbd59f7 100644
--- a/packages/mui-material/src/DialogContent/DialogContent.test.js
+++ b/packages/mui-material/src/DialogContent/DialogContent.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import DialogContent, { dialogContentClasses as classes } from '@mui/material/DialogContent';
 
 describe('<DialogContent />', () => {
diff --git a/packages/mui-material/src/DialogContentText/DialogContentText.test.js b/packages/mui-material/src/DialogContentText/DialogContentText.test.js
index 19c1b639ee40c7..e83e70d20f9312 100644
--- a/packages/mui-material/src/DialogContentText/DialogContentText.test.js
+++ b/packages/mui-material/src/DialogContentText/DialogContentText.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Typography from '@mui/material/Typography';
 import DialogContentText, {
   dialogContentTextClasses as classes,
diff --git a/packages/mui-material/src/DialogTitle/DialogTitle.test.js b/packages/mui-material/src/DialogTitle/DialogTitle.test.js
index 25d50a50d3c306..9ba57ca45486da 100644
--- a/packages/mui-material/src/DialogTitle/DialogTitle.test.js
+++ b/packages/mui-material/src/DialogTitle/DialogTitle.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import Typography from '@mui/material/Typography';
 import DialogTitle, { dialogTitleClasses as classes } from '@mui/material/DialogTitle';
 import Dialog from '@mui/material/Dialog';
diff --git a/packages/mui-material/src/Divider/Divider.test.js b/packages/mui-material/src/Divider/Divider.test.js
index 91280cfa6e0419..cdba5d9675f424 100644
--- a/packages/mui-material/src/Divider/Divider.test.js
+++ b/packages/mui-material/src/Divider/Divider.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import Divider, { dividerClasses as classes } from '@mui/material/Divider';
 
 describe('<Divider />', () => {
diff --git a/packages/mui-material/src/Drawer/Drawer.test.js b/packages/mui-material/src/Drawer/Drawer.test.js
index c78c0f66e82c11..f410f654e621cd 100644
--- a/packages/mui-material/src/Drawer/Drawer.test.js
+++ b/packages/mui-material/src/Drawer/Drawer.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, describeConformance, screen } from 'test/utils';
+import { createRenderer, describeConformance, screen } from '@mui-internal/test-utils';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import Drawer, { drawerClasses as classes } from '@mui/material/Drawer';
 import { getAnchor, isHorizontal } from './Drawer';
diff --git a/packages/mui-material/src/Fab/Fab.test.js b/packages/mui-material/src/Fab/Fab.test.js
index 78b91555a67cd7..df56852e626573 100644
--- a/packages/mui-material/src/Fab/Fab.test.js
+++ b/packages/mui-material/src/Fab/Fab.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, act, fireEvent } from 'test/utils';
+import { describeConformance, createRenderer, act, fireEvent } from '@mui-internal/test-utils';
 import Fab, { fabClasses as classes } from '@mui/material/Fab';
 import ButtonBase, { touchRippleClasses } from '@mui/material/ButtonBase';
 import Icon from '@mui/material/Icon';
diff --git a/packages/mui-material/src/Fade/Fade.test.js b/packages/mui-material/src/Fade/Fade.test.js
index 3b1621e5622c29..a4861623add6e1 100644
--- a/packages/mui-material/src/Fade/Fade.test.js
+++ b/packages/mui-material/src/Fade/Fade.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { Transition } from 'react-transition-group';
 import Fade from '@mui/material/Fade';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
diff --git a/packages/mui-material/src/FilledInput/FilledInput.test.js b/packages/mui-material/src/FilledInput/FilledInput.test.js
index 12d05b68974504..e7ce5fde0068d7 100644
--- a/packages/mui-material/src/FilledInput/FilledInput.test.js
+++ b/packages/mui-material/src/FilledInput/FilledInput.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import FilledInput, { filledInputClasses as classes } from '@mui/material/FilledInput';
 import InputBase from '@mui/material/InputBase';
 
diff --git a/packages/mui-material/src/FormControl/FormControl.test.js b/packages/mui-material/src/FormControl/FormControl.test.js
index 0cb5aa7d738929..1e905a6e098884 100644
--- a/packages/mui-material/src/FormControl/FormControl.test.js
+++ b/packages/mui-material/src/FormControl/FormControl.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer } from 'test/utils';
+import { describeConformance, act, createRenderer } from '@mui-internal/test-utils';
 import FormControl, { formControlClasses as classes } from '@mui/material/FormControl';
 import Input from '@mui/material/Input';
 import Select from '@mui/material/Select';
diff --git a/packages/mui-material/src/FormControlLabel/FormControlLabel.test.js b/packages/mui-material/src/FormControlLabel/FormControlLabel.test.js
index f2ef25f819bd64..54711bbc7544d5 100644
--- a/packages/mui-material/src/FormControlLabel/FormControlLabel.test.js
+++ b/packages/mui-material/src/FormControlLabel/FormControlLabel.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import FormControlLabel, {
   formControlLabelClasses as classes,
 } from '@mui/material/FormControlLabel';
diff --git a/packages/mui-material/src/FormGroup/FormGroup.test.js b/packages/mui-material/src/FormGroup/FormGroup.test.js
index 9321816aa6c2db..6750ca848e023e 100644
--- a/packages/mui-material/src/FormGroup/FormGroup.test.js
+++ b/packages/mui-material/src/FormGroup/FormGroup.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import FormGroup, { formGroupClasses as classes } from '@mui/material/FormGroup';
 import FormControl from '@mui/material/FormControl';
 
diff --git a/packages/mui-material/src/FormHelperText/FormHelperText.test.js b/packages/mui-material/src/FormHelperText/FormHelperText.test.js
index 9d367aac2a5f07..1d56b54bd16a31 100644
--- a/packages/mui-material/src/FormHelperText/FormHelperText.test.js
+++ b/packages/mui-material/src/FormHelperText/FormHelperText.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import FormHelperText, { formHelperTextClasses as classes } from '@mui/material/FormHelperText';
 import FormControl from '@mui/material/FormControl';
 
diff --git a/packages/mui-material/src/FormLabel/FormLabel.test.js b/packages/mui-material/src/FormLabel/FormLabel.test.js
index 3fd3411cd7756a..ca7dee45ad6604 100644
--- a/packages/mui-material/src/FormLabel/FormLabel.test.js
+++ b/packages/mui-material/src/FormLabel/FormLabel.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { expect } from 'chai';
-import { describeConformance, act, createRenderer } from 'test/utils';
+import { describeConformance, act, createRenderer } from '@mui-internal/test-utils';
 import FormLabel, { formLabelClasses as classes } from '@mui/material/FormLabel';
 import FormControl, { useFormControl } from '@mui/material/FormControl';
 import { hexToRgb } from '@mui/material/styles';
diff --git a/packages/mui-material/src/GlobalStyles/GlobalStyles.test.js b/packages/mui-material/src/GlobalStyles/GlobalStyles.test.js
index 17f9fb7086a77a..7d203be949b1c5 100644
--- a/packages/mui-material/src/GlobalStyles/GlobalStyles.test.js
+++ b/packages/mui-material/src/GlobalStyles/GlobalStyles.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import GlobalStyles from '@mui/material/GlobalStyles';
 import { ThemeProvider, createTheme } from '@mui/material//styles/';
 
diff --git a/packages/mui-material/src/Grid/Grid.test.js b/packages/mui-material/src/Grid/Grid.test.js
index c7b031abdb8446..72d581a9812272 100644
--- a/packages/mui-material/src/Grid/Grid.test.js
+++ b/packages/mui-material/src/Grid/Grid.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, screen } from 'test/utils';
+import { describeConformance, createRenderer, screen } from '@mui-internal/test-utils';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import defaultTheme from '@mui/material/styles/defaultTheme';
 import Grid, { gridClasses as classes } from '@mui/material/Grid';
diff --git a/packages/mui-material/src/Grow/Grow.test.js b/packages/mui-material/src/Grow/Grow.test.js
index 9848c3d54dc1af..6c156a3bda9c0d 100644
--- a/packages/mui-material/src/Grow/Grow.test.js
+++ b/packages/mui-material/src/Grow/Grow.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { Transition } from 'react-transition-group';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import Grow from '@mui/material/Grow';
diff --git a/packages/mui-material/src/Hidden/Hidden.test.js b/packages/mui-material/src/Hidden/Hidden.test.js
index 2ab58034152857..f5024fe11fb8fa 100644
--- a/packages/mui-material/src/Hidden/Hidden.test.js
+++ b/packages/mui-material/src/Hidden/Hidden.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import Hidden from '@mui/material/Hidden';
 
 describe('<Hidden />', () => {
diff --git a/packages/mui-material/src/Hidden/HiddenCss.test.js b/packages/mui-material/src/Hidden/HiddenCss.test.js
index 83f7c4f279b0a5..a77e5ebd557b8c 100644
--- a/packages/mui-material/src/Hidden/HiddenCss.test.js
+++ b/packages/mui-material/src/Hidden/HiddenCss.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, strictModeDoubleLoggingSuppressed } from 'test/utils';
+import { createRenderer, strictModeDoubleLoggingSuppressed } from '@mui-internal/test-utils';
 import HiddenCss from './HiddenCss';
 import { createTheme, ThemeProvider } from '../styles';
 import classes from './hiddenCssClasses';
diff --git a/packages/mui-material/src/Hidden/HiddenJs.test.js b/packages/mui-material/src/Hidden/HiddenJs.test.js
index d96dab021d81da..43cc2320c25648 100644
--- a/packages/mui-material/src/Hidden/HiddenJs.test.js
+++ b/packages/mui-material/src/Hidden/HiddenJs.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import HiddenJs from './HiddenJs';
 
 describe('<HiddenJs />', () => {
diff --git a/packages/mui-material/src/Icon/Icon.test.js b/packages/mui-material/src/Icon/Icon.test.js
index e1c22af46319d5..c4acaff527e05e 100644
--- a/packages/mui-material/src/Icon/Icon.test.js
+++ b/packages/mui-material/src/Icon/Icon.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Icon, { iconClasses as classes } from '@mui/material/Icon';
 
 describe('<Icon />', () => {
diff --git a/packages/mui-material/src/IconButton/IconButton.test.js b/packages/mui-material/src/IconButton/IconButton.test.js
index 8dcad452cc84f7..7c744f92a59c47 100644
--- a/packages/mui-material/src/IconButton/IconButton.test.js
+++ b/packages/mui-material/src/IconButton/IconButton.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import PropTypes from 'prop-types';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { unstable_capitalize as capitalize } from '@mui/utils';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import IconButton, { iconButtonClasses as classes } from '@mui/material/IconButton';
diff --git a/packages/mui-material/src/ImageList/ImageList.test.js b/packages/mui-material/src/ImageList/ImageList.test.js
index 724dc0dabc8178..d57841ecc61442 100644
--- a/packages/mui-material/src/ImageList/ImageList.test.js
+++ b/packages/mui-material/src/ImageList/ImageList.test.js
@@ -1,6 +1,6 @@
 import { expect } from 'chai';
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import ImageList, { imageListClasses as classes } from '@mui/material/ImageList';
 
 const itemsData = [
diff --git a/packages/mui-material/src/ImageListItem/ImageListItem.test.js b/packages/mui-material/src/ImageListItem/ImageListItem.test.js
index d5be030ecccdde..6580c8ded5cd2e 100644
--- a/packages/mui-material/src/ImageListItem/ImageListItem.test.js
+++ b/packages/mui-material/src/ImageListItem/ImageListItem.test.js
@@ -1,6 +1,6 @@
 import { expect } from 'chai';
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import ImageList from '@mui/material/ImageList';
 import ImageListItem, { imageListItemClasses as classes } from '@mui/material/ImageListItem';
 
diff --git a/packages/mui-material/src/ImageListItemBar/ImageListItemBar.test.js b/packages/mui-material/src/ImageListItemBar/ImageListItemBar.test.js
index d1165a5c0595f3..64069aad1be4d6 100644
--- a/packages/mui-material/src/ImageListItemBar/ImageListItemBar.test.js
+++ b/packages/mui-material/src/ImageListItemBar/ImageListItemBar.test.js
@@ -1,6 +1,6 @@
 import { expect } from 'chai';
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import ImageListItemBar, {
   imageListItemBarClasses as classes,
 } from '@mui/material/ImageListItemBar';
diff --git a/packages/mui-material/src/Input/Input.test.js b/packages/mui-material/src/Input/Input.test.js
index 111685214225c6..37166718c3245f 100644
--- a/packages/mui-material/src/Input/Input.test.js
+++ b/packages/mui-material/src/Input/Input.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import InputBase from '@mui/material/InputBase';
 import Input, { inputClasses as classes } from '@mui/material/Input';
 
diff --git a/packages/mui-material/src/InputAdornment/InputAdornment.test.js b/packages/mui-material/src/InputAdornment/InputAdornment.test.js
index bf7020be5bec60..8cb9c32096e4b6 100644
--- a/packages/mui-material/src/InputAdornment/InputAdornment.test.js
+++ b/packages/mui-material/src/InputAdornment/InputAdornment.test.js
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, strictModeDoubleLoggingSuppressed } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  strictModeDoubleLoggingSuppressed,
+} from '@mui-internal/test-utils';
 import { typographyClasses } from '@mui/material/Typography';
 import InputAdornment, { inputAdornmentClasses as classes } from '@mui/material/InputAdornment';
 import TextField from '@mui/material/TextField';
diff --git a/packages/mui-material/src/InputBase/InputBase.test.js b/packages/mui-material/src/InputBase/InputBase.test.js
index 789df2c66cf233..f890e3e7ccc41f 100644
--- a/packages/mui-material/src/InputBase/InputBase.test.js
+++ b/packages/mui-material/src/InputBase/InputBase.test.js
@@ -2,7 +2,13 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import { ThemeProvider } from '@emotion/react';
 import FormControl, { useFormControl } from '@mui/material/FormControl';
 import InputAdornment from '@mui/material/InputAdornment';
diff --git a/packages/mui-material/src/InputLabel/InputLabel.test.js b/packages/mui-material/src/InputLabel/InputLabel.test.js
index 3027ef9374aa11..1a1b2a7e038f7c 100644
--- a/packages/mui-material/src/InputLabel/InputLabel.test.js
+++ b/packages/mui-material/src/InputLabel/InputLabel.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { expect } from 'chai';
-import { describeConformance, act, createRenderer } from 'test/utils';
+import { describeConformance, act, createRenderer } from '@mui-internal/test-utils';
 import { ClassNames } from '@emotion/react';
 import FormControl from '@mui/material/FormControl';
 import Input from '@mui/material/Input';
diff --git a/packages/mui-material/src/LinearProgress/LinearProgress.test.js b/packages/mui-material/src/LinearProgress/LinearProgress.test.js
index ac41f4bb04c7d9..711f01a7b60238 100644
--- a/packages/mui-material/src/LinearProgress/LinearProgress.test.js
+++ b/packages/mui-material/src/LinearProgress/LinearProgress.test.js
@@ -5,7 +5,7 @@ import {
   screen,
   describeConformance,
   strictModeDoubleLoggingSuppressed,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import LinearProgress, { linearProgressClasses as classes } from '@mui/material/LinearProgress';
 
 describe('<LinearProgress />', () => {
diff --git a/packages/mui-material/src/Link/Link.test.js b/packages/mui-material/src/Link/Link.test.js
index 14a934324e0cce..30130a42049a98 100644
--- a/packages/mui-material/src/Link/Link.test.js
+++ b/packages/mui-material/src/Link/Link.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { act, createRenderer, fireEvent, describeConformance } from 'test/utils';
+import { act, createRenderer, fireEvent, describeConformance } from '@mui-internal/test-utils';
 import Link, { linkClasses as classes } from '@mui/material/Link';
 import Typography, { typographyClasses } from '@mui/material/Typography';
 
diff --git a/packages/mui-material/src/List/List.test.js b/packages/mui-material/src/List/List.test.js
index dbaaed4f12af2d..403a0fcd10da75 100644
--- a/packages/mui-material/src/List/List.test.js
+++ b/packages/mui-material/src/List/List.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import ListSubheader, { listSubheaderClasses } from '@mui/material/ListSubheader';
 import ListItem, { listItemClasses } from '@mui/material/ListItem';
 import List, { listClasses as classes } from '@mui/material/List';
diff --git a/packages/mui-material/src/ListItem/ListItem.test.js b/packages/mui-material/src/ListItem/ListItem.test.js
index 8552b641a0435b..1fb64bf733581b 100644
--- a/packages/mui-material/src/ListItem/ListItem.test.js
+++ b/packages/mui-material/src/ListItem/ListItem.test.js
@@ -1,7 +1,13 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import PropTypes from 'prop-types';
-import { describeConformance, act, createRenderer, fireEvent, queries } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  queries,
+} from '@mui-internal/test-utils';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import ListItemText from '@mui/material/ListItemText';
 import ListItemSecondaryAction from '@mui/material/ListItemSecondaryAction';
diff --git a/packages/mui-material/src/ListItemAvatar/ListItemAvatar.test.js b/packages/mui-material/src/ListItemAvatar/ListItemAvatar.test.js
index 76ddec77e5a99e..ef933984736f5d 100644
--- a/packages/mui-material/src/ListItemAvatar/ListItemAvatar.test.js
+++ b/packages/mui-material/src/ListItemAvatar/ListItemAvatar.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import ListItemAvatar, { listItemAvatarClasses as classes } from '@mui/material/ListItemAvatar';
 
 describe('<ListItemAvatar />', () => {
diff --git a/packages/mui-material/src/ListItemButton/ListItemButton.test.js b/packages/mui-material/src/ListItemButton/ListItemButton.test.js
index 0803b23f795338..ba95529f50fb2a 100644
--- a/packages/mui-material/src/ListItemButton/ListItemButton.test.js
+++ b/packages/mui-material/src/ListItemButton/ListItemButton.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, act, createRenderer, fireEvent } from 'test/utils';
+import { describeConformance, act, createRenderer, fireEvent } from '@mui-internal/test-utils';
 import ListItemButton, { listItemButtonClasses as classes } from '@mui/material/ListItemButton';
 import ButtonBase from '@mui/material/ButtonBase';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
diff --git a/packages/mui-material/src/ListItemIcon/ListItemIcon.test.js b/packages/mui-material/src/ListItemIcon/ListItemIcon.test.js
index 5c8b2482458e8e..541af1b1595457 100644
--- a/packages/mui-material/src/ListItemIcon/ListItemIcon.test.js
+++ b/packages/mui-material/src/ListItemIcon/ListItemIcon.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import ListItemIcon, { listItemIconClasses as classes } from '@mui/material/ListItemIcon';
 
 describe('<ListItemIcon />', () => {
diff --git a/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.test.js b/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.test.js
index e2e16012d35203..771082fd1883e5 100644
--- a/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.test.js
+++ b/packages/mui-material/src/ListItemSecondaryAction/ListItemSecondaryAction.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import ListItem from '@mui/material/ListItem';
 import ListItemSecondaryAction, {
   listItemSecondaryActionClasses as classes,
diff --git a/packages/mui-material/src/ListItemText/ListItemText.test.js b/packages/mui-material/src/ListItemText/ListItemText.test.js
index 74c763665191f8..f38cda46ea7f62 100644
--- a/packages/mui-material/src/ListItemText/ListItemText.test.js
+++ b/packages/mui-material/src/ListItemText/ListItemText.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Typography, { typographyClasses } from '@mui/material/Typography';
 import ListItemText, { listItemTextClasses as classes } from '@mui/material/ListItemText';
 
diff --git a/packages/mui-material/src/ListSubheader/ListSubheader.test.js b/packages/mui-material/src/ListSubheader/ListSubheader.test.js
index a22f9dcc689f64..9b0720a58d9599 100644
--- a/packages/mui-material/src/ListSubheader/ListSubheader.test.js
+++ b/packages/mui-material/src/ListSubheader/ListSubheader.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import ListSubheader, { listSubheaderClasses as classes } from '@mui/material/ListSubheader';
 
 describe('<ListSubheader />', () => {
diff --git a/packages/mui-material/src/Menu/Menu.test.js b/packages/mui-material/src/Menu/Menu.test.js
index 902a5843441dd6..0287c5059c6d15 100644
--- a/packages/mui-material/src/Menu/Menu.test.js
+++ b/packages/mui-material/src/Menu/Menu.test.js
@@ -8,7 +8,7 @@ import {
   screen,
   fireEvent,
   strictModeDoubleLoggingSuppressed,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import Menu, { menuClasses as classes } from '@mui/material/Menu';
 import Popover from '@mui/material/Popover';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
diff --git a/packages/mui-material/src/MenuItem/MenuItem.test.js b/packages/mui-material/src/MenuItem/MenuItem.test.js
index 4289ae49302788..b89f6b3ce692e3 100644
--- a/packages/mui-material/src/MenuItem/MenuItem.test.js
+++ b/packages/mui-material/src/MenuItem/MenuItem.test.js
@@ -1,7 +1,13 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { act, describeConformance, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  act,
+  describeConformance,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import MenuItem, { menuItemClasses as classes } from '@mui/material/MenuItem';
 import ButtonBase from '@mui/material/ButtonBase';
 import ListContext from '../List/ListContext';
diff --git a/packages/mui-material/src/MenuList/MenuList.test.js b/packages/mui-material/src/MenuList/MenuList.test.js
index c59f6678e1af80..fb6b32e79ce029 100644
--- a/packages/mui-material/src/MenuList/MenuList.test.js
+++ b/packages/mui-material/src/MenuList/MenuList.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { stub } from 'sinon';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import Divider from '@mui/material/Divider';
 import MenuList from '@mui/material/MenuList';
 import MenuItem from '@mui/material/MenuItem';
diff --git a/packages/mui-material/src/MobileStepper/MobileStepper.test.js b/packages/mui-material/src/MobileStepper/MobileStepper.test.js
index fc124bd985f772..46d60b1c76157b 100644
--- a/packages/mui-material/src/MobileStepper/MobileStepper.test.js
+++ b/packages/mui-material/src/MobileStepper/MobileStepper.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance, fireEvent, screen } from 'test/utils';
+import { createRenderer, describeConformance, fireEvent, screen } from '@mui-internal/test-utils';
 import Paper, { paperClasses } from '@mui/material/Paper';
 import Button from '@mui/material/Button';
 import MobileStepper, { mobileStepperClasses as classes } from '@mui/material/MobileStepper';
diff --git a/packages/mui-material/src/Modal/Modal.test.js b/packages/mui-material/src/Modal/Modal.test.js
index 48fb7f34dd6eb1..39ac7256c19033 100644
--- a/packages/mui-material/src/Modal/Modal.test.js
+++ b/packages/mui-material/src/Modal/Modal.test.js
@@ -3,7 +3,14 @@ import * as ReactDOM from 'react-dom';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import PropTypes from 'prop-types';
-import { act, createRenderer, fireEvent, within, describeConformance, screen } from 'test/utils';
+import {
+  act,
+  createRenderer,
+  fireEvent,
+  within,
+  describeConformance,
+  screen,
+} from '@mui-internal/test-utils';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import Fade from '@mui/material/Fade';
 import Modal, { modalClasses as classes } from '@mui/material/Modal';
diff --git a/packages/mui-material/src/NativeSelect/NativeSelect.test.js b/packages/mui-material/src/NativeSelect/NativeSelect.test.js
index 0d0a538bba2a9a..a61b8b84f29b9b 100644
--- a/packages/mui-material/src/NativeSelect/NativeSelect.test.js
+++ b/packages/mui-material/src/NativeSelect/NativeSelect.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { createTheme, ThemeProvider, styled } from '@mui/material/styles';
 import NativeSelect, { nativeSelectClasses as classes } from '@mui/material/NativeSelect';
 import Input, { inputClasses } from '@mui/material/Input';
diff --git a/packages/mui-material/src/NativeSelect/NativeSelectInput.test.js b/packages/mui-material/src/NativeSelect/NativeSelectInput.test.js
index 28e4a4867f5a0c..268a8e7d197bb9 100644
--- a/packages/mui-material/src/NativeSelect/NativeSelectInput.test.js
+++ b/packages/mui-material/src/NativeSelect/NativeSelectInput.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, createRenderer, fireEvent } from 'test/utils';
+import { describeConformance, createRenderer, fireEvent } from '@mui-internal/test-utils';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import NativeSelectInput from './NativeSelectInput';
 import nativeSelectClasses from './nativeSelectClasses';
diff --git a/packages/mui-material/src/OutlinedInput/NotchedOutline.test.js b/packages/mui-material/src/OutlinedInput/NotchedOutline.test.js
index 5b398479a4ceba..071166efd9645a 100644
--- a/packages/mui-material/src/OutlinedInput/NotchedOutline.test.js
+++ b/packages/mui-material/src/OutlinedInput/NotchedOutline.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import NotchedOutline from './NotchedOutline';
 
diff --git a/packages/mui-material/src/OutlinedInput/OutlinedInput.test.js b/packages/mui-material/src/OutlinedInput/OutlinedInput.test.js
index cbca44086563f3..870d01a78609d7 100644
--- a/packages/mui-material/src/OutlinedInput/OutlinedInput.test.js
+++ b/packages/mui-material/src/OutlinedInput/OutlinedInput.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import OutlinedInput, { outlinedInputClasses as classes } from '@mui/material/OutlinedInput';
 import InputBase from '@mui/material/InputBase';
diff --git a/packages/mui-material/src/Pagination/Pagination.test.js b/packages/mui-material/src/Pagination/Pagination.test.js
index efe1ae31100c3f..5b755ec2991220 100644
--- a/packages/mui-material/src/Pagination/Pagination.test.js
+++ b/packages/mui-material/src/Pagination/Pagination.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import Pagination, { paginationClasses as classes } from '@mui/material/Pagination';
 import { paginationItemClasses } from '@mui/material/PaginationItem';
diff --git a/packages/mui-material/src/PaginationItem/PaginationItem.test.js b/packages/mui-material/src/PaginationItem/PaginationItem.test.js
index 39efb6fe667581..c469b912380481 100644
--- a/packages/mui-material/src/PaginationItem/PaginationItem.test.js
+++ b/packages/mui-material/src/PaginationItem/PaginationItem.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import PaginationItem, { paginationItemClasses as classes } from '@mui/material/PaginationItem';
 
 describe('<PaginationItem />', () => {
diff --git a/packages/mui-material/src/Paper/Paper.test.js b/packages/mui-material/src/Paper/Paper.test.js
index 98664deeaff0d3..46c1d427be721f 100644
--- a/packages/mui-material/src/Paper/Paper.test.js
+++ b/packages/mui-material/src/Paper/Paper.test.js
@@ -1,7 +1,11 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import PropTypes from 'prop-types';
-import { createRenderer, describeConformance, strictModeDoubleLoggingSuppressed } from 'test/utils';
+import {
+  createRenderer,
+  describeConformance,
+  strictModeDoubleLoggingSuppressed,
+} from '@mui-internal/test-utils';
 import Paper, { paperClasses as classes } from '@mui/material/Paper';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 
diff --git a/packages/mui-material/src/Popover/Popover.test.js b/packages/mui-material/src/Popover/Popover.test.js
index e39d353d37111e..3802fd4c228517 100644
--- a/packages/mui-material/src/Popover/Popover.test.js
+++ b/packages/mui-material/src/Popover/Popover.test.js
@@ -1,7 +1,13 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy, stub, match } from 'sinon';
-import { act, createMount, createRenderer, describeConformance, screen } from 'test/utils';
+import {
+  act,
+  createMount,
+  createRenderer,
+  describeConformance,
+  screen,
+} from '@mui-internal/test-utils';
 import PropTypes from 'prop-types';
 import Grow from '@mui/material/Grow';
 import Modal from '@mui/material/Modal';
diff --git a/packages/mui-material/src/Popper/Popper.test.js b/packages/mui-material/src/Popper/Popper.test.js
index 6fd5ff0aa0df02..74162a2c04da51 100644
--- a/packages/mui-material/src/Popper/Popper.test.js
+++ b/packages/mui-material/src/Popper/Popper.test.js
@@ -1,6 +1,12 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, act, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import { ThemeProvider, createTheme } from '@mui/system';
 import Grow from '@mui/material/Grow';
 import Popper from '@mui/material/Popper';
diff --git a/packages/mui-material/src/Radio/Radio.test.js b/packages/mui-material/src/Radio/Radio.test.js
index 41a6f49919f911..c10574bf33bf53 100644
--- a/packages/mui-material/src/Radio/Radio.test.js
+++ b/packages/mui-material/src/Radio/Radio.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import Radio, { radioClasses as classes } from '@mui/material/Radio';
 import FormControl from '@mui/material/FormControl';
 import ButtonBase from '@mui/material/ButtonBase';
diff --git a/packages/mui-material/src/RadioGroup/RadioGroup.test.js b/packages/mui-material/src/RadioGroup/RadioGroup.test.js
index cbbd5ada49d98f..f0fb81a9869f50 100644
--- a/packages/mui-material/src/RadioGroup/RadioGroup.test.js
+++ b/packages/mui-material/src/RadioGroup/RadioGroup.test.js
@@ -2,7 +2,13 @@ import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import PropTypes from 'prop-types';
-import { describeConformance, act, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import FormGroup from '@mui/material/FormGroup';
 import Radio from '@mui/material/Radio';
 import RadioGroup, { useRadioGroup } from '@mui/material/RadioGroup';
diff --git a/packages/mui-material/src/Rating/Rating.test.js b/packages/mui-material/src/Rating/Rating.test.js
index 8323fb3238ba35..edba69206fefed 100644
--- a/packages/mui-material/src/Rating/Rating.test.js
+++ b/packages/mui-material/src/Rating/Rating.test.js
@@ -1,7 +1,13 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { stub, spy } from 'sinon';
-import { act, describeConformance, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  act,
+  describeConformance,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import Rating, { ratingClasses as classes } from '@mui/material/Rating';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 
diff --git a/packages/mui-material/src/ScopedCssBaseline/ScopedCssBaseline.test.js b/packages/mui-material/src/ScopedCssBaseline/ScopedCssBaseline.test.js
index 860223aba311d7..8fef049dda9d3b 100644
--- a/packages/mui-material/src/ScopedCssBaseline/ScopedCssBaseline.test.js
+++ b/packages/mui-material/src/ScopedCssBaseline/ScopedCssBaseline.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import ScopedCssBaseline, {
   scopedCssBaselineClasses as classes,
 } from '@mui/material/ScopedCssBaseline';
diff --git a/packages/mui-material/src/Select/Select.test.js b/packages/mui-material/src/Select/Select.test.js
index cf99abe6b161f9..8668adf7ca8f22 100644
--- a/packages/mui-material/src/Select/Select.test.js
+++ b/packages/mui-material/src/Select/Select.test.js
@@ -8,7 +8,7 @@ import {
   createRenderer,
   fireEvent,
   screen,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import MenuItem, { menuItemClasses } from '@mui/material/MenuItem';
 import ListSubheader from '@mui/material/ListSubheader';
diff --git a/packages/mui-material/src/Skeleton/Skeleton.test.js b/packages/mui-material/src/Skeleton/Skeleton.test.js
index 8ec3201c3c7ef1..41bd8d67eec034 100644
--- a/packages/mui-material/src/Skeleton/Skeleton.test.js
+++ b/packages/mui-material/src/Skeleton/Skeleton.test.js
@@ -1,6 +1,6 @@
 import { expect } from 'chai';
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Skeleton, { skeletonClasses as classes } from '@mui/material/Skeleton';
 
 describe('<Skeleton />', () => {
diff --git a/packages/mui-material/src/Slide/Slide.test.js b/packages/mui-material/src/Slide/Slide.test.js
index 8fad53168b56b8..5f0a315ef0a3e6 100644
--- a/packages/mui-material/src/Slide/Slide.test.js
+++ b/packages/mui-material/src/Slide/Slide.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy, stub } from 'sinon';
-import { act, createRenderer, describeConformance } from 'test/utils';
+import { act, createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { Transition } from 'react-transition-group';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import Slide from '@mui/material/Slide';
diff --git a/packages/mui-material/src/Slider/Slider.test.js b/packages/mui-material/src/Slider/Slider.test.js
index 728396a2cf84d1..0684d6eac6502e 100644
--- a/packages/mui-material/src/Slider/Slider.test.js
+++ b/packages/mui-material/src/Slider/Slider.test.js
@@ -2,7 +2,13 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { spy, stub } from 'sinon';
 import { expect } from 'chai';
-import { describeConformance, act, createRenderer, fireEvent, screen } from 'test/utils';
+import {
+  describeConformance,
+  act,
+  createRenderer,
+  fireEvent,
+  screen,
+} from '@mui-internal/test-utils';
 import { Slider as BaseSlider } from '@mui/base/Slider';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import Slider, { sliderClasses as classes } from '@mui/material/Slider';
diff --git a/packages/mui-material/src/Snackbar/Snackbar.test.js b/packages/mui-material/src/Snackbar/Snackbar.test.js
index eb047ec23e714d..f7756616cfa040 100644
--- a/packages/mui-material/src/Snackbar/Snackbar.test.js
+++ b/packages/mui-material/src/Snackbar/Snackbar.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer, fireEvent } from 'test/utils';
+import { describeConformance, act, createRenderer, fireEvent } from '@mui-internal/test-utils';
 import Snackbar, { snackbarClasses as classes } from '@mui/material/Snackbar';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 
diff --git a/packages/mui-material/src/SnackbarContent/SnackbarContent.test.js b/packages/mui-material/src/SnackbarContent/SnackbarContent.test.js
index 82098f59278357..0d1a0ac6886fce 100644
--- a/packages/mui-material/src/SnackbarContent/SnackbarContent.test.js
+++ b/packages/mui-material/src/SnackbarContent/SnackbarContent.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Paper from '@mui/material/Paper';
 import SnackbarContent, { snackbarContentClasses as classes } from '@mui/material/SnackbarContent';
 
diff --git a/packages/mui-material/src/SpeedDial/SpeedDial.test.js b/packages/mui-material/src/SpeedDial/SpeedDial.test.js
index ac7ad19fd3b3c7..c3776fffaa8b87 100644
--- a/packages/mui-material/src/SpeedDial/SpeedDial.test.js
+++ b/packages/mui-material/src/SpeedDial/SpeedDial.test.js
@@ -8,7 +8,7 @@ import {
   fireDiscreteEvent,
   screen,
   describeConformance,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import Icon from '@mui/material/Icon';
 import SpeedDial, { speedDialClasses as classes } from '@mui/material/SpeedDial';
 import SpeedDialAction from '@mui/material/SpeedDialAction';
diff --git a/packages/mui-material/src/SpeedDialAction/SpeedDialAction.test.js b/packages/mui-material/src/SpeedDialAction/SpeedDialAction.test.js
index a78f5bebd31de0..0a47c2da1e5db5 100644
--- a/packages/mui-material/src/SpeedDialAction/SpeedDialAction.test.js
+++ b/packages/mui-material/src/SpeedDialAction/SpeedDialAction.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, fireEvent } from 'test/utils';
+import { describeConformance, createRenderer, fireEvent } from '@mui-internal/test-utils';
 import Icon from '@mui/material/Icon';
 import Tooltip from '@mui/material/Tooltip';
 import { fabClasses } from '@mui/material/Fab';
diff --git a/packages/mui-material/src/SpeedDialIcon/SpeedDialIcon.test.js b/packages/mui-material/src/SpeedDialIcon/SpeedDialIcon.test.js
index fd09ff38ce2d0b..1ebce54b98ceee 100644
--- a/packages/mui-material/src/SpeedDialIcon/SpeedDialIcon.test.js
+++ b/packages/mui-material/src/SpeedDialIcon/SpeedDialIcon.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Icon from '@mui/material/Icon';
 import SpeedDialIcon, { speedDialIconClasses as classes } from '@mui/material/SpeedDialIcon';
 
diff --git a/packages/mui-material/src/Stack/Stack.test.js b/packages/mui-material/src/Stack/Stack.test.js
index a95d40de219861..5e7d58fb4ac7d5 100644
--- a/packages/mui-material/src/Stack/Stack.test.js
+++ b/packages/mui-material/src/Stack/Stack.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import Stack, { stackClasses as classes } from '@mui/material/Stack';
 
 // The main tests are in mui-system Stack folder
diff --git a/packages/mui-material/src/Step/Step.test.js b/packages/mui-material/src/Step/Step.test.js
index 9d744ff1082319..b502c0bc2e94d2 100644
--- a/packages/mui-material/src/Step/Step.test.js
+++ b/packages/mui-material/src/Step/Step.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Step, { stepClasses as classes } from '@mui/material/Step';
 import Stepper from '@mui/material/Stepper';
 import StepLabel, { stepLabelClasses } from '@mui/material/StepLabel';
diff --git a/packages/mui-material/src/StepButton/StepButton.test.js b/packages/mui-material/src/StepButton/StepButton.test.js
index c5ef4c5e400911..edd518ac105f4f 100644
--- a/packages/mui-material/src/StepButton/StepButton.test.js
+++ b/packages/mui-material/src/StepButton/StepButton.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { fireEvent } from '@testing-library/dom';
 import StepButton, { stepButtonClasses as classes } from '@mui/material/StepButton';
 import Step from '@mui/material/Step';
diff --git a/packages/mui-material/src/StepConnector/StepConnector.test.js b/packages/mui-material/src/StepConnector/StepConnector.test.js
index eff3dadaadcb4c..7407f76a23273d 100644
--- a/packages/mui-material/src/StepConnector/StepConnector.test.js
+++ b/packages/mui-material/src/StepConnector/StepConnector.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Stepper from '@mui/material/Stepper';
 import Step from '@mui/material/Step';
 import StepConnector, { stepConnectorClasses as classes } from '@mui/material/StepConnector';
diff --git a/packages/mui-material/src/StepContent/StepContent.test.js b/packages/mui-material/src/StepContent/StepContent.test.js
index 401e523b1fe00b..a6f8aa56581bbd 100644
--- a/packages/mui-material/src/StepContent/StepContent.test.js
+++ b/packages/mui-material/src/StepContent/StepContent.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { collapseClasses } from '@mui/material/Collapse';
 import Stepper from '@mui/material/Stepper';
 import Step from '@mui/material/Step';
diff --git a/packages/mui-material/src/StepIcon/StepIcon.test.js b/packages/mui-material/src/StepIcon/StepIcon.test.js
index 0bc49f279d115a..759c001e330d24 100644
--- a/packages/mui-material/src/StepIcon/StepIcon.test.js
+++ b/packages/mui-material/src/StepIcon/StepIcon.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import StepIcon, { stepIconClasses as classes } from '@mui/material/StepIcon';
 
 describe('<StepIcon />', () => {
diff --git a/packages/mui-material/src/StepLabel/StepLabel.test.js b/packages/mui-material/src/StepLabel/StepLabel.test.js
index fb00e634650b86..799d2f1b1d2f9e 100644
--- a/packages/mui-material/src/StepLabel/StepLabel.test.js
+++ b/packages/mui-material/src/StepLabel/StepLabel.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Typography from '@mui/material/Typography';
 import Stepper from '@mui/material/Stepper';
 import Step from '@mui/material/Step';
diff --git a/packages/mui-material/src/Stepper/Stepper.test.tsx b/packages/mui-material/src/Stepper/Stepper.test.tsx
index 17138c559727b3..d398d964d04ce7 100644
--- a/packages/mui-material/src/Stepper/Stepper.test.tsx
+++ b/packages/mui-material/src/Stepper/Stepper.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Step, { StepProps, stepClasses } from '@mui/material/Step';
 import StepLabel from '@mui/material/StepLabel';
 import StepConnector, { stepConnectorClasses } from '@mui/material/StepConnector';
diff --git a/packages/mui-material/src/SvgIcon/SvgIcon.test.js b/packages/mui-material/src/SvgIcon/SvgIcon.test.js
index 27211f44e6811c..9adff89d0b00bc 100644
--- a/packages/mui-material/src/SvgIcon/SvgIcon.test.js
+++ b/packages/mui-material/src/SvgIcon/SvgIcon.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import SvgIcon, { svgIconClasses as classes } from '@mui/material/SvgIcon';
 
 describe('<SvgIcon />', () => {
diff --git a/packages/mui-material/src/SwipeableDrawer/SwipeableDrawer.test.js b/packages/mui-material/src/SwipeableDrawer/SwipeableDrawer.test.js
index f0b537504d53cd..0fe3afcd6e7def 100644
--- a/packages/mui-material/src/SwipeableDrawer/SwipeableDrawer.test.js
+++ b/packages/mui-material/src/SwipeableDrawer/SwipeableDrawer.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { fireEvent, createRenderer, describeConformance, screen } from 'test/utils';
+import { fireEvent, createRenderer, describeConformance, screen } from '@mui-internal/test-utils';
 import PropTypes, { checkPropTypes } from 'prop-types';
 import SwipeableDrawer from '@mui/material/SwipeableDrawer';
 import Drawer, { drawerClasses } from '@mui/material/Drawer';
diff --git a/packages/mui-material/src/Switch/Switch.test.js b/packages/mui-material/src/Switch/Switch.test.js
index af1934d0459f1b..6d34c4a10aa098 100644
--- a/packages/mui-material/src/Switch/Switch.test.js
+++ b/packages/mui-material/src/Switch/Switch.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, act, createRenderer, fireEvent } from 'test/utils';
+import { describeConformance, act, createRenderer, fireEvent } from '@mui-internal/test-utils';
 import Switch, { switchClasses as classes } from '@mui/material/Switch';
 import FormControl from '@mui/material/FormControl';
 
diff --git a/packages/mui-material/src/Tab/Tab.test.js b/packages/mui-material/src/Tab/Tab.test.js
index b52f9dc1e7b66c..4aabc73afffd9c 100644
--- a/packages/mui-material/src/Tab/Tab.test.js
+++ b/packages/mui-material/src/Tab/Tab.test.js
@@ -1,7 +1,7 @@
 import { expect } from 'chai';
 import * as React from 'react';
 import { spy } from 'sinon';
-import { act, createRenderer, describeConformance, fireEvent } from 'test/utils';
+import { act, createRenderer, describeConformance, fireEvent } from '@mui-internal/test-utils';
 import Tab, { tabClasses as classes } from '@mui/material/Tab';
 import ButtonBase from '@mui/material/ButtonBase';
 
diff --git a/packages/mui-material/src/TabScrollButton/TabScrollButton.test.js b/packages/mui-material/src/TabScrollButton/TabScrollButton.test.js
index 5148ae68313fc1..00aa3b267dffc7 100644
--- a/packages/mui-material/src/TabScrollButton/TabScrollButton.test.js
+++ b/packages/mui-material/src/TabScrollButton/TabScrollButton.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import ArrowBackIcon from '@mui/icons-material/ArrowBack';
 import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
 import TabScrollButton, { tabScrollButtonClasses as classes } from '@mui/material/TabScrollButton';
diff --git a/packages/mui-material/src/Table/Table.test.js b/packages/mui-material/src/Table/Table.test.js
index 243748ef7c50fc..eeda37bc0b84bc 100644
--- a/packages/mui-material/src/Table/Table.test.js
+++ b/packages/mui-material/src/Table/Table.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Table, { tableClasses as classes } from '@mui/material/Table';
 import TableContext from './TableContext';
 
diff --git a/packages/mui-material/src/TableBody/TableBody.test.js b/packages/mui-material/src/TableBody/TableBody.test.js
index be1e4789899b8a..1cfeaf78f72d82 100644
--- a/packages/mui-material/src/TableBody/TableBody.test.js
+++ b/packages/mui-material/src/TableBody/TableBody.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TableBody, { tableBodyClasses as classes } from '@mui/material/TableBody';
 import Tablelvl2Context from '../Table/Tablelvl2Context';
 
diff --git a/packages/mui-material/src/TableCell/TableCell.test.js b/packages/mui-material/src/TableCell/TableCell.test.js
index 776ed9241ff7c6..ed27e168fb2944 100644
--- a/packages/mui-material/src/TableCell/TableCell.test.js
+++ b/packages/mui-material/src/TableCell/TableCell.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TableCell, { tableCellClasses as classes } from '@mui/material/TableCell';
 import TableHead from '@mui/material/TableHead';
 import TableRow from '@mui/material/TableRow';
diff --git a/packages/mui-material/src/TableContainer/TableContainer.test.js b/packages/mui-material/src/TableContainer/TableContainer.test.js
index 2c2f58b42d54d3..4d28809934c7b8 100644
--- a/packages/mui-material/src/TableContainer/TableContainer.test.js
+++ b/packages/mui-material/src/TableContainer/TableContainer.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TableContainer, { tableContainerClasses as classes } from '@mui/material/TableContainer';
 
 describe('<TableContainer />', () => {
diff --git a/packages/mui-material/src/TableFooter/TableFooter.test.js b/packages/mui-material/src/TableFooter/TableFooter.test.js
index 7a25ee32fb8ecf..7663e25c27f4df 100644
--- a/packages/mui-material/src/TableFooter/TableFooter.test.js
+++ b/packages/mui-material/src/TableFooter/TableFooter.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TableFooter, { tableFooterClasses as classes } from '@mui/material/TableFooter';
 import Tablelvl2Context from '../Table/Tablelvl2Context';
 
diff --git a/packages/mui-material/src/TableHead/TableHead.test.js b/packages/mui-material/src/TableHead/TableHead.test.js
index f24289d0411003..5a7203d1d8b08a 100644
--- a/packages/mui-material/src/TableHead/TableHead.test.js
+++ b/packages/mui-material/src/TableHead/TableHead.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TableHead, { tableHeadClasses as classes } from '@mui/material/TableHead';
 import Tablelvl2Context from '../Table/Tablelvl2Context';
 
diff --git a/packages/mui-material/src/TablePagination/TablePagination.test.js b/packages/mui-material/src/TablePagination/TablePagination.test.js
index 53a3f7969ce6b4..2e7fb24023e358 100644
--- a/packages/mui-material/src/TablePagination/TablePagination.test.js
+++ b/packages/mui-material/src/TablePagination/TablePagination.test.js
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import PropTypes from 'prop-types';
-import { describeConformance, fireEvent, createRenderer } from 'test/utils';
+import { describeConformance, fireEvent, createRenderer } from '@mui-internal/test-utils';
 import TableFooter from '@mui/material/TableFooter';
 import TableCell from '@mui/material/TableCell';
 import TableRow from '@mui/material/TableRow';
diff --git a/packages/mui-material/src/TableRow/TableRow.test.js b/packages/mui-material/src/TableRow/TableRow.test.js
index 0c19fb067d1169..8d1adea00bf799 100644
--- a/packages/mui-material/src/TableRow/TableRow.test.js
+++ b/packages/mui-material/src/TableRow/TableRow.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import TableRow, { tableRowClasses as classes } from '@mui/material/TableRow';
 
 describe('<TableRow />', () => {
diff --git a/packages/mui-material/src/TableSortLabel/TableSortLabel.test.js b/packages/mui-material/src/TableSortLabel/TableSortLabel.test.js
index 20eeb8326c71e4..74e4e0449a3f0e 100644
--- a/packages/mui-material/src/TableSortLabel/TableSortLabel.test.js
+++ b/packages/mui-material/src/TableSortLabel/TableSortLabel.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import SortIcon from '@mui/icons-material/Sort';
 import TableSortLabel, { tableSortLabelClasses as classes } from '@mui/material/TableSortLabel';
 import ButtonBase from '@mui/material/ButtonBase';
diff --git a/packages/mui-material/src/Tabs/ScrollbarSize.test.js b/packages/mui-material/src/Tabs/ScrollbarSize.test.js
index 261a636223a50b..eb6e6899303525 100644
--- a/packages/mui-material/src/Tabs/ScrollbarSize.test.js
+++ b/packages/mui-material/src/Tabs/ScrollbarSize.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy, stub } from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import ScrollbarSize from './ScrollbarSize';
 
 describe('<ScrollbarSize />', () => {
diff --git a/packages/mui-material/src/Tabs/Tabs.test.js b/packages/mui-material/src/Tabs/Tabs.test.js
index e6bf75b31c0801..da655ecff49149 100644
--- a/packages/mui-material/src/Tabs/Tabs.test.js
+++ b/packages/mui-material/src/Tabs/Tabs.test.js
@@ -9,7 +9,7 @@ import {
   screen,
   strictModeDoubleLoggingSuppressed,
   waitFor,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import ArrowBackIcon from '@mui/icons-material/ArrowBack';
 import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
 import Tab from '@mui/material/Tab';
diff --git a/packages/mui-material/src/TextField/TextField.test.js b/packages/mui-material/src/TextField/TextField.test.js
index b0910a0b22bbdb..a0cb54184e6d46 100644
--- a/packages/mui-material/src/TextField/TextField.test.js
+++ b/packages/mui-material/src/TextField/TextField.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, describeConformance, fireEvent } from 'test/utils';
+import { createRenderer, describeConformance, fireEvent } from '@mui-internal/test-utils';
 import FormControl from '@mui/material/FormControl';
 import { inputBaseClasses } from '@mui/material/InputBase';
 import MenuItem from '@mui/material/MenuItem';
diff --git a/packages/mui-material/src/ToggleButton/ToggleButton.test.js b/packages/mui-material/src/ToggleButton/ToggleButton.test.js
index d262aca1baa5b2..f0b11ae00b3842 100644
--- a/packages/mui-material/src/ToggleButton/ToggleButton.test.js
+++ b/packages/mui-material/src/ToggleButton/ToggleButton.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import ToggleButton, { toggleButtonClasses as classes } from '@mui/material/ToggleButton';
 import ButtonBase from '@mui/material/ButtonBase';
 
diff --git a/packages/mui-material/src/ToggleButtonGroup/ToggleButtonGroup.test.js b/packages/mui-material/src/ToggleButtonGroup/ToggleButtonGroup.test.js
index 37580b0bf8f5c1..a5e64d27e0a8c4 100644
--- a/packages/mui-material/src/ToggleButtonGroup/ToggleButtonGroup.test.js
+++ b/packages/mui-material/src/ToggleButtonGroup/ToggleButtonGroup.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, createRenderer, screen } from 'test/utils';
+import { describeConformance, createRenderer, screen } from '@mui-internal/test-utils';
 import ToggleButtonGroup, {
   toggleButtonGroupClasses as classes,
 } from '@mui/material/ToggleButtonGroup';
diff --git a/packages/mui-material/src/Toolbar/Toolbar.test.js b/packages/mui-material/src/Toolbar/Toolbar.test.js
index e47bb096b749c6..4c25e64e3ff726 100644
--- a/packages/mui-material/src/Toolbar/Toolbar.test.js
+++ b/packages/mui-material/src/Toolbar/Toolbar.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Toolbar, { toolbarClasses as classes } from '@mui/material/Toolbar';
 
 describe('<Toolbar />', () => {
diff --git a/packages/mui-material/src/Tooltip/Tooltip.test.js b/packages/mui-material/src/Tooltip/Tooltip.test.js
index ac548a591ca5a4..3449b13e53dd61 100644
--- a/packages/mui-material/src/Tooltip/Tooltip.test.js
+++ b/packages/mui-material/src/Tooltip/Tooltip.test.js
@@ -10,7 +10,7 @@ import {
   simulatePointerDevice,
   focusVisible,
   programmaticFocusTriggersFocusVisible,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import { camelCase } from 'lodash/string';
 import Tooltip, { tooltipClasses as classes } from '@mui/material/Tooltip';
 import { testReset } from './Tooltip';
diff --git a/packages/mui-material/src/Typography/Typography.test.js b/packages/mui-material/src/Typography/Typography.test.js
index e6877e3339bb57..99ac1bf1be7247 100644
--- a/packages/mui-material/src/Typography/Typography.test.js
+++ b/packages/mui-material/src/Typography/Typography.test.js
@@ -1,7 +1,7 @@
 // @ts-check
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Typography, { typographyClasses as classes } from '@mui/material/Typography';
 
 describe('<Typography />', () => {
diff --git a/packages/mui-material/src/Unstable_Grid2/Grid2.test.js b/packages/mui-material/src/Unstable_Grid2/Grid2.test.js
index 43ccba34d379b0..034a45b4145ab4 100644
--- a/packages/mui-material/src/Unstable_Grid2/Grid2.test.js
+++ b/packages/mui-material/src/Unstable_Grid2/Grid2.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import Grid2, { grid2Classes as classes } from '@mui/material/Unstable_Grid2';
 
 // The main tests are in mui-system Unstable_Grid folder
diff --git a/packages/mui-material/src/Zoom/Zoom.test.js b/packages/mui-material/src/Zoom/Zoom.test.js
index 13adbead2d08f5..78a1da94103b5c 100644
--- a/packages/mui-material/src/Zoom/Zoom.test.js
+++ b/packages/mui-material/src/Zoom/Zoom.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { Transition } from 'react-transition-group';
 import Zoom from '@mui/material/Zoom';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
diff --git a/packages/mui-material/src/internal/SwitchBase.test.js b/packages/mui-material/src/internal/SwitchBase.test.js
index f197f98ab76c42..a40e478f719c44 100644
--- a/packages/mui-material/src/internal/SwitchBase.test.js
+++ b/packages/mui-material/src/internal/SwitchBase.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { describeConformance, act, createRenderer } from 'test/utils';
+import { describeConformance, act, createRenderer } from '@mui-internal/test-utils';
 import SwitchBase from './SwitchBase';
 import FormControl, { useFormControl } from '../FormControl';
 import ButtonBase from '../ButtonBase';
diff --git a/packages/mui-material/src/styles/CssVarsProvider.test.js b/packages/mui-material/src/styles/CssVarsProvider.test.js
index b12643e48eb087..bb9c57846fa19d 100644
--- a/packages/mui-material/src/styles/CssVarsProvider.test.js
+++ b/packages/mui-material/src/styles/CssVarsProvider.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import Box from '@mui/material/Box';
 import { Experimental_CssVarsProvider as CssVarsProvider, useTheme } from '@mui/material/styles';
 
diff --git a/packages/mui-material/src/styles/ThemeProvider.test.tsx b/packages/mui-material/src/styles/ThemeProvider.test.tsx
index b69df12d8ac103..48833d7d5e93ce 100644
--- a/packages/mui-material/src/styles/ThemeProvider.test.tsx
+++ b/packages/mui-material/src/styles/ThemeProvider.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@mui/material/styles';
 
 describe('ThemeProvider', () => {
diff --git a/packages/mui-material/src/styles/createTheme.test.js b/packages/mui-material/src/styles/createTheme.test.js
index 4e780610185c2d..d9737b9a3c52e1 100644
--- a/packages/mui-material/src/styles/createTheme.test.js
+++ b/packages/mui-material/src/styles/createTheme.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import Button from '@mui/material/Button';
 import Box from '@mui/material/Box';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
diff --git a/packages/mui-material/src/styles/experimental_extendTheme.test.js b/packages/mui-material/src/styles/experimental_extendTheme.test.js
index 092a76ba8c910f..04b73a0f7eebd0 100644
--- a/packages/mui-material/src/styles/experimental_extendTheme.test.js
+++ b/packages/mui-material/src/styles/experimental_extendTheme.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import Button from '@mui/material/Button';
 import {
   Experimental_CssVarsProvider as CssVarsProvider,
diff --git a/packages/mui-material/src/styles/styled.test.js b/packages/mui-material/src/styles/styled.test.js
index a6e3f2d0b30600..3402325b32f36d 100644
--- a/packages/mui-material/src/styles/styled.test.js
+++ b/packages/mui-material/src/styles/styled.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import createTheme from './createTheme';
 import styled from './styled';
 import ThemeProvider from './ThemeProvider';
diff --git a/packages/mui-material/src/useMediaQuery/useMediaQuery.test.js b/packages/mui-material/src/useMediaQuery/useMediaQuery.test.js
index 2d29f806cb5126..d2f91a1822ab53 100644
--- a/packages/mui-material/src/useMediaQuery/useMediaQuery.test.js
+++ b/packages/mui-material/src/useMediaQuery/useMediaQuery.test.js
@@ -6,7 +6,7 @@ import {
   screen,
   RenderCounter,
   strictModeDoubleLoggingSuppressed,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import mediaQuery from 'css-mediaquery';
 import { expect } from 'chai';
 import { stub } from 'sinon';
diff --git a/packages/mui-material/src/usePagination/usePagination.test.js b/packages/mui-material/src/usePagination/usePagination.test.js
index 93ed65e2a43c03..993c0c157670c8 100644
--- a/packages/mui-material/src/usePagination/usePagination.test.js
+++ b/packages/mui-material/src/usePagination/usePagination.test.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { expect } from 'chai';
 import usePagination from '@mui/material/usePagination';
 
diff --git a/packages/mui-material/src/useScrollTrigger/useScrollTrigger.test.js b/packages/mui-material/src/useScrollTrigger/useScrollTrigger.test.js
index b1ff89955d8f6f..664ac0894181d2 100644
--- a/packages/mui-material/src/useScrollTrigger/useScrollTrigger.test.js
+++ b/packages/mui-material/src/useScrollTrigger/useScrollTrigger.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { expect } from 'chai';
-import { act, createRenderer, RenderCounter, screen } from 'test/utils';
+import { act, createRenderer, RenderCounter, screen } from '@mui-internal/test-utils';
 import useScrollTrigger from '@mui/material/useScrollTrigger';
 import Container from '@mui/material/Container';
 import Box from '@mui/material/Box';
diff --git a/packages/mui-material/test/integration/DialogIntegration.test.js b/packages/mui-material/test/integration/DialogIntegration.test.js
index 47f9b16f9a0ecd..aa0a013092dec2 100644
--- a/packages/mui-material/test/integration/DialogIntegration.test.js
+++ b/packages/mui-material/test/integration/DialogIntegration.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import Dialog from '@mui/material/Dialog';
 import DialogTitle from '@mui/material/DialogTitle';
 
diff --git a/packages/mui-material/test/integration/Menu.test.js b/packages/mui-material/test/integration/Menu.test.js
index f13e8c10fef95b..1f36ee815e6114 100644
--- a/packages/mui-material/test/integration/Menu.test.js
+++ b/packages/mui-material/test/integration/Menu.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { expect } from 'chai';
-import { act, createRenderer, fireEvent, screen } from 'test/utils';
+import { act, createRenderer, fireEvent, screen } from '@mui-internal/test-utils';
 import Button from '@mui/material/Button';
 import MenuItem from '@mui/material/MenuItem';
 import Menu from '@mui/material/Menu';
diff --git a/packages/mui-material/test/integration/MenuList.test.js b/packages/mui-material/test/integration/MenuList.test.js
index 9a5d7a4be63d27..ec2a3dc9535f81 100644
--- a/packages/mui-material/test/integration/MenuList.test.js
+++ b/packages/mui-material/test/integration/MenuList.test.js
@@ -7,7 +7,7 @@ import {
   fireEvent,
   screen,
   programmaticFocusTriggersFocusVisible,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import MenuList from '@mui/material/MenuList';
 import MenuItem from '@mui/material/MenuItem';
 import Divider from '@mui/material/Divider';
diff --git a/packages/mui-material/test/integration/NestedMenu.test.js b/packages/mui-material/test/integration/NestedMenu.test.js
index f85c631d547798..066971cbbab5f3 100644
--- a/packages/mui-material/test/integration/NestedMenu.test.js
+++ b/packages/mui-material/test/integration/NestedMenu.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, within } from 'test/utils';
+import { createRenderer, within } from '@mui-internal/test-utils';
 import Menu from '@mui/material/Menu';
 import MenuItem from '@mui/material/MenuItem';
 
diff --git a/packages/mui-material/test/integration/PopperChildrenLayout.test.js b/packages/mui-material/test/integration/PopperChildrenLayout.test.js
index 9dca88ea85f718..a9c6bfad6a270c 100644
--- a/packages/mui-material/test/integration/PopperChildrenLayout.test.js
+++ b/packages/mui-material/test/integration/PopperChildrenLayout.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import Collapse from '@mui/material/Collapse';
 import Fade from '@mui/material/Fade';
 import Grow from '@mui/material/Grow';
diff --git a/packages/mui-material/test/integration/Select.test.js b/packages/mui-material/test/integration/Select.test.js
index 5c84179b168a7e..446fbb4671b2fc 100644
--- a/packages/mui-material/test/integration/Select.test.js
+++ b/packages/mui-material/test/integration/Select.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { act, createRenderer, fireEvent } from 'test/utils';
+import { act, createRenderer, fireEvent } from '@mui-internal/test-utils';
 import MenuItem from '@mui/material/MenuItem';
 import Select from '@mui/material/Select';
 import Dialog from '@mui/material/Dialog';
diff --git a/packages/mui-material/test/integration/TableCell.test.js b/packages/mui-material/test/integration/TableCell.test.js
index 6d1007ed6cceb7..17438f10e3a913 100644
--- a/packages/mui-material/test/integration/TableCell.test.js
+++ b/packages/mui-material/test/integration/TableCell.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import TableCell, { tableCellClasses as classes } from '@mui/material/TableCell';
 import Table from '@mui/material/Table';
 import TableFooter from '@mui/material/TableFooter';
diff --git a/packages/mui-material/test/integration/TableRow.test.js b/packages/mui-material/test/integration/TableRow.test.js
index 83f9dc6c9c4a75..dafad88ead09cf 100644
--- a/packages/mui-material/test/integration/TableRow.test.js
+++ b/packages/mui-material/test/integration/TableRow.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import TableFooter from '@mui/material/TableFooter';
 import TableHead from '@mui/material/TableHead';
 import TableRow, { tableRowClasses as classes } from '@mui/material/TableRow';
diff --git a/packages/mui-private-theming/package.json b/packages/mui-private-theming/package.json
index 3f70281417298b..e71b691c577266 100644
--- a/packages/mui-private-theming/package.json
+++ b/packages/mui-private-theming/package.json
@@ -46,11 +46,11 @@
     "@mui/material": "^5.14.10",
     "@mui/styles": "^5.14.10",
     "@mui/types": "^7.2.4",
+    "@mui-internal/test-utils": "^1.0.0",
     "@types/chai": "^4.3.6",
     "@types/react": "^18.2.21",
     "chai": "^4.3.8",
-    "react": "^18.2.0",
-    "test": "^5.0.0"
+    "react": "^18.2.0"
   },
   "peerDependencies": {
     "@types/react": "^17.0.0 || ^18.0.0",
diff --git a/packages/mui-private-theming/src/ThemeProvider/ThemeProvider.test.js b/packages/mui-private-theming/src/ThemeProvider/ThemeProvider.test.js
index de0fe0cb55e789..2ad69ef6db96d8 100644
--- a/packages/mui-private-theming/src/ThemeProvider/ThemeProvider.test.js
+++ b/packages/mui-private-theming/src/ThemeProvider/ThemeProvider.test.js
@@ -1,6 +1,10 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, RenderCounter, strictModeDoubleLoggingSuppressed } from 'test/utils';
+import {
+  createRenderer,
+  RenderCounter,
+  strictModeDoubleLoggingSuppressed,
+} from '@mui-internal/test-utils';
 import useTheme from '../useTheme';
 import ThemeProvider from './ThemeProvider';
 
diff --git a/packages/mui-private-theming/src/useTheme/useTheme.test.js b/packages/mui-private-theming/src/useTheme/useTheme.test.js
index 27ef06f7615e5c..77c28631d0aa8e 100644
--- a/packages/mui-private-theming/src/useTheme/useTheme.test.js
+++ b/packages/mui-private-theming/src/useTheme/useTheme.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import useTheme from './useTheme';
 import ThemeProvider from '../ThemeProvider';
 
diff --git a/packages/mui-styled-engine-sc/package.json b/packages/mui-styled-engine-sc/package.json
index 5dff03ced01dd3..62b0126d565b4c 100644
--- a/packages/mui-styled-engine-sc/package.json
+++ b/packages/mui-styled-engine-sc/package.json
@@ -43,13 +43,13 @@
     "prop-types": "^15.8.1"
   },
   "devDependencies": {
+    "@mui-internal/test-utils": "^1.0.0",
     "@types/chai": "^4.3.6",
     "@types/react": "^18.2.21",
     "@types/styled-components": "^5.1.27",
     "chai": "^4.3.8",
     "react": "^18.2.0",
-    "styled-components": "^5.3.11",
-    "test": "^5.0.0"
+    "styled-components": "^5.3.11"
   },
   "peerDependencies": {
     "@types/styled-components": "^5.1.14",
diff --git a/packages/mui-styled-engine-sc/src/GlobalStyles/GlobalStyles.test.js b/packages/mui-styled-engine-sc/src/GlobalStyles/GlobalStyles.test.js
index d656f98c4bbc0b..a5c48b4d8cfd44 100644
--- a/packages/mui-styled-engine-sc/src/GlobalStyles/GlobalStyles.test.js
+++ b/packages/mui-styled-engine-sc/src/GlobalStyles/GlobalStyles.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from 'styled-components';
 import styled from '..';
 import GlobalStyles from './GlobalStyles';
diff --git a/packages/mui-styled-engine-sc/src/styled.test.js b/packages/mui-styled-engine-sc/src/styled.test.js
index 959fb6a518d91b..22d16ba1fe1bf7 100644
--- a/packages/mui-styled-engine-sc/src/styled.test.js
+++ b/packages/mui-styled-engine-sc/src/styled.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import styled from '@mui/styled-engine-sc';
 
 describe('styled', () => {
diff --git a/packages/mui-styled-engine/package.json b/packages/mui-styled-engine/package.json
index fea8ebfc87b44e..d6cc1b96383028 100644
--- a/packages/mui-styled-engine/package.json
+++ b/packages/mui-styled-engine/package.json
@@ -46,11 +46,11 @@
   "devDependencies": {
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
+    "@mui-internal/test-utils": "^1.0.0",
     "@types/chai": "^4.3.6",
     "@types/react": "^18.2.21",
     "chai": "^4.3.8",
-    "react": "^18.2.0",
-    "test": "^5.0.0"
+    "react": "^18.2.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.4.1",
diff --git a/packages/mui-styled-engine/src/GlobalStyles/GlobalStyles.test.js b/packages/mui-styled-engine/src/GlobalStyles/GlobalStyles.test.js
index 16ab9cb96c92ba..8febe0855b8ded 100644
--- a/packages/mui-styled-engine/src/GlobalStyles/GlobalStyles.test.js
+++ b/packages/mui-styled-engine/src/GlobalStyles/GlobalStyles.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { ThemeProvider } from '@emotion/react';
 import styled from '..';
 import GlobalStyles from './GlobalStyles';
diff --git a/packages/mui-styles/package.json b/packages/mui-styles/package.json
index 62f8e39ed49943..70d0b9b68e4900 100644
--- a/packages/mui-styles/package.json
+++ b/packages/mui-styles/package.json
@@ -59,6 +59,7 @@
   "devDependencies": {
     "@mui/joy": "5.0.0-beta.7",
     "@mui/material": "^5.14.10",
+    "@mui-internal/test-utils": "^1.0.0",
     "@types/chai": "^4.3.6",
     "@types/react": "^18.2.21",
     "@types/react-dom": "^18.2.7",
@@ -66,8 +67,7 @@
     "chai": "^4.3.8",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "sinon": "^15.2.0",
-    "test": "^5.0.0"
+    "sinon": "^15.2.0"
   },
   "peerDependencies": {
     "@types/react": "^17.0.0 || ^18.0.0",
diff --git a/packages/mui-styles/src/StylesProvider/StylesProvider.test.js b/packages/mui-styles/src/StylesProvider/StylesProvider.test.js
index b278c8a1855901..0c9945949a95ce 100644
--- a/packages/mui-styles/src/StylesProvider/StylesProvider.test.js
+++ b/packages/mui-styles/src/StylesProvider/StylesProvider.test.js
@@ -2,7 +2,7 @@ import * as React from 'react';
 import * as ReactDOMServer from 'react-dom/server';
 import { expect } from 'chai';
 import { create, SheetsRegistry } from 'jss';
-import { createMount, strictModeDoubleLoggingSuppressed } from 'test/utils';
+import { createMount, strictModeDoubleLoggingSuppressed } from '@mui-internal/test-utils';
 import StylesProvider, { StylesContext } from './StylesProvider';
 import makeStyles from '../makeStyles';
 import createGenerateClassName from '../createGenerateClassName';
diff --git a/packages/mui-styles/src/ThemeProvider/ThemeProvider.test.js b/packages/mui-styles/src/ThemeProvider/ThemeProvider.test.js
index 8cbf9005935046..862ed5ffc1de7f 100644
--- a/packages/mui-styles/src/ThemeProvider/ThemeProvider.test.js
+++ b/packages/mui-styles/src/ThemeProvider/ThemeProvider.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import ThemeProvider from '@mui/private-theming/ThemeProvider';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import makeStyles from '../makeStyles';
 
 describe('ThemeProvider', () => {
diff --git a/packages/mui-styles/src/makeStyles/makeStyles.test.js b/packages/mui-styles/src/makeStyles/makeStyles.test.js
index 4e944c9220457d..7cddc8825c46d3 100644
--- a/packages/mui-styles/src/makeStyles/makeStyles.test.js
+++ b/packages/mui-styles/src/makeStyles/makeStyles.test.js
@@ -3,7 +3,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { SheetsRegistry } from 'jss';
 import { act } from 'react-dom/test-utils';
-import { createMount } from 'test/utils';
+import { createMount } from '@mui-internal/test-utils';
 import { createTheme } from '@mui/material/styles';
 import createGenerateClassName from '../createGenerateClassName';
 import makeStyles from './makeStyles';
diff --git a/packages/mui-styles/src/styled/styled.test.js b/packages/mui-styles/src/styled/styled.test.js
index ba90b28075d43d..ab34d9c4406612 100644
--- a/packages/mui-styles/src/styled/styled.test.js
+++ b/packages/mui-styles/src/styled/styled.test.js
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { expect } from 'chai';
 import PropTypes from 'prop-types';
 import { SheetsRegistry } from 'jss';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import { createGenerateClassName } from '@mui/styles';
 import styled from './styled';
 import StylesProvider from '../StylesProvider';
diff --git a/packages/mui-styles/src/useThemeVariants/useThemeVariants.test.js b/packages/mui-styles/src/useThemeVariants/useThemeVariants.test.js
index 14fd15850a9d0c..5773f098072cc2 100644
--- a/packages/mui-styles/src/useThemeVariants/useThemeVariants.test.js
+++ b/packages/mui-styles/src/useThemeVariants/useThemeVariants.test.js
@@ -1,6 +1,10 @@
 import { expect } from 'chai';
 import * as React from 'react';
-import { createRenderer, screen, strictModeDoubleLoggingSuppressed } from 'test/utils';
+import {
+  createRenderer,
+  screen,
+  strictModeDoubleLoggingSuppressed,
+} from '@mui-internal/test-utils';
 import { createTheme } from '@mui/material/styles';
 import ThemeProvider from '../ThemeProvider';
 import useThemeVariants from './useThemeVariants';
diff --git a/packages/mui-styles/src/withStyles/withStyles.test.js b/packages/mui-styles/src/withStyles/withStyles.test.js
index 7dd4d0f8dc6a70..f739276ae56d0d 100644
--- a/packages/mui-styles/src/withStyles/withStyles.test.js
+++ b/packages/mui-styles/src/withStyles/withStyles.test.js
@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import { stub } from 'sinon';
 import { SheetsRegistry } from 'jss';
 import Input from '@mui/material/Input';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import { isMuiElement } from '@mui/material/utils';
 import { createTheme } from '@mui/material/styles';
 import StylesProvider from '../StylesProvider';
diff --git a/packages/mui-styles/src/withTheme/withTheme.test.js b/packages/mui-styles/src/withTheme/withTheme.test.js
index 3f37b145a52713..44a200075daf2d 100644
--- a/packages/mui-styles/src/withTheme/withTheme.test.js
+++ b/packages/mui-styles/src/withTheme/withTheme.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import Input from '@mui/material/Input';
 import { isMuiElement } from '@mui/material/utils';
 import PropTypes from 'prop-types';
diff --git a/packages/mui-styles/test/theme-scoping.test.tsx b/packages/mui-styles/test/theme-scoping.test.tsx
index 66b747b7baba57..36338e944fdaf7 100644
--- a/packages/mui-styles/test/theme-scoping.test.tsx
+++ b/packages/mui-styles/test/theme-scoping.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import * as material from '@mui/material/styles';
 import * as joy from '@mui/joy/styles';
 import { makeStyles } from '@mui/styles';
diff --git a/packages/mui-system/package.json b/packages/mui-system/package.json
index 2921ffe31ce1c8..996d2c14e6ed35 100644
--- a/packages/mui-system/package.json
+++ b/packages/mui-system/package.json
@@ -55,6 +55,7 @@
     "@mui/joy": "5.0.0-beta.7",
     "@mui/material": "^5.14.10",
     "@mui/material-next": "6.0.0-alpha.102",
+    "@mui-internal/test-utils": "^1.0.0",
     "@types/chai": "^4.3.6",
     "@types/prop-types": "^15.7.5",
     "@types/react": "^18.2.21",
@@ -65,8 +66,7 @@
     "lodash": "^4.17.21",
     "react": "^18.2.0",
     "sinon": "^15.2.0",
-    "styled-components": "^5.3.11",
-    "test": "^5.0.0"
+    "styled-components": "^5.3.11"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",
diff --git a/packages/mui-system/src/Box/Box.test.js b/packages/mui-system/src/Box/Box.test.js
index 0b1808815bd89e..c90d86f4aa74a8 100644
--- a/packages/mui-system/src/Box/Box.test.js
+++ b/packages/mui-system/src/Box/Box.test.js
@@ -1,7 +1,7 @@
 /* eslint-disable material-ui/no-empty-box */
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import { Box, createTheme, ThemeProvider } from '@mui/system';
 
 describe('<Box />', () => {
diff --git a/packages/mui-system/src/Container/Container.test.js b/packages/mui-system/src/Container/Container.test.js
index a9ec4a3880bb7f..66b70b2dca95b3 100644
--- a/packages/mui-system/src/Container/Container.test.js
+++ b/packages/mui-system/src/Container/Container.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer } from 'test/utils';
+import { describeConformance, createRenderer } from '@mui-internal/test-utils';
 import { Container, containerClasses as classes } from '@mui/system';
 
 describe('<Container />', () => {
diff --git a/packages/mui-system/src/GlobalStyles/GlobalStyles.test.tsx b/packages/mui-system/src/GlobalStyles/GlobalStyles.test.tsx
index fd278973209831..17178436fcdee9 100644
--- a/packages/mui-system/src/GlobalStyles/GlobalStyles.test.tsx
+++ b/packages/mui-system/src/GlobalStyles/GlobalStyles.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { GlobalStyles } from '@mui/system';
 
 describe('<GlobalStyles />', () => {
diff --git a/packages/mui-system/src/Stack/Stack.test.js b/packages/mui-system/src/Stack/Stack.test.js
index 355c90e820e959..7e190c6d1703f2 100644
--- a/packages/mui-system/src/Stack/Stack.test.js
+++ b/packages/mui-system/src/Stack/Stack.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, describeConformance } from 'test/utils';
+import { createRenderer, describeConformance } from '@mui-internal/test-utils';
 import Stack from '@mui/system/Stack';
 import { createTheme } from '@mui/system';
 import { style } from './createStack';
diff --git a/packages/mui-system/src/ThemeProvider/ThemeProvider.test.js b/packages/mui-system/src/ThemeProvider/ThemeProvider.test.js
index ccddf5420e9c6e..febe6050490f54 100644
--- a/packages/mui-system/src/ThemeProvider/ThemeProvider.test.js
+++ b/packages/mui-system/src/ThemeProvider/ThemeProvider.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { useTheme as usePrivateTheme } from '@mui/private-theming';
 import { ThemeContext } from '@mui/styled-engine';
 import { ThemeProvider } from '@mui/system';
diff --git a/packages/mui-system/src/Unstable_Grid/Grid.test.js b/packages/mui-system/src/Unstable_Grid/Grid.test.js
index b9f706a530362b..6e6d9094a9cd97 100644
--- a/packages/mui-system/src/Unstable_Grid/Grid.test.js
+++ b/packages/mui-system/src/Unstable_Grid/Grid.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { describeConformance, createRenderer, screen } from 'test/utils';
+import { describeConformance, createRenderer, screen } from '@mui-internal/test-utils';
 import { ThemeProvider, createTheme } from '@mui/system';
 import Grid, { gridClasses as classes } from '@mui/system/Unstable_Grid';
 
diff --git a/packages/mui-system/src/createBox.test.js b/packages/mui-system/src/createBox.test.js
index 4236ac39da8b6d..12449e27112b5a 100644
--- a/packages/mui-system/src/createBox.test.js
+++ b/packages/mui-system/src/createBox.test.js
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { createBox, ThemeProvider } from '@mui/system';
 
 describe('createBox', () => {
diff --git a/packages/mui-system/src/createStyled.test.js b/packages/mui-system/src/createStyled.test.js
index 87f57efe543645..c03c503374db88 100644
--- a/packages/mui-system/src/createStyled.test.js
+++ b/packages/mui-system/src/createStyled.test.js
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import createStyled from './createStyled';
 
 describe('createStyled', () => {
diff --git a/packages/mui-system/src/createTheme/createTheme.test.js b/packages/mui-system/src/createTheme/createTheme.test.js
index c86c8911ccae13..9393292b1eb666 100644
--- a/packages/mui-system/src/createTheme/createTheme.test.js
+++ b/packages/mui-system/src/createTheme/createTheme.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { createTheme, styled, ThemeProvider } from '@mui/system';
 
 describe('createTheme', () => {
diff --git a/packages/mui-system/src/cssVars/createCssVarsProvider.test.js b/packages/mui-system/src/cssVars/createCssVarsProvider.test.js
index c51e7207031427..85f2c04d76b637 100644
--- a/packages/mui-system/src/cssVars/createCssVarsProvider.test.js
+++ b/packages/mui-system/src/cssVars/createCssVarsProvider.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, screen, fireEvent } from 'test/utils';
+import { createRenderer, screen, fireEvent } from '@mui-internal/test-utils';
 import createCssVarsTheme from './createCssVarsTheme';
 import createCssVarsProvider, { DISABLE_CSS_TRANSITION } from './createCssVarsProvider';
 import { DEFAULT_ATTRIBUTE, DEFAULT_MODE_STORAGE_KEY } from './getInitColorSchemeScript';
diff --git a/packages/mui-system/src/cssVars/getInitColorSchemeScript.test.js b/packages/mui-system/src/cssVars/getInitColorSchemeScript.test.js
index 28e8ba980a3dca..8340db5c31bbda 100644
--- a/packages/mui-system/src/cssVars/getInitColorSchemeScript.test.js
+++ b/packages/mui-system/src/cssVars/getInitColorSchemeScript.test.js
@@ -1,6 +1,6 @@
 /* eslint-disable no-eval */
 import { expect } from 'chai';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import getInitColorSchemeScript, {
   DEFAULT_ATTRIBUTE,
   DEFAULT_MODE_STORAGE_KEY,
diff --git a/packages/mui-system/src/cssVars/useCurrentColorScheme.test.js b/packages/mui-system/src/cssVars/useCurrentColorScheme.test.js
index 92ca222b75d294..ee1e91e56188d0 100644
--- a/packages/mui-system/src/cssVars/useCurrentColorScheme.test.js
+++ b/packages/mui-system/src/cssVars/useCurrentColorScheme.test.js
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer, fireEvent, act, screen } from 'test/utils';
+import { createRenderer, fireEvent, act, screen } from '@mui-internal/test-utils';
 import {
   DEFAULT_MODE_STORAGE_KEY,
   DEFAULT_COLOR_SCHEME_STORAGE_KEY,
diff --git a/packages/mui-system/src/styled.test.js b/packages/mui-system/src/styled.test.js
index 995c4a7fabe95c..a2d5b82a2d8fc1 100644
--- a/packages/mui-system/src/styled.test.js
+++ b/packages/mui-system/src/styled.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import { styled, createTheme, ThemeProvider } from '@mui/system';
 
 describe('styled', () => {
diff --git a/packages/mui-system/test/integration/theme-scoping.test.tsx b/packages/mui-system/test/integration/theme-scoping.test.tsx
index b1b6384850c730..bc3e1d3a69295d 100644
--- a/packages/mui-system/test/integration/theme-scoping.test.tsx
+++ b/packages/mui-system/test/integration/theme-scoping.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { expect } from 'chai';
 import { spy } from 'sinon';
-import { createRenderer } from 'test/utils';
+import { createRenderer } from '@mui-internal/test-utils';
 import { ThemeContext } from '@mui/styled-engine';
 import * as material from '@mui/material';
 import * as joy from '@mui/joy';
diff --git a/packages/mui-utils/package.json b/packages/mui-utils/package.json
index 95263976f2126b..94a3fe7261bf20 100644
--- a/packages/mui-utils/package.json
+++ b/packages/mui-utils/package.json
@@ -47,6 +47,7 @@
   "devDependencies": {
     "@babel/helper-module-imports": "^7.22.15",
     "@mui/types": "^7.2.4",
+    "@mui-internal/test-utils": "^1.0.0",
     "@types/babel-plugin-macros": "^3.1.1",
     "@types/chai": "^4.3.6",
     "@types/mocha": "^10.0.1",
@@ -60,8 +61,7 @@
     "chai": "^4.3.8",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "sinon": "^15.2.0",
-    "test": "^5.0.0"
+    "sinon": "^15.2.0"
   },
   "peerDependencies": {
     "@types/react": "^17.0.0 || ^18.0.0",
diff --git a/packages/mui-utils/src/useControlled/useControlled.test.js b/packages/mui-utils/src/useControlled/useControlled.test.js
index 0da2ceb0eddeb7..7319349f7343bb 100644
--- a/packages/mui-utils/src/useControlled/useControlled.test.js
+++ b/packages/mui-utils/src/useControlled/useControlled.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { act, createRenderer } from 'test/utils';
+import { act, createRenderer } from '@mui-internal/test-utils';
 import useControlled from './useControlled';
 
 const TestComponent = ({ value: valueProp, defaultValue, children }) => {
diff --git a/packages/mui-utils/src/useForkRef/useForkRef.test.js b/packages/mui-utils/src/useForkRef/useForkRef.test.js
index c15179247a409b..57a7290a635b48 100644
--- a/packages/mui-utils/src/useForkRef/useForkRef.test.js
+++ b/packages/mui-utils/src/useForkRef/useForkRef.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import useForkRef from './useForkRef';
 
 describe('useForkRef', () => {
diff --git a/packages/mui-utils/src/useId/useId.test.js b/packages/mui-utils/src/useId/useId.test.js
index ec238bdfaf932b..2d74f5eb00008a 100644
--- a/packages/mui-utils/src/useId/useId.test.js
+++ b/packages/mui-utils/src/useId/useId.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createRenderer, screen } from 'test/utils';
+import { createRenderer, screen } from '@mui-internal/test-utils';
 import useId from './useId';
 
 describe('useId', () => {
diff --git a/packages/mui-utils/src/useIsFocusVisible.test.js b/packages/mui-utils/src/useIsFocusVisible.test.js
index 52974ed1e1f941..d8b4751b3495e1 100644
--- a/packages/mui-utils/src/useIsFocusVisible.test.js
+++ b/packages/mui-utils/src/useIsFocusVisible.test.js
@@ -7,7 +7,7 @@ import {
   focusVisible,
   simulatePointerDevice,
   programmaticFocusTriggersFocusVisible,
-} from 'test/utils';
+} from '@mui-internal/test-utils';
 import useIsFocusVisible, { teardown as teardownFocusVisible } from './useIsFocusVisible';
 import useForkRef from './useForkRef';
 
diff --git a/packages/mui-utils/tsconfig.json b/packages/mui-utils/tsconfig.json
index e7d248754c9c1c..88c4875ab6e81e 100644
--- a/packages/mui-utils/tsconfig.json
+++ b/packages/mui-utils/tsconfig.json
@@ -3,5 +3,5 @@
   "compilerOptions": {
     "types": ["react", "mocha", "node"]
   },
-  "include": ["src/**/*", "../../test/utils/initMatchers.ts"]
+  "include": ["src/**/*"]
 }
diff --git a/packages/test-utils/package.json b/packages/test-utils/package.json
new file mode 100644
index 00000000000000..77b5a42aa405bc
--- /dev/null
+++ b/packages/test-utils/package.json
@@ -0,0 +1,59 @@
+{
+  "name": "@mui-internal/test-utils",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "typescript": "tsc -p tsconfig.json"
+  },
+  "main": "src/index.ts",
+  "exports": {
+    ".": "./src/index.ts",
+    "./init": "./src/init.js",
+    "./initMatchers": "./src/initMatchers.ts",
+    "./initPlaywrightMatchers": "./src/initPlaywrightMatchers.ts",
+    "./KarmaReporterReactProfiler": "./src/KarmaReporterReactProfiler.js",
+    "./setupBabel": "./src/setupBabel.js",
+    "./setupBabelPlaywright": "./src/setupBabelPlaywright.js",
+    "./setupJSDOM": "./src/setupJSDOM.js",
+    "./setupKarma": "./src/setupKarma.js"
+  },
+  "dependencies": {
+    "@babel/plugin-transform-modules-commonjs": "^7.22.15",
+    "@babel/preset-typescript": "^7.22.15",
+    "@babel/register": "^7.22.15",
+    "@emotion/cache": "^11.11.0",
+    "@emotion/react": "^11.11.1",
+    "@mnajdova/enzyme-adapter-react-18": "^0.2.0",
+    "@testing-library/dom": "^9.3.1",
+    "@testing-library/react": "^14.0.0",
+    "chai": "^4.3.7",
+    "chai-dom": "^1.11.0",
+    "dom-accessibility-api": "^0.6.1",
+    "enzyme": "^3.11.0",
+    "format-util": "^1.0.5",
+    "fs-extra": "^11.1.1",
+    "jsdom": "^22.1.0",
+    "lodash": "^4.17.21",
+    "mocha": "^10.2.0",
+    "playwright": "^1.37.1",
+    "prop-types": "^15.8.1",
+    "react-test-renderer": "^18.2.0",
+    "sinon": "^15.2.0"
+  },
+  "devDependencies": {
+    "@types/chai": "^4.3.5",
+    "@types/chai-dom": "^1.11.1",
+    "@types/enzyme": "^3.10.13",
+    "@types/format-util": "^1.0.2",
+    "@types/prop-types": "^15.7.5",
+    "@types/react": "^18.2.21",
+    "@types/react-dom": "^18.2.7",
+    "@types/react-test-renderer": "^18.0.1",
+    "@types/sinon": "^10.0.16",
+    "typescript": "^5.1.6"
+  },
+  "peerDependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  }
+}
diff --git a/test/utils/KarmaReporterReactProfiler.js b/packages/test-utils/src/KarmaReporterReactProfiler.js
similarity index 100%
rename from test/utils/KarmaReporterReactProfiler.js
rename to packages/test-utils/src/KarmaReporterReactProfiler.js
diff --git a/test/utils/components.tsx b/packages/test-utils/src/components.tsx
similarity index 100%
rename from test/utils/components.tsx
rename to packages/test-utils/src/components.tsx
diff --git a/test/utils/createDOM.d.ts b/packages/test-utils/src/createDOM.d.ts
similarity index 100%
rename from test/utils/createDOM.d.ts
rename to packages/test-utils/src/createDOM.d.ts
diff --git a/test/utils/createDOM.js b/packages/test-utils/src/createDOM.js
similarity index 100%
rename from test/utils/createDOM.js
rename to packages/test-utils/src/createDOM.js
diff --git a/test/utils/createDescribe.ts b/packages/test-utils/src/createDescribe.ts
similarity index 100%
rename from test/utils/createDescribe.ts
rename to packages/test-utils/src/createDescribe.ts
diff --git a/test/utils/createMount.tsx b/packages/test-utils/src/createMount.tsx
similarity index 100%
rename from test/utils/createMount.tsx
rename to packages/test-utils/src/createMount.tsx
diff --git a/test/utils/createRenderer.test.js b/packages/test-utils/src/createRenderer.test.js
similarity index 100%
rename from test/utils/createRenderer.test.js
rename to packages/test-utils/src/createRenderer.test.js
diff --git a/test/utils/createRenderer.tsx b/packages/test-utils/src/createRenderer.tsx
similarity index 100%
rename from test/utils/createRenderer.tsx
rename to packages/test-utils/src/createRenderer.tsx
diff --git a/test/utils/describeConformance.tsx b/packages/test-utils/src/describeConformance.tsx
similarity index 100%
rename from test/utils/describeConformance.tsx
rename to packages/test-utils/src/describeConformance.tsx
diff --git a/test/utils/describeConformanceUnstyled.tsx b/packages/test-utils/src/describeConformanceUnstyled.tsx
similarity index 100%
rename from test/utils/describeConformanceUnstyled.tsx
rename to packages/test-utils/src/describeConformanceUnstyled.tsx
diff --git a/test/utils/describeJoyColorInversion.tsx b/packages/test-utils/src/describeJoyColorInversion.tsx
similarity index 100%
rename from test/utils/describeJoyColorInversion.tsx
rename to packages/test-utils/src/describeJoyColorInversion.tsx
diff --git a/test/utils/findOutermostIntrinsic.test.js b/packages/test-utils/src/findOutermostIntrinsic.test.js
similarity index 97%
rename from test/utils/findOutermostIntrinsic.test.js
rename to packages/test-utils/src/findOutermostIntrinsic.test.js
index 1e116d779051a3..f5d9b21e4c6cb6 100644
--- a/test/utils/findOutermostIntrinsic.test.js
+++ b/packages/test-utils/src/findOutermostIntrinsic.test.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { expect } from 'chai';
-import { createMount } from 'test/utils';
+import createMount from './createMount';
 import findOutermostIntrinsic from './findOutermostIntrinsic';
 
 describe('findOutermostIntrinsic', () => {
diff --git a/test/utils/findOutermostIntrinsic.ts b/packages/test-utils/src/findOutermostIntrinsic.ts
similarity index 100%
rename from test/utils/findOutermostIntrinsic.ts
rename to packages/test-utils/src/findOutermostIntrinsic.ts
diff --git a/test/utils/fireDiscreteEvent.ts b/packages/test-utils/src/fireDiscreteEvent.ts
similarity index 100%
rename from test/utils/fireDiscreteEvent.ts
rename to packages/test-utils/src/fireDiscreteEvent.ts
diff --git a/test/utils/focusVisible.ts b/packages/test-utils/src/focusVisible.ts
similarity index 100%
rename from test/utils/focusVisible.ts
rename to packages/test-utils/src/focusVisible.ts
diff --git a/test/utils/index.ts b/packages/test-utils/src/index.ts
similarity index 100%
rename from test/utils/index.ts
rename to packages/test-utils/src/index.ts
diff --git a/test/utils/init.js b/packages/test-utils/src/init.js
similarity index 100%
rename from test/utils/init.js
rename to packages/test-utils/src/init.js
diff --git a/test/utils/initMatchers.test.js b/packages/test-utils/src/initMatchers.test.js
similarity index 100%
rename from test/utils/initMatchers.test.js
rename to packages/test-utils/src/initMatchers.test.js
diff --git a/test/utils/initMatchers.ts b/packages/test-utils/src/initMatchers.ts
similarity index 100%
rename from test/utils/initMatchers.ts
rename to packages/test-utils/src/initMatchers.ts
diff --git a/test/utils/initPlaywrightMatchers.ts b/packages/test-utils/src/initPlaywrightMatchers.ts
similarity index 100%
rename from test/utils/initPlaywrightMatchers.ts
rename to packages/test-utils/src/initPlaywrightMatchers.ts
diff --git a/test/utils/mochaHooks.js b/packages/test-utils/src/mochaHooks.js
similarity index 100%
rename from test/utils/mochaHooks.js
rename to packages/test-utils/src/mochaHooks.js
diff --git a/test/utils/mochaHooks.test.js b/packages/test-utils/src/mochaHooks.test.js
similarity index 100%
rename from test/utils/mochaHooks.test.js
rename to packages/test-utils/src/mochaHooks.test.js
diff --git a/test/utils/setup.js b/packages/test-utils/src/setup.js
similarity index 100%
rename from test/utils/setup.js
rename to packages/test-utils/src/setup.js
diff --git a/test/utils/setupBabel.js b/packages/test-utils/src/setupBabel.js
similarity index 100%
rename from test/utils/setupBabel.js
rename to packages/test-utils/src/setupBabel.js
diff --git a/test/utils/setupBabelPlaywright.js b/packages/test-utils/src/setupBabelPlaywright.js
similarity index 100%
rename from test/utils/setupBabelPlaywright.js
rename to packages/test-utils/src/setupBabelPlaywright.js
diff --git a/test/utils/setupJSDOM.js b/packages/test-utils/src/setupJSDOM.js
similarity index 100%
rename from test/utils/setupJSDOM.js
rename to packages/test-utils/src/setupJSDOM.js
diff --git a/test/utils/setupKarma.js b/packages/test-utils/src/setupKarma.js
similarity index 100%
rename from test/utils/setupKarma.js
rename to packages/test-utils/src/setupKarma.js
diff --git a/test/utils/until.js b/packages/test-utils/src/until.js
similarity index 100%
rename from test/utils/until.js
rename to packages/test-utils/src/until.js
diff --git a/test/utils/until.test.js b/packages/test-utils/src/until.test.js
similarity index 100%
rename from test/utils/until.test.js
rename to packages/test-utils/src/until.test.js
diff --git a/test/utils/userEvent.ts b/packages/test-utils/src/userEvent.ts
similarity index 100%
rename from test/utils/userEvent.ts
rename to packages/test-utils/src/userEvent.ts
diff --git a/packages/test-utils/tsconfig.json b/packages/test-utils/tsconfig.json
new file mode 100644
index 00000000000000..9a0c365b532095
--- /dev/null
+++ b/packages/test-utils/tsconfig.json
@@ -0,0 +1,12 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "allowJs": true,
+    "noEmit": true,
+    "noUnusedLocals": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true
+  },
+  "include": ["src/**/*"],
+  "exclude": ["node_modules"]
+}
diff --git a/test/README.md b/test/README.md
index 7fd8d0c11e063c..14b7b929336bce 100644
--- a/test/README.md
+++ b/test/README.md
@@ -22,7 +22,7 @@ Thanks for writing tests! Here's a quick run-down on our current setup.
 
 ## Writing tests
 
-For all unit tests, please use the return value from `test/utils/createRenderer`.
+For all unit tests, please use the return value from `@mui-internal/test-utils/createRenderer`.
 It prepares the test suite and returns a function with the same interface as
 [`render` from `@testing-library/react`](https://testing-library.com/docs/react-testing-library/api#render).
 
diff --git a/test/e2e/.mocharc.js b/test/e2e/.mocharc.js
index 081b97d43754d5..92386403490464 100644
--- a/test/e2e/.mocharc.js
+++ b/test/e2e/.mocharc.js
@@ -4,5 +4,5 @@ module.exports = {
   slow: 500,
   timeout: (process.env.CIRCLECI === 'true' ? 4 : 2) * 1000, // Circle CI has low-performance CPUs.
   reporter: 'dot',
-  require: [require.resolve('../utils/setupBabelPlaywright')],
+  require: ['@mui-internal/test-utils/setupBabelPlaywright'],
 };
diff --git a/test/e2e/index.test.ts b/test/e2e/index.test.ts
index 2014d81fe96f74..a5ceb4f2924b94 100644
--- a/test/e2e/index.test.ts
+++ b/test/e2e/index.test.ts
@@ -7,7 +7,8 @@ import type {
   MatcherOptions,
   SelectorMatcherOptions,
 } from '@testing-library/dom';
-import '../utils/initPlaywrightMatchers';
+import '@mui-internal/test-utils/initMatchers';
+import '@mui-internal/test-utils/initPlaywrightMatchers';
 
 function sleep(duration: number): Promise<void> {
   return new Promise<void>((resolve) => {
diff --git a/test/karma.conf.profile.js b/test/karma.conf.profile.js
index b952e5a651d1f4..2d5f7ee2e3939d 100644
--- a/test/karma.conf.profile.js
+++ b/test/karma.conf.profile.js
@@ -39,7 +39,7 @@ module.exports = function setKarmaConfig(config) {
       'karma-chrome-launcher',
       'karma-sourcemap-loader',
       'karma-webpack',
-      require.resolve('./utils/KarmaReporterReactProfiler'),
+      '@mui-internal/test-utils/KarmaReporterReactProfiler',
     ],
     /**
      * possible values:
diff --git a/test/karma.tests.js b/test/karma.tests.js
index 4625479c8dea4c..8925bc09cc3bd4 100644
--- a/test/karma.tests.js
+++ b/test/karma.tests.js
@@ -1,5 +1,5 @@
-import './utils/init';
-import './utils/setupKarma';
+import '@mui-internal/test-utils/init';
+import '@mui-internal/test-utils/setupKarma';
 
 const materialIntegrationContext = require.context(
   '../packages/mui-material/test/integration',
diff --git a/test/package.json b/test/package.json
index 2fe34b807a96c6..2bec94b730eaea 100644
--- a/test/package.json
+++ b/test/package.json
@@ -1,18 +1,14 @@
 {
-  "name": "test",
+  "name": "@mui-internal/tests",
   "version": "5.0.0",
   "private": true,
   "scripts": {
     "typescript": "tsc -p tsconfig.json"
   },
   "devDependencies": {
-    "@babel/plugin-transform-modules-commonjs": "^7.22.15",
-    "@babel/preset-typescript": "^7.22.15",
-    "@babel/register": "^7.22.15",
     "@babel/runtime": "^7.22.15",
     "@emotion/cache": "^11.11.0",
     "@emotion/react": "^11.11.1",
-    "@mnajdova/enzyme-adapter-react-18": "^0.2.0",
     "@mui/base": "5.0.0-beta.16",
     "@mui/icons-material": "^5.14.9",
     "@mui/joy": "5.0.0-beta.7",
@@ -20,39 +16,22 @@
     "@mui/material": "^5.14.10",
     "@mui/material-next": "6.0.0-alpha.102",
     "@mui/system": "^5.14.10",
-    "@mui/utils": "^5.14.10",
+    "@mui-internal/test-utils": "^1.0.0",
     "@playwright/test": "1.37.1",
     "@testing-library/dom": "^9.3.1",
-    "@testing-library/react": "^14.0.0",
     "@types/chai": "^4.3.6",
-    "@types/chai-dom": "^1.11.1",
-    "@types/enzyme": "^3.10.13",
-    "@types/format-util": "^1.0.2",
-    "@types/prop-types": "^15.7.5",
     "@types/react": "^18.2.21",
-    "@types/react-dom": "^18.2.7",
-    "@types/react-is": "^18.2.1",
-    "@types/react-test-renderer": "^18.0.1",
-    "@types/sinon": "^10.0.16",
     "chai": "^4.3.8",
-    "chai-dom": "^1.11.0",
     "docs": "^5.0.0",
-    "dom-accessibility-api": "^0.6.1",
-    "enzyme": "^3.11.0",
     "fast-glob": "^3.3.1",
-    "format-util": "^1.0.5",
     "fs-extra": "^11.1.1",
     "html-webpack-plugin": "^5.5.3",
-    "jsdom": "^22.1.0",
     "lodash": "^4.17.21",
-    "mocha": "^10.2.0",
     "playwright": "^1.37.1",
     "prop-types": "^15.8.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-is": "^18.2.0",
     "react-router-dom": "^6.15.0",
-    "react-test-renderer": "^18.2.0",
     "sinon": "^15.2.0",
     "styled-components": "6.0.7",
     "stylis": "4.2.0",
diff --git a/test/regressions/.mocharc.js b/test/regressions/.mocharc.js
index 2e476a33d3ddd1..66b9e6bc4905df 100644
--- a/test/regressions/.mocharc.js
+++ b/test/regressions/.mocharc.js
@@ -3,5 +3,5 @@ module.exports = {
   slow: 500,
   timeout: (process.env.CIRCLECI === 'true' ? 4 : 2) * 1000, // Circle CI has low-performance CPUs.
   reporter: 'dot',
-  require: [require.resolve('../utils/setupBabelPlaywright')],
+  require: ['@mui-internal/test-utils/setupBabelPlaywright'],
 };
diff --git a/test/tsconfig.json b/test/tsconfig.json
index 798f9d363f0e6d..b7cc8d29136617 100644
--- a/test/tsconfig.json
+++ b/test/tsconfig.json
@@ -1,12 +1,13 @@
 {
   "extends": "../tsconfig.json",
-  "include": ["e2e/**/*", "regressions/**/*", "utils/**/*"],
   "compilerOptions": {
     "allowJs": true,
-    "noEmit": true,
     "noUnusedLocals": true,
     "skipLibCheck": true,
-    "esModuleInterop": true
+    "esModuleInterop": true,
+    "moduleResolution": "node16",
+    "types": ["mocha"]
   },
-  "exclude": ["node_modules"]
+  "include": ["e2e/**/*", "regressions/**/*"],
+  "exclude": ["node_modules", "*/build"]
 }
diff --git a/tsconfig.json b/tsconfig.json
index f18dfa4f29d3ca..2c5723bbbe1591 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -44,7 +44,6 @@
       "@mui/zero-runtime/*": ["./packages/zero-runtime/src/*"],
       "@mui/zero-tag-processor/*": ["./packages/zero-tag-processor/src/*"],
       "@mui/zero-vite-plugin/*": ["./packages/zero-vite-plugin/src/*"],
-      "test/*": ["./test/*"],
       "typescript-to-proptypes": ["./packages/typescript-to-proptypes/src"]
     },
     // Otherwise we get react-native typings which conflict with dom.lib.
diff --git a/yarn.lock b/yarn.lock
index e3b8e97bb2fdff..c872cf04dff346 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3509,7 +3509,7 @@
   dependencies:
     "@types/chai" "*"
 
-"@types/chai@*", "@types/chai@^4.3.6":
+"@types/chai@*", "@types/chai@^4.3.5", "@types/chai@^4.3.6":
   version "4.3.6"
   resolved "https://registry.yarnpkg.com/@types/chai/-/chai-4.3.6.tgz#7b489e8baf393d5dd1266fb203ddd4ea941259e6"
   integrity sha512-VOVRLM1mBxIRxydiViqPcKn6MIxZytrbMpd6RJLIWKxUNr3zux8no0Oc7kJx0WAPIitgZ0gkrDS+btlqQpubpw==
@@ -5705,7 +5705,7 @@ chai-dom@^1.11.0:
   resolved "https://registry.yarnpkg.com/chai-dom/-/chai-dom-1.11.0.tgz#aa3af405b3d9b0470d185b17081ed23ca5fdaeb4"
   integrity sha512-ZzGlEfk1UhHH5+N0t9bDqstOxPEXmn3EyXvtsok5rfXVDOFDJbHVy12rED6ZwkJAUDs2w7/Da4Hlq2LB63kltg==
 
-chai@^4.3.8:
+chai@^4.3.7, chai@^4.3.8:
   version "4.3.8"
   resolved "https://registry.yarnpkg.com/chai/-/chai-4.3.8.tgz#40c59718ad6928da6629c70496fe990b2bb5b17c"
   integrity sha512-vX4YvVVtxlfSZ2VecZgFUTU5qPCYsobVI2O9FmwEXBhDigYGQA6jRXCycIs1yJnnWbZ6/+a2zNIF5DfVCcJBFQ==