diff --git a/.storybook/main.js b/.storybook/main.js
index 1240c76..c3f2155 100644
--- a/.storybook/main.js
+++ b/.storybook/main.js
@@ -3,6 +3,7 @@ module.exports = {
     "../src/**/*.stories.mdx",
     "../src/**/*.stories.@(js|jsx|ts|tsx)"
   ],
+  "--staticDirs": ["/src/assets/svg/", "../src/components/icons.tsx"],
   "addons": [
     "@storybook/addon-links",
     "@storybook/addon-essentials",
@@ -12,5 +13,13 @@ module.exports = {
   "framework": "@storybook/react",
   "core": {
     "builder": "@storybook/builder-webpack5"
-  }
+  },
+  webpackFinal: async (config, {configType}) => {
+    
+    config.module.rules.push({
+      test: /\.svg$/,
+      loader: require.resolve('@svgr/webpack'),
+    });
+    return config;
+  },
 }
\ No newline at end of file