diff --git a/.storybook/preview.js b/.storybook/preview.js
index 9937d98..1239c2e 100644
--- a/.storybook/preview.js
+++ b/.storybook/preview.js
@@ -8,7 +8,7 @@ import vuetify from '../src/runtime/plugins/vuetify'
 
 setup((app) => {
   // Registers your app's plugins into Storybook
-  app.use(vuetify)
+  app.use(vuetify(app))
   app.use(pinia)
 });
 
diff --git a/.storybook/withVuetifyTheme.decorator.js b/.storybook/withVuetifyTheme.decorator.js
index 56eaa3e..0fb34df 100644
--- a/.storybook/withVuetifyTheme.decorator.js
+++ b/.storybook/withVuetifyTheme.decorator.js
@@ -14,4 +14,4 @@ export const withVuetifyTheme = (story, context) => {
       </v-app>
     `,
   }
-}
\ No newline at end of file
+}
diff --git a/src/module.ts b/src/module.ts
index 4fcb15e..0f24100 100644
--- a/src/module.ts
+++ b/src/module.ts
@@ -9,7 +9,7 @@ import {
 export interface ModuleOptions {
   theme: {
     defaultTheme: string,
-    themes: {
+    themes?: {
       [key: string]: {
         dark: boolean,
         colors: Record<string, string>
@@ -28,22 +28,6 @@ export default defineNuxtModule<ModuleOptions>({
   defaults: {
     theme: {
       defaultTheme: 'light',
-      themes: {
-        dark: {
-          dark: false,
-          colors: {
-            'black': '#fff',
-            primary: "#545151",
-            'primary-gray': '#74767A',
-            secondary: "#8e44ad",
-            background: "#2f3640",
-            error: "#c0392b",
-            info: "#2980b9",
-            success: "#27ae60",
-            warning: "#f1c40f",
-          }
-        },
-      },
     },
     components: []
   },
diff --git a/src/runtime/plugins/vuetify/index.ts b/src/runtime/plugins/vuetify/index.ts
index ac394aa..93e982c 100644
--- a/src/runtime/plugins/vuetify/index.ts
+++ b/src/runtime/plugins/vuetify/index.ts
@@ -14,7 +14,46 @@ import "@mdi/font/css/materialdesignicons.css"; // Ensure you are using css-load
 import "@fortawesome/fontawesome-free/css/all.css"; // Ensure your project is capable of handling css files
 const aliases = allAliases;
 
+const lightTheme: ThemeDefinition = {
+  dark: false,
+  colors: {
+    primary: "#d35400",
+    'primary-gray': '#74767A',
+    secondary: "#8e44ad",
+    background: "#ecf0f1",
+    error: "#c0392b",
+    'red': "#FB2424",
+    info: "#2980b9",
+    success: "#27ae60",
+    'green': "#44AE76",
+    warning: "#f1c40f",
+  },
+};
+
+const darkTheme: ThemeDefinition = {
+  dark: true,
+  colors: {
+    'black': '#fff',
+    primary: "#d35400",
+    'primary-gray': '#74767A',
+    secondary: "#8e44ad",
+    background: "#2f3640",
+    error: "#c0392b",
+    info: "#2980b9",
+    success: "#27ae60",
+    warning: "#f1c40f",
+  },
+};
+
 const vuetify = (nuxtApp: any) => {
+  const themes = nuxtApp?.$config?.public?.nuxt3UIKitTheme || {
+    defaultTheme: 'light',
+    themes: {
+      light: lightTheme,
+      dark: darkTheme,
+    }
+  };
+
   return createVuetify({
     components,
     directives,
@@ -23,40 +62,11 @@ const vuetify = (nuxtApp: any) => {
       aliases: allAliases,
       sets: {mdi},
     },
-    theme: nuxtApp.$config.public.nuxt3UIKitTheme
+    theme: themes
   });
 };
 
-// const lightTheme: ThemeDefinition = {
-//   dark: false,
-//   colors: {
-//     primary: "#d35400",
-//     'primary-gray': '#74767A',
-//     secondary: "#8e44ad",
-//     background: "#ecf0f1",
-//     error: "#c0392b",
-//     'red': "#FB2424",
-//     info: "#2980b9",
-//     success: "#27ae60",
-//     'green': "#44AE76",
-//     warning: "#f1c40f",
-//   },
-// };
-//
-// const darkTheme: ThemeDefinition = {
-//   dark: true,
-//   colors: {
-//     'black': '#fff',
-//     primary: "#d35400",
-//     'primary-gray': '#74767A',
-//     secondary: "#8e44ad",
-//     background: "#2f3640",
-//     error: "#c0392b",
-//     info: "#2980b9",
-//     success: "#27ae60",
-//     warning: "#f1c40f",
-//   },
-// };
+
 //
 // const vuetify = createVuetify({
 //   components,