diff --git a/src/components/Progress/stories/Progress.stories.js b/src/components/Progress/stories/Progress.stories.js
new file mode 100644
index 0000000..be1d74d
--- /dev/null
+++ b/src/components/Progress/stories/Progress.stories.js
@@ -0,0 +1,13 @@
+import ProgressView from './ProgressView.svelte';
+
+export default {
+  title: 'Default Components/Progress',
+  component: ProgressView
+};
+
+const Template = ({ ...args }) => ({
+  Component: ProgressView,
+  props: args
+});
+
+export const Primary = Template.bind({});
diff --git a/src/components/Progress/stories/ProgressView.svelte b/src/components/Progress/stories/ProgressView.svelte
new file mode 100644
index 0000000..25f2d86
--- /dev/null
+++ b/src/components/Progress/stories/ProgressView.svelte
@@ -0,0 +1,23 @@
+<script>
+  import Progress from '../Progress.svelte'
+
+  /**
+   * Progress value
+   */
+  export let value = 0
+</script>
+
+<div class="progress-container">
+  <Progress
+    {value}
+  >
+  </Progress>
+</div>
+
+<style>
+  .progress-container {
+    width: 100%;
+    height: 5px;
+    background-color: rgba(93, 93, 93, 0.5);
+  }
+</style>