diff --git a/sandpack-react/src/Issues.stories.tsx b/sandpack-react/src/Issues.stories.tsx
index 5372b73e9..dd52c8ecb 100644
--- a/sandpack-react/src/Issues.stories.tsx
+++ b/sandpack-react/src/Issues.stories.tsx
@@ -13,39 +13,13 @@ export default {
   title: "Bug reports/Issues",
 };
 
-export const PackageJsonDep = (): JSX.Element => {
+export const FlushServerVsClient = (): JSX.Element => {
   return (
-    <Sandpack
-      files={{
-        "/App.js": {
-          code: `export default function App() {
-  return <h1>Hello World</h1>
-}
-`,
-        },
-        "/index.js": {
-          code: `import React, { StrictMode } from "react";
-import { createRoot } from "react-dom/client";
-
-import App from "./App";
-
-const root = createRoot(document.getElementById("root"));
-root.render(
-  <StrictMode>
-    <App />
-  </StrictMode>
-);`,
-        },
-        "/package.json": JSON.stringify({
-          main: "/index.js",
-          dependencies: {
-            react: "^18.0.0",
-            "react-dom": "^18.0.0",
-            "react-scripts": "^4.0.0",
-          },
-        }),
-      }}
-    />
+    <SandpackProvider>
+      <div style={{ border: "1px solid black" }}>
+        <SandpackCodeEditor />
+      </div>
+    </SandpackProvider>
   );
 };
 
diff --git a/sandpack-react/src/components/CodeEditor/__snapshots__/useSyntaxHighlight.test.tsx.snap b/sandpack-react/src/components/CodeEditor/__snapshots__/useSyntaxHighlight.test.tsx.snap
index f8576483a..edabfdd63 100644
--- a/sandpack-react/src/components/CodeEditor/__snapshots__/useSyntaxHighlight.test.tsx.snap
+++ b/sandpack-react/src/components/CodeEditor/__snapshots__/useSyntaxHighlight.test.tsx.snap
@@ -531,6 +531,9 @@ Array [
   >
     &gt;
   </span>,
+  "
+
+",
 ]
 `;
 
@@ -1590,6 +1593,9 @@ Array [
   >
     $EXAMPLE
   </span>,
+  "
+
+",
 ]
 `;
 
diff --git a/sandpack-react/src/components/CodeEditor/useSyntaxHighlight.ts b/sandpack-react/src/components/CodeEditor/useSyntaxHighlight.ts
index f90eefccc..51e428b3a 100644
--- a/sandpack-react/src/components/CodeEditor/useSyntaxHighlight.ts
+++ b/sandpack-react/src/components/CodeEditor/useSyntaxHighlight.ts
@@ -40,5 +40,15 @@ export const useSyntaxHighlight = ({
     addElement(to, className);
   });
 
+  /**
+   * The language parse doesn't look consistent.
+   * The final syntax highlight used by CodeMirror
+   * includes an end empty line, and the parse here doesn't,
+   * so let's add it manually.
+   */
+  if (offSet < code.length) {
+    codeElementsRender.push("\n\n");
+  }
+
   return codeElementsRender;
 };
diff --git a/sandpack-react/src/styles/index.ts b/sandpack-react/src/styles/index.ts
index f11e7a1dd..fffec5156 100644
--- a/sandpack-react/src/styles/index.ts
+++ b/sandpack-react/src/styles/index.ts
@@ -4,6 +4,8 @@ import { defaultLight, defaultDark, SANDPACK_THEMES } from "../themes";
 import type { SandpackTheme, SandpackThemeProp } from "../types";
 import { isDarkColor } from "../utils/stringUtils";
 
+import { createStitchesMock } from "./stitches-mock";
+
 /**
  * @category Theme
  */
@@ -12,9 +14,12 @@ export const THEME_PREFIX = "sp";
 /**
  * @category Theme
  */
-export const { createTheme, css, getCssText, keyframes } = createStitches({
-  prefix: THEME_PREFIX,
-});
+export const { createTheme, css, getCssText, keyframes } = process?.env
+  ?.SANDPACK_BARE_COMPONENTS
+  ? createStitchesMock
+  : createStitches({
+      prefix: THEME_PREFIX,
+    });
 
 const defaultVariables = {
   space: new Array(11).fill(" ").reduce((acc, _, index) => {
diff --git a/sandpack-react/src/styles/stitches-mock.ts b/sandpack-react/src/styles/stitches-mock.ts
new file mode 100644
index 000000000..bc80cc099
--- /dev/null
+++ b/sandpack-react/src/styles/stitches-mock.ts
@@ -0,0 +1,16 @@
+import type Stitches from "@stitches/core/types/stitches";
+
+const toString = (): string => "";
+const doubleToString = (): typeof toString => toString;
+
+const defineProperty = Object.getOwnPropertyDescriptors({ toString });
+
+Object.defineProperties(toString, defineProperty);
+Object.defineProperties(doubleToString, defineProperty);
+
+export const createStitchesMock = {
+  createTheme: toString,
+  css: doubleToString,
+  getCssText: toString,
+  keyframes: doubleToString,
+} as unknown as Stitches;
diff --git a/website/docs/docs/getting-started/custom-ui.md b/website/docs/docs/getting-started/custom-ui.md
index d87144720..ca171af09 100644
--- a/website/docs/docs/getting-started/custom-ui.md
+++ b/website/docs/docs/getting-started/custom-ui.md
@@ -37,6 +37,12 @@ While inspecting your Sandpack instance, notice that our components have classes
 This pattern is compatible with most modern styling systems, including Tailwind, styled-components and emotion.
 :::
 
+## Bare components and remove runtime styling
+
+Sandpack-React relies on [stitchesjs/stitches](https://github.com/stitchesjs/stitches) to style its component, which is almost zero-runtime CSS-in-JS framework. However, if you want to get rid of any runtime script or create your own style on top of Sandpack components, we provide a way to return bare components, which will eliminate all Sandpack CSS style.
+
+To do it, you need to pass `SANDPACK_BARE_COMPONENTS` environment variable as `true`, which will remove the Stitches dependency, its execution and return only the HTML of the components.
+
 ## Visual Options
 
 Some of the internal components of sandpack can be configured via the `options` prop.