diff --git a/docs/src/modules/components/ComponentsApiContent.js b/docs/src/modules/components/ComponentsApiContent.js
index 061c8537860e18..3bb8628ed574a9 100644
--- a/docs/src/modules/components/ComponentsApiContent.js
+++ b/docs/src/modules/components/ComponentsApiContent.js
@@ -109,11 +109,29 @@ export default function ComponentsApiContent(props) {
       slotGuideLink = '/base-ui/guides/overriding-component-structure/';
     }
 
-    const source = filename
-      .replace(/\/packages\/mui(-(.+?))?\/src/, (match, dash, pkg) => `@mui/${pkg}`)
+    // convert paths like `/packages/mui-base/src/Input...` to `@mui/base/Input...`
+    const packageAndFilename = filename.replace(
+      /\/packages\/mui(-(.+?))?\/src/,
+      (match, dash, pkg) => `@mui/${pkg}`,
+    );
+
+    const source = packageAndFilename
       // convert things like `/Table/Table.js` to ``
       .replace(/\/([^/]+)\/\1\.(js|tsx)$/, '');
 
+    let importName = pageContent.name;
+    let namedImportPath = `${source}/${importName}`;
+    let defaultImportPath = source;
+
+    if (/Unstable_/.test(source)) {
+      namedImportPath = source.replace(/\/[^/]*$/, '');
+      defaultImportPath = packageAndFilename
+        .replace(/Unstable_/, '')
+        .replace(/\/([^/]+)\/\1\.(js|tsx)$/, '');
+
+      importName = `Unstable_${importName} as ${importName}`;
+    }
+
     // The `ref` is forwarded to the root element.
     let refHint = t('api-docs.refRootElement');
     if (forwardsRefTo == null) {
@@ -146,9 +164,9 @@ export default function ComponentsApiContent(props) {
           <Heading text="import" hash={`${componentNameKebabCase}-import`} level="h3" />
           <HighlightedCode
             code={`
-import ${pageContent.name} from '${source}/${pageContent.name}';
+import ${importName} from '${namedImportPath}';
 // ${t('or')}
-import { ${pageContent.name} } from '${source}';`}
+import { ${importName} } from '${defaultImportPath}';`}
             language="jsx"
           />
           <span dangerouslySetInnerHTML={{ __html: t('api-docs.importDifference') }} />
diff --git a/docs/src/modules/components/HooksApiContent.js b/docs/src/modules/components/HooksApiContent.js
index b8063707519649..3fef27c35dfaa2 100644
--- a/docs/src/modules/components/HooksApiContent.js
+++ b/docs/src/modules/components/HooksApiContent.js
@@ -63,6 +63,12 @@ export default function HooksApiContent(props) {
 
     const hookNameKebabCase = kebabCase(hookName);
 
+    let defaultImportName = hookName;
+
+    if (/unstable_/.test(filename)) {
+      defaultImportName = `unstable_${hookName} as ${hookName}`;
+    }
+
     return (
       <React.Fragment key={`hook-api-${key}`}>
         <MarkdownElement>
@@ -72,7 +78,7 @@ export default function HooksApiContent(props) {
             code={`
 import ${hookName} from '${source.split('/').slice(0, -1).join('/')}';
 // ${t('or')}
-import { ${hookName} } from '${source.split('/').slice(0, 2).join('/')}';`}
+import { ${defaultImportName} } from '${source.split('/').slice(0, 2).join('/')}';`}
             language="jsx"
           />
           <span dangerouslySetInnerHTML={{ __html: t('api-docs.importDifference') }} />