diff --git a/bun.lockb b/bun.lockb
index fbb6b37..68dbb01 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index 5769e51..952660d 100644
--- a/package.json
+++ b/package.json
@@ -1,75 +1,76 @@
 {
-    "name": "@elysiajs/swagger",
-    "version": "1.1.6",
-    "description": "Plugin for Elysia to auto-generate Swagger page",
-    "author": {
-        "name": "saltyAom",
-        "url": "https://github.com/SaltyAom",
-        "email": "saltyaom@gmail.com"
+  "name": "@elysiajs/swagger",
+  "version": "1.1.6",
+  "description": "Plugin for Elysia to auto-generate Swagger page",
+  "author": {
+    "name": "saltyAom",
+    "url": "https://github.com/SaltyAom",
+    "email": "saltyaom@gmail.com"
+  },
+  "main": "./dist/cjs/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/cjs/index.js"
     },
-    "main": "./dist/cjs/index.js",
-    "module": "./dist/index.mjs",
-    "types": "./dist/index.d.ts",
-    "exports": {
-        "./package.json": "./package.json",
-        ".": {
-            "types": "./dist/index.d.ts",
-            "import": "./dist/index.mjs",
-            "require": "./dist/cjs/index.js"
-        },
-        "./types": {
-            "types": "./dist/types.d.ts",
-            "import": "./dist/types.mjs",
-            "require": "./dist/cjs/types.js"
-        },
-        "./utils": {
-            "types": "./dist/utils.d.ts",
-            "import": "./dist/utils.mjs",
-            "require": "./dist/cjs/utils.js"
-        },
-        "./scalar": {
-            "types": "./dist/scalar/index.d.ts",
-            "import": "./dist/scalar/index.mjs",
-            "require": "./dist/cjs/scalar/index.js"
-        },
-        "./scalar/theme": {
-            "types": "./dist/scalar/theme.d.ts",
-            "import": "./dist/scalar/theme.mjs",
-            "require": "./dist/cjs/scalar/theme.js"
-        }
+    "./types": {
+      "types": "./dist/types.d.ts",
+      "import": "./dist/types.mjs",
+      "require": "./dist/cjs/types.js"
     },
-    "keywords": [
-        "elysia",
-        "swagger"
-    ],
-    "homepage": "https://github.com/elysiajs/elysia-swagger",
-    "repository": {
-        "type": "git",
-        "url": "https://github.com/elysiajs/elysia-swagger"
+    "./utils": {
+      "types": "./dist/utils.d.ts",
+      "import": "./dist/utils.mjs",
+      "require": "./dist/cjs/utils.js"
     },
-    "bugs": "https://github.com/elysiajs/elysia-swagger/issues",
-    "license": "MIT",
-    "scripts": {
-        "dev": "bun run --watch example/index.ts",
-        "test": "bun test && npm run test:node",
-        "test:node": "npm install --prefix ./test/node/cjs/ && npm install --prefix ./test/node/esm/ && node ./test/node/cjs/index.js && node ./test/node/esm/index.js",
-        "build": "bun build.ts",
-        "release": "npm run build && npm run test && npm publish --access public"
+    "./scalar": {
+      "types": "./dist/scalar/index.d.ts",
+      "import": "./dist/scalar/index.mjs",
+      "require": "./dist/cjs/scalar/index.js"
     },
-    "peerDependencies": {
-        "elysia": ">= 1.1.0"
-    },
-    "devDependencies": {
-        "@apidevtools/swagger-parser": "^10.1.0",
-        "@types/bun": "1.1.6",
-        "elysia": "1.1.18",
-        "eslint": "9.6.0",
-        "tsup": "^8.1.0",
-        "typescript": "^5.5.3"
-    },
-    "dependencies": {
-        "@scalar/types": "^0.0.12",
-        "openapi-types": "^12.1.3",
-        "pathe": "^1.1.2"
+    "./scalar/theme": {
+      "types": "./dist/scalar/theme.d.ts",
+      "import": "./dist/scalar/theme.mjs",
+      "require": "./dist/cjs/scalar/theme.js"
     }
+  },
+  "keywords": [
+    "elysia",
+    "swagger"
+  ],
+  "homepage": "https://github.com/elysiajs/elysia-swagger",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/elysiajs/elysia-swagger"
+  },
+  "bugs": "https://github.com/elysiajs/elysia-swagger/issues",
+  "license": "MIT",
+  "scripts": {
+    "dev": "bun run --watch example/index.ts",
+    "test": "bun test && npm run test:node",
+    "test:node": "npm install --prefix ./test/node/cjs/ && npm install --prefix ./test/node/esm/ && node ./test/node/cjs/index.js && node ./test/node/esm/index.js",
+    "build": "bun build.ts",
+    "release": "npm run build && npm run test && npm publish --access public"
+  },
+  "peerDependencies": {
+    "elysia": ">= 1.1.0"
+  },
+  "devDependencies": {
+    "@apidevtools/swagger-parser": "^10.1.0",
+    "@types/bun": "1.1.6",
+    "elysia": "1.1.18",
+    "eslint": "9.6.0",
+    "tsup": "^8.1.0",
+    "typescript": "^5.5.3"
+  },
+  "dependencies": {
+    "@scalar/themes": "^0.9.52",
+    "@scalar/types": "^0.0.12",
+    "openapi-types": "^12.1.3",
+    "pathe": "^1.1.2"
+  }
 }
diff --git a/src/index.ts b/src/index.ts
index 2a1a284..621270e 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -85,7 +85,10 @@ export const swagger = async <Path extends string = '/swagger'>(
 				...scalarConfig.spec,
 				url: `/${relativePath}/json`
 			},
-			...scalarConfig
+			...scalarConfig,
+			// so we can showcase the elysia theme
+			// @ts-expect-error
+			_integration: 'elysiajs'
 		}
 
 		return new Response(
diff --git a/src/scalar/index.ts b/src/scalar/index.ts
index 91d1600..883ea66 100644
--- a/src/scalar/index.ts
+++ b/src/scalar/index.ts
@@ -1,4 +1,4 @@
-import scalarElysiaTheme from './theme'
+import { elysiajsTheme } from '@scalar/themes'
 import type { OpenAPIV3 } from 'openapi-types'
 import type { ReferenceConfiguration } from '@scalar/types'
 
@@ -29,7 +29,7 @@ export const ScalarRender = (
       }
     </style>
     <style>
-      ${config.customCss ?? scalarElysiaTheme}
+      ${config.customCss ?? elysiajsTheme}
     </style>
   </head>
   <body>
diff --git a/src/scalar/theme.ts b/src/scalar/theme.ts
deleted file mode 100644
index 7cb59d1..0000000
--- a/src/scalar/theme.ts
+++ /dev/null
@@ -1,196 +0,0 @@
-export default `
-/* basic theme */
-.light-mode {
-  --theme-color-1: #2a2f45;
-  --theme-color-2: #757575;
-  --theme-color-3: #8e8e8e;
-  --theme-color-accent: #f06292;
-
-  --theme-background-1: #fff;
-  --theme-background-2: #f6f6f6;
-  --theme-background-3: #e7e7e7;
-  --theme-background-accent: #f062921f;
-
-  --theme-border-color: rgba(0, 0, 0, 0.1);
-}
-.dark-mode {
-  --theme-color-1: rgba(255, 255, 255, 0.9);
-  --theme-color-2: rgba(156, 163, 175, 1);
-  --theme-color-3: rgba(255, 255, 255, 0.44);
-  --theme-color-accent: #f06292;
-
-  --theme-background-1: #111728;
-  --theme-background-2: #1e293b;
-  --theme-background-3: #334155;
-  --theme-background-accent: #f062921f;
-
-  --theme-border-color: rgba(255, 255, 255, 0.1);
-}
-/* Document Sidebar */
-.light-mode .sidebar,
-.dark-mode .sidebar {
-  --sidebar-background-1: var(--theme-background-1);
-  --sidebar-item-hover-color: currentColor;
-  --sidebar-item-hover-background: var(--theme-background-2);
-  --sidebar-item-active-background: var(--theme-background-accent);
-  --sidebar-border-color: transparent;
-  --sidebar-color-1: var(--theme-color-1);
-  --sidebar-color-2: var(--theme-color-2);
-  --sidebar-color-active: var(--theme-color-accent);
-  --sidebar-search-background: transparent;
-  --sidebar-search-border-color: var(--theme-border-color);
-  --sidebar-search--color: var(--theme-color-3);
-}
-/* Document header only shows on mobile*/
-.dark-mode .t-doc__header,
-.light-mode .t-doc__header {
-  --header-background-1: rgba(255, 255, 255, 0.85);
-  --header-border-color: transparent;
-  --header-color-1: var(--theme-color-1);
-  --header-color-2: var(--theme-color-2);
-  --header-background-toggle: var(--theme-color-3);
-  --header-call-to-action-color: var(--theme-color-accent);
-}
-
-.dark-mode .t-doc__header {
-  --header-background-1: rgba(17, 23, 40, 0.75);
-}
-
-/* advanced */
-.light-mode {
-  --theme-button-1: rgb(49 53 56);
-  --theme-button-1-color: #fff;
-  --theme-button-1-hover: rgb(28 31 33);
-
-  --theme-color-green: #069061;
-  --theme-color-red: #ef0006;
-  --theme-color-yellow: #edbe20;
-  --theme-color-blue: #0082d0;
-  --theme-color-orange: #fb892c;
-  --theme-color-purple: #5203d1;
-
-  --theme-scrollbar-color: rgba(0, 0, 0, 0.18);
-  --theme-scrollbar-color-active: rgba(0, 0, 0, 0.36);
-}
-.dark-mode {
-  --theme-button-1: #f6f6f6;
-  --theme-button-1-color: #000;
-  --theme-button-1-hover: #e7e7e7;
-
-  --theme-color-green: #a3ffa9;
-  --theme-color-red: #ffa3a3;
-  --theme-color-yellow: #fffca3;
-  --theme-color-blue: #a5d6ff;
-  --theme-color-orange: #e2ae83;
-  --theme-color-purple: #d2a8ff;
-
-  --theme-scrollbar-color: rgba(255, 255, 255, 0.24);
-  --theme-scrollbar-color-active: rgba(255, 255, 255, 0.48);
-}
-/* Elysia Specific */
-.scalar-api-client__send-request-button,
-.show-api-client-button {
-  background: #3c82f6 !important;
-}
-.show-api-client-button:before {
-  display: none;
-}
-
-.sidebar-search:hover {
-  transition: all 0.15s ease-in-out;
-  --sidebar-search-border-color: var(--theme-color-accent) !important;
-  color: var(--sidebar-color-1) !important;
-}
-.scalar-api-client__container .sidebar {
-  --sidebar-border-color: var(--theme-border-color);
-}
-@media (min-width: 1150px) {
-  .section-container:has( ~ .footer):before,
-  .tag-section-container:before {
-    content: "";
-    position: absolute;
-    top: -5px;
-    left: 0;
-    width: 100%;
-    height: 10px;
-    background: linear-gradient(90deg, var(--theme-background-1) 3%,transparent 10%);
-  }
-}
-.section-flare {
-  position: absolute;
-  width: 100vw;
-  height: 300px;
-  --stripes: repeating-linear-gradient(
-    100deg,
-    #fff 0%,
-    #fff 7%,
-    transparent 10%,
-    transparent 12%,
-    #fff 16%
-  );
-  --stripesDark: repeating-linear-gradient(
-    100deg,
-    #000 0%,
-    #000 7%,
-    transparent 10%,
-    transparent 12%,
-    #000 16%
-  );
-  --rainbow: repeating-linear-gradient(
-    100deg,
-    #60a5fa 10%,
-    #e879f9 16%,
-    #5eead4 22%,
-    #60a5fa 30%
-  );
-  background-image: var(--stripes), var(--rainbow);
-  background-size: 300%, 200%;
-  background-position: 50% 50%, 50% 50%;
-  filter: invert(100%);
-  -webkit-mask-image: radial-gradient(
-    ellipse at 100% 0%,
-    black 40%,
-    transparent 70%
-  );
-  mask-image: radial-gradient(ellipse at 100% 0%, black 40%, transparent 70%);
-  pointer-events: none;
-  opacity: 0.15;
-}
-.dark-mode .section-flare {
-  background-image: var(--stripesDark), var(--rainbow);
-  filter: opacity(50%) saturate(200%);
-  opacity: 0.25;
-}
-.section-flare:after {
-  content: "";
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  background-image: var(--stripes), var(--rainbow);
-  background-size: 200%, 100%;
-  background-attachment: fixed;
-  mix-blend-mode: difference;
-}
-.dark-mode .section-flare:after {
-  background-image: var(--stripesDark), var(--rainbow);
-}
-@keyframes headerbackground {
-  from {
-    background: transparent;
-    backdrop-filter: none;
-  }
-  to {
-    background: var(--header-background-1);
-    backdrop-filter: blur(12px);
-  }
-}
-.light-mode .t-doc__header,
-.dark-mode .t-doc__header {
-  animation: headerbackground forwards;
-  animation-timeline: scroll();
-  animation-range: 0px 200px;
-  --header-border-color: transparent;
-}
-`
\ No newline at end of file