diff --git a/.github/workflows/storybook.yml b/.github/workflows/storybook.yml
new file mode 100644
index 0000000..9960472
--- /dev/null
+++ b/.github/workflows/storybook.yml
@@ -0,0 +1,23 @@
+name: Build and Deploy Storybook
+on:
+  push:
+    branches:
+      - main
+permissions:
+  contents: write
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout 🛎️
+        uses: actions/checkout@v4
+      - name: Clean install
+        run: npm ci
+      - name: Build
+        run: npm run build-storybook
+      - name: Build and deploy to storybook-static branch
+        uses: JamesIves/github-pages-deploy-action@v4.6.0
+        with:
+          folder: docs # The folder the action should deploy.
+          branch: docs
diff --git a/.gitignore b/.gitignore
index 8ee54e8..18c4e7c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -28,3 +28,5 @@ coverage
 *.sw?
 
 *.tsbuildinfo
+
+/docs
diff --git a/package.json b/package.json
index b145b73..07647bd 100644
--- a/package.json
+++ b/package.json
@@ -51,7 +51,7 @@
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
     "format": "prettier --write src/",
     "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build",
+    "build-storybook": "storybook build -o docs",
     "build-publish": "vite build && npm publish --access public"
   },
   "devDependencies": {