diff --git a/package-lock.json b/package-lock.json
index a189f6b..342fa76 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -36,7 +36,7 @@
         "vue": "^3.5.13"
       },
       "devDependencies": {
-        "@chromatic-com/storybook": "^3.2.4",
+        "@chromatic-com/storybook": "^4.1.1",
         "@slidev/cli": "^52.2.4",
         "@slidev/theme-default": "^0.25.0",
         "@slidev/theme-seriph": "^0.25.0",
@@ -635,22 +635,24 @@
       "license": "Apache-2.0"
     },
     "node_modules/@chromatic-com/storybook": {
-      "version": "3.2.4",
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/@chromatic-com/storybook/-/storybook-4.1.1.tgz",
+      "integrity": "sha512-+Ib4cHtEjKl/Do+4LyU0U1FhLPbIU2Q/zgbOKHBCV+dTC4T3/vGzPqiGsgkdnZyTsK/zXg96LMPSPC4jjOiapg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "chromatic": "^11.15.0",
+        "@neoconfetti/react": "^1.0.0",
+        "chromatic": "^12.0.0",
         "filesize": "^10.0.12",
         "jsonfile": "^6.1.0",
-        "react-confetti": "^6.1.0",
         "strip-ansi": "^7.1.0"
       },
       "engines": {
-        "node": ">=16.0.0",
+        "node": ">=20.0.0",
         "yarn": ">=1.22.18"
       },
       "peerDependencies": {
-        "storybook": "^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0"
+        "storybook": "^0.0.0-0 || ^9.0.0 || ^9.1.0-0 || ^9.2.0-0 || ^10.0.0-0"
       }
     },
     "node_modules/@chromatic-com/storybook/node_modules/ansi-regex": {
@@ -1680,6 +1682,13 @@
         "langium": "3.3.1"
       }
     },
+    "node_modules/@neoconfetti/react": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@neoconfetti/react/-/react-1.0.0.tgz",
+      "integrity": "sha512-klcSooChXXOzIm+SE5IISIAn3bYzYfPjbX7D7HoqZL84oAfgREeSg5vSIaSFH+DaGzzvImTyWe1OyrJ67vik4A==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "dev": true,
@@ -6240,7 +6249,9 @@
       }
     },
     "node_modules/chromatic": {
-      "version": "11.25.2",
+      "version": "12.2.0",
+      "resolved": "https://registry.npmjs.org/chromatic/-/chromatic-12.2.0.tgz",
+      "integrity": "sha512-GswmBW9ZptAoTns1BMyjbm55Z7EsIJnUvYKdQqXIBZIKbGErmpA+p4c0BYA+nzw5B0M+rb3Iqp1IaH8TFwIQew==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -11762,20 +11773,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/react-confetti": {
-      "version": "6.1.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "tween-functions": "^1.2.0"
-      },
-      "engines": {
-        "node": ">=10.18"
-      },
-      "peerDependencies": {
-        "react": "^16.3.0 || ^17.0.1 || ^18.0.0"
-      }
-    },
     "node_modules/react-dom": {
       "version": "18.3.1",
       "dev": true,
@@ -12866,11 +12863,6 @@
         "@esbuild/win32-x64": "0.25.1"
       }
     },
-    "node_modules/tween-functions": {
-      "version": "1.2.0",
-      "dev": true,
-      "license": "BSD"
-    },
     "node_modules/twoslash": {
       "version": "0.3.4",
       "resolved": "https://registry.npmjs.org/twoslash/-/twoslash-0.3.4.tgz",
diff --git a/package.json b/package.json
index ad8b183..f2e2dd4 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
     "browser-and-ui-3"
   ],
   "devDependencies": {
-    "@chromatic-com/storybook": "^3.2.4",
+    "@chromatic-com/storybook": "^4.1.1",
     "@slidev/cli": "^52.2.4",
     "@slidev/theme-default": "^0.25.0",
     "@slidev/theme-seriph": "^0.25.0",