diff --git a/.storybook/main.js b/.storybook/main.js
index f073993..5ae5988 100644
--- a/.storybook/main.js
+++ b/.storybook/main.js
@@ -2,10 +2,12 @@
 const config = {
 	stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|ts|svelte)'],
 	addons: [
-		'@storybook/addon-svelte-csf',
-		'@storybook/addon-essentials',
 		'@chromatic-com/storybook',
+		'@storybook/addon-essentials',
 		'@storybook/addon-interactions',
+		'@storybook/addon-styling-webpack',
+		'@storybook/addon-svelte-csf',
+		'@storybook/addon-themes',
 		'storybook-dark-mode'
 	],
 	framework: {
diff --git a/.storybook/preview.css b/.storybook/preview.css
new file mode 100644
index 0000000..bd6213e
--- /dev/null
+++ b/.storybook/preview.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
\ No newline at end of file
diff --git a/.storybook/preview.js b/.storybook/preview.js
index 747af9c..7775e81 100644
--- a/.storybook/preview.js
+++ b/.storybook/preview.js
@@ -1,3 +1,6 @@
+import { withThemeByDataAttribute } from '@storybook/addon-themes';
+import './preview.css';
+
 /** @type { import('@storybook/svelte').Preview } */
 const preview = {
 	parameters: {
@@ -7,7 +10,18 @@ const preview = {
 				date: /Date$/i
 			}
 		}
-	}
+	},
+	decorators: [
+		withThemeByDataAttribute({
+			themes: {
+				light: 'light',
+				dark: 'dark',
+				night: 'night'
+			},
+			defaultTheme: 'dark',
+			attributeName: 'data-theme'
+		})
+	]
 };
 
 export default preview;
\ No newline at end of file
diff --git a/bun.lockb b/bun.lockb
index 49f3097..46133af 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index a0b08e1..e043642 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,9 @@
 		"@playwright/test": "^1.45.3",
 		"@storybook/addon-essentials": "^8.4.7",
 		"@storybook/addon-interactions": "^8.4.7",
+		"@storybook/addon-styling-webpack": "^1.0.1",
 		"@storybook/addon-svelte-csf": "^5.0.0-next.13",
+		"@storybook/addon-themes": "^8.4.7",
 		"@storybook/blocks": "^8.4.7",
 		"@storybook/svelte": "^8.4.7",
 		"@storybook/sveltekit": "^8.4.7",