diff --git a/.storybook/main.ts b/.storybook/main.ts
index 39e936c3..abae6d14 100644
--- a/.storybook/main.ts
+++ b/.storybook/main.ts
@@ -35,5 +35,6 @@ const config: StorybookConfig = {
   docs: {
     autodocs: 'tag',
   },
+  staticDirs: ['../docs'],
 }
 export default config
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7bd777a0..a96092cf 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,9 @@
 # Changelog
 
+## 3.0.24
+
+- Imported markdown files(docs) for datepicker, linear progress and dropdown menu to display in storybook
+
 ## 3.0.23
 
 - Improve visibility of scroll to top button
diff --git a/docs/storybook/button.md b/docs/storybook/button.md
index 82fa6f9b..db928fdb 100644
--- a/docs/storybook/button.md
+++ b/docs/storybook/button.md
@@ -1,4 +1,4 @@
-### Buttons
+### Design
 
 <img width='100%' alt="image"  src="../static/button-variations.png">
 
diff --git a/docs/storybook/datepicker.md b/docs/storybook/datepicker.md
index c4ebfd67..c46f65ca 100644
--- a/docs/storybook/datepicker.md
+++ b/docs/storybook/datepicker.md
@@ -1,4 +1,4 @@
-### Date Picker
+### Design
 
 <img width="560" alt="image" src="../static/datepicker.png">
 
diff --git a/docs/storybook/selectlist/dropdown.md b/docs/storybook/selectlist/dropdown.md
index 851bcf0b..082051ff 100644
--- a/docs/storybook/selectlist/dropdown.md
+++ b/docs/storybook/selectlist/dropdown.md
@@ -1,10 +1,10 @@
-### Drop Down
+### Design
 
 <img width="740" alt="image" src="../../static/dropdown.png">
 
 <br>
 
-#### ...
+#### Description
 
 A drop down list is a graphical control element, similar to a list box, that allows the user to choose one value from a list. When a drop-down list is inactive, it displays a single value. When activated, it displays (drops down) a list of values, from which the user may select one. When the user selects a new value, the control reverts to its inactive state, displaying the selected value.
 
diff --git a/docs/storybook/spinner.md b/docs/storybook/spinner.md
index bf11a8ba..6627bcaf 100644
--- a/docs/storybook/spinner.md
+++ b/docs/storybook/spinner.md
@@ -1,4 +1,3 @@
-
 ### Spinner
 
 For page elements with a database connection or backend content requests with potential loading delays (latency), a loading spinner should be used. 
diff --git a/package.json b/package.json
index 67b97d8f..d797ccd3 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@catena-x/portal-shared-components",
-  "version": "3.0.23",
+  "version": "3.0.24",
   "description": "Catena-X Portal Shared Components",
   "author": "Catena-X Contributors",
   "license": "Apache-2.0",
@@ -62,6 +62,7 @@
     "@storybook/addon-links": "^8.0.2",
     "@storybook/addon-onboarding": "^8.0.2",
     "@storybook/blocks": "^8.0.2",
+    "@storybook/builder-vite": "^8.1.10",
     "@storybook/react": "^8.0.2",
     "@storybook/react-vite": "^8.0.2",
     "@storybook/test": "^8.0.2",
diff --git a/src/components/basic/Button/BackButton.stories.tsx b/src/components/basic/Button/BackButton.stories.tsx
index 27077f44..fccd892b 100644
--- a/src/components/basic/Button/BackButton.stories.tsx
+++ b/src/components/basic/Button/BackButton.stories.tsx
@@ -21,6 +21,7 @@
 import { ComponentStory } from '@storybook/react'
 
 import { BackButton as Component } from './BackButton'
+import button from '../../../../docs/storybook/button.md?raw'
 
 export default {
   title: 'Buttons',
@@ -31,6 +32,11 @@ export default {
       action: 'onClick',
     },
   },
+  parameters: {
+    docs: {
+      description: { component: button },
+    },
+  },
 }
 
 const Template: ComponentStory<typeof Component> = (args: any) => (
diff --git a/src/components/basic/Datepicker/Datepicker.stories.tsx b/src/components/basic/Datepicker/Datepicker.stories.tsx
index f1283cb4..1af30ebc 100644
--- a/src/components/basic/Datepicker/Datepicker.stories.tsx
+++ b/src/components/basic/Datepicker/Datepicker.stories.tsx
@@ -22,12 +22,18 @@ import { ComponentStory } from '@storybook/react'
 import { Box } from '@mui/material'
 
 import { Datepicker as Component } from '.'
+import datepicker from '../../../../docs/storybook/datepicker.md?raw'
 
 export default {
   title: 'Datepicker',
   component: Component,
   tags: ['autodocs'],
   argTypes: {},
+  parameters: {
+    docs: {
+      description: { component: datepicker },
+    },
+  },
 }
 
 const Template: ComponentStory<typeof Component> = (args: any) => (
diff --git a/src/components/basic/DropdownMenu/DropdownMenu.stories.tsx b/src/components/basic/DropdownMenu/DropdownMenu.stories.tsx
index ed754cad..39efab00 100644
--- a/src/components/basic/DropdownMenu/DropdownMenu.stories.tsx
+++ b/src/components/basic/DropdownMenu/DropdownMenu.stories.tsx
@@ -24,6 +24,7 @@ import MenuItem from '@mui/material/MenuItem'
 import { ComponentStory } from '@storybook/react'
 
 import { DropdownMenu as Component } from '.'
+import dropdown from '../../../../docs/storybook/selectlist/dropdown.md?raw'
 
 export default {
   title: 'Dropdown Menu',
@@ -32,6 +33,11 @@ export default {
   args: {
     buttonText: 'Admin',
   },
+  parameters: {
+    docs: {
+      description: { component: dropdown },
+    },
+  },
 }
 
 const Template: ComponentStory<typeof Component> = (args: any) => (
diff --git a/src/components/basic/Progress/LinearProgress/LinearProgressWithValueLabel.stories.tsx b/src/components/basic/Progress/LinearProgress/LinearProgressWithValueLabel.stories.tsx
index 549d8383..23e471f9 100644
--- a/src/components/basic/Progress/LinearProgress/LinearProgressWithValueLabel.stories.tsx
+++ b/src/components/basic/Progress/LinearProgress/LinearProgressWithValueLabel.stories.tsx
@@ -20,12 +20,18 @@
 import { ComponentStory } from '@storybook/react'
 
 import { LinearProgressWithValueLabel as Component } from './LinearProgressWithValueLabel'
+import spinner from '../../../../../docs/storybook/spinner.md?raw'
 
 export default {
   title: 'LinearProgressWithValueLabel',
   component: Component,
   tags: ['autodocs'],
   argTypes: {},
+  parameters: {
+    docs: {
+      description: { component: spinner },
+    },
+  },
 }
 
 const Template: ComponentStory<typeof Component> = (args: any) => (