diff --git a/.github/workflows/storybook.yml b/.github/workflows/storybook.yml
index 28be8a3b04..213d8a16b2 100644
--- a/.github/workflows/storybook.yml
+++ b/.github/workflows/storybook.yml
@@ -32,6 +32,12 @@ jobs:
       - name: Build tailwind
         run: yarn tailwind-preset build
 
+      - name: Build Orbit components
+        run: yarn components build
+
+      - name: Build Playroom
+        run: yarn components build:playroom
+
       - name: Build Storybook
         run: yarn components build:storybook
 
diff --git a/packages/orbit-components/.gitignore b/packages/orbit-components/.gitignore
index a2d0c4b3d1..ed56e9ad4d 100644
--- a/packages/orbit-components/.gitignore
+++ b/packages/orbit-components/.gitignore
@@ -5,6 +5,7 @@
 .out
 .cache
 .DS_STORE
+.playroom
 src/data/airportIllustrations.json
 src/data/illustrations.json
 src/data/icons.json
diff --git a/packages/orbit-components/.storybook/main.ts b/packages/orbit-components/.storybook/main.ts
index f04ea731a4..aa77d88735 100644
--- a/packages/orbit-components/.storybook/main.ts
+++ b/packages/orbit-components/.storybook/main.ts
@@ -7,7 +7,7 @@ function getAbsolutePath(value: string): string {
 }
 
 const config: StorybookConfig = {
-  staticDirs: [path.resolve(__dirname, "../static")],
+  staticDirs: [path.resolve(__dirname, "../static"), path.resolve(__dirname, "../.playroom")],
   stories: ["../src/**/*.@(mdx|stories.*)"],
   framework: getAbsolutePath("@storybook/react-webpack5"),
 
diff --git a/packages/orbit-components/.storybook/preview.ts b/packages/orbit-components/.storybook/preview.ts
index 6b2ae25616..7c584269ef 100644
--- a/packages/orbit-components/.storybook/preview.ts
+++ b/packages/orbit-components/.storybook/preview.ts
@@ -33,7 +33,7 @@ const preview: Preview = {
       element: ".story-content",
     },
     playroom: {
-      url: "http://localhost:9000",
+      url: "./playroom/",
     },
   },
 };
diff --git a/packages/orbit-components/package.json b/packages/orbit-components/package.json
index 30948bff8b..ff7100239d 100644
--- a/packages/orbit-components/package.json
+++ b/packages/orbit-components/package.json
@@ -11,7 +11,7 @@
   },
   "scripts": {
     "storybook": "storybook dev -p 6007 -c .storybook --ci",
-    "playroom:start": "playroom start",
+    "playroom": "playroom start",
     "cy:dev": "vite cypress/integration --logLevel silent",
     "cy:run": "start-server-and-test cy:dev http-get://localhost:3000 'cypress run'",
     "cy:open": "start-server-and-test cy:dev http-get://localhost:3000 'cypress open'",
@@ -28,6 +28,7 @@
     "build:iconsFont": "node --loader ts-node/esm config/createSVGFont.mts",
     "build:emailIcons": "yarn build:icons && yarn build:iconsFont && node --loader ts-node/esm config/generateEmailIcons.mts",
     "build:storybook": "yarn build:icons && storybook build -c .storybook -o .out",
+    "build:playroom": "playroom build",
     "eslint:check": "eslint . --report-unused-disable-directives",
     "test-ct": "playwright test -c playwright-ct.config.ts",
     "deploy:storybook": "yarn storybook-to-ghpages -e ./.out",
diff --git a/packages/orbit-components/playroom.config.js b/packages/orbit-components/playroom.config.js
index 9bf2f6033c..cfdaa9e344 100644
--- a/packages/orbit-components/playroom.config.js
+++ b/packages/orbit-components/playroom.config.js
@@ -4,7 +4,7 @@ const { defaultFoundation } = require("@kiwicom/orbit-design-tokens");
 module.exports = {
   title: "Orbit Playroom",
   components: require.resolve("./playroomComponents.tsx"),
-  outputPath: "./.playroom",
+  outputPath: "./.playroom/playroom",
   frameComponent: "./playroom/FrameComponent.tsx",
   snippets: "./playroom/snippets.ts",
   scope: "./playroom/scope.ts",
@@ -15,7 +15,7 @@ module.exports = {
     defaultFoundation.breakpoint.mediumMobile,
     defaultFoundation.breakpoint.desktop,
   ],
-  baseUrl: "/",
+  baseUrl: "/playroom/",
   webpackConfig: () => ({
     resolve: {
       extensions: [".js", ".jsx", ".ts", ".tsx", ".css"],