diff --git a/docs/pages/experiments/docs/DemoInDocs.js b/docs/pages/experiments/docs/DemoInDocs.js
index fb2cb617cde09d..959249d1f46116 100644
--- a/docs/pages/experiments/docs/DemoInDocs.js
+++ b/docs/pages/experiments/docs/DemoInDocs.js
@@ -5,8 +5,6 @@ import Stack from '@mui/material/Stack';
 export default function DemoInDocs() {
   return (
     <Stack sx={{ width: '100%' }} spacing={2}>
-      <Alert severity="error">This is an error alert — check it out!</Alert>
-      <Alert severity="warning">This is a warning alert — check it out!</Alert>
       <Alert severity="info">This is an info alert — check it out!</Alert>
       <Alert severity="success">This is a success alert — check it out!</Alert>
     </Stack>
diff --git a/docs/pages/experiments/docs/DemoInDocs.tsx.preview b/docs/pages/experiments/docs/DemoInDocs.tsx.preview
index 7b26ce399bd8f5..35aa272c353c04 100644
--- a/docs/pages/experiments/docs/DemoInDocs.tsx.preview
+++ b/docs/pages/experiments/docs/DemoInDocs.tsx.preview
@@ -1,4 +1,2 @@
-<Alert severity="error">This is an error alert — check it out!</Alert>
-<Alert severity="warning">This is a warning alert — check it out!</Alert>
 <Alert severity="info">This is an info alert — check it out!</Alert>
 <Alert severity="success">This is a success alert — check it out!</Alert>
\ No newline at end of file
diff --git a/docs/pages/experiments/docs/DemoInDocsNotEditable.js b/docs/pages/experiments/docs/DemoInDocsNotEditable.js
new file mode 100644
index 00000000000000..959249d1f46116
--- /dev/null
+++ b/docs/pages/experiments/docs/DemoInDocsNotEditable.js
@@ -0,0 +1,12 @@
+import * as React from 'react';
+import Alert from '@mui/material/Alert';
+import Stack from '@mui/material/Stack';
+
+export default function DemoInDocs() {
+  return (
+    <Stack sx={{ width: '100%' }} spacing={2}>
+      <Alert severity="info">This is an info alert — check it out!</Alert>
+      <Alert severity="success">This is a success alert — check it out!</Alert>
+    </Stack>
+  );
+}
diff --git a/docs/pages/experiments/docs/DemoInDocsNotEditable.tsx.preview b/docs/pages/experiments/docs/DemoInDocsNotEditable.tsx.preview
new file mode 100644
index 00000000000000..35aa272c353c04
--- /dev/null
+++ b/docs/pages/experiments/docs/DemoInDocsNotEditable.tsx.preview
@@ -0,0 +1,2 @@
+<Alert severity="info">This is an info alert — check it out!</Alert>
+<Alert severity="success">This is a success alert — check it out!</Alert>
\ No newline at end of file
diff --git a/docs/pages/experiments/docs/demos.md b/docs/pages/experiments/docs/demos.md
index 8a0d33434a5485..43d1c4e0a3e655 100644
--- a/docs/pages/experiments/docs/demos.md
+++ b/docs/pages/experiments/docs/demos.md
@@ -27,15 +27,15 @@ So, it renders the "outlined" background variant.
 
 ## "hideToolbar": true
 
-{{"demo": "DemoInDocs.js", "hideToolbar": true}}
+{{"demo": "DemoInDocsNotEditable.js", "hideToolbar": true}}
 
 ## "hideToolbar": true, "bg": true
 
-{{"demo": "DemoInDocs.js", "hideToolbar": true, "bg": true}}
+{{"demo": "DemoInDocsNotEditable.js", "hideToolbar": true, "bg": true}}
 
 ## "hideToolbar": true, "bg": "inline"
 
-{{"demo": "DemoInDocs.js", "hideToolbar": true, "bg": "inline"}}
+{{"demo": "DemoInDocsNotEditable.js", "hideToolbar": true, "bg": "inline"}}
 
 ## Multiple Tabs demo