diff --git a/assets/js/src/common/form/select/_stories/assets/icon.tsx b/assets/js/src/common/form/select/_stories/assets/icon.tsx
new file mode 100644
index 0000000000..6877b67def
--- /dev/null
+++ b/assets/js/src/common/form/select/_stories/assets/icon.tsx
@@ -0,0 +1,7 @@
+import React from 'react';
+
+export default (
+  <svg viewBox="3 3 18 18">
+    <path d="M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z" />
+  </svg>
+);
diff --git a/assets/js/src/common/form/select/_stories/select.tsx b/assets/js/src/common/form/select/_stories/select.tsx
new file mode 100644
index 0000000000..062fc1be6f
--- /dev/null
+++ b/assets/js/src/common/form/select/_stories/select.tsx
@@ -0,0 +1,66 @@
+import React from 'react';
+import { action } from '@storybook/addon-actions';
+import Select from '../select';
+import Heading from '../../../typography/heading/heading';
+import icon from './assets/icon';
+
+export default {
+  title: 'Form',
+  component: Select,
+};
+
+export const SelectBoxes = () => (
+  <>
+    <Heading level={3}>Small select boxes</Heading>
+    <p>
+      <Select size="small">
+        <option value="1">Option 1</option>
+        <option value="2">Option 2</option>
+        <option value="3">Option 3</option>
+      </Select>
+      <div className="mailpoet-gap" />
+      <Select
+        size="small"
+        iconStart={icon}
+      >
+        <option value="1">Option 1</option>
+        <option value="2">Option 2</option>
+        <option value="3">Option 3</option>
+      </Select>
+    </p>
+    <br />
+    <Heading level={3}>Regular select boxes</Heading>
+    <p>
+      <Select>
+        <option value="1">Option 1</option>
+        <option value="2">Option 2</option>
+        <option value="3">Option 3</option>
+      </Select>
+      <div className="mailpoet-gap" />
+      <Select iconStart={icon}>
+        <option value="1">Option 1</option>
+        <option value="2">Option 2</option>
+        <option value="3">Option 3</option>
+      </Select>
+    </p>
+    <br />
+    <Heading level={3}>Full-width select boxes</Heading>
+    <p>
+      <Select isFullWidth>
+        <option value="1">Option 1</option>
+        <option value="2">Option 2</option>
+        <option value="3">Option 3</option>
+      </Select>
+      <div className="mailpoet-gap" />
+      <Select
+        isFullWidth
+        iconStart={icon}
+      >
+        <option value="1">Option 1</option>
+        <option value="2">Option 2</option>
+        <option value="3">Option 3</option>
+      </Select>
+    </p>
+    <br />
+  </>
+);