diff --git a/src/App.css b/src/App.css
deleted file mode 100644
index e69de29..0000000
diff --git a/src/App.tsx b/src/App.tsx
deleted file mode 100644
index cba6f33..0000000
--- a/src/App.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-import React, { useState } from "react";
-
-import { ProgressIndicator } from "./stories/ProgressIndicator";
-
-import { Header1 } from "./stories/Header1";
-import { Header2 } from "./stories/Header2";
-
-import { Button } from "./stories/Button";
-import { IconArrow } from "./stories/IconArrow";
-import { InputButtonWithIcon } from "./stories/InputButtonWithIcon";
-
-import { Label } from "./stories/Label";
-import { Input } from "./stories/Input";
-import { AutoResizingTextArea } from "./stories/AutoResizingTextArea";
-import { Select } from "./stories/Select";
-
-import { CenteredContainer } from "./stories/utilities/CenteredContainer";
-import { SpaceBetweenContainer } from "./stories/utilities/SpaceBetweenContainer";
-import { Spacer } from "./stories/utilities/Spacer";
-import { TextAlignWrapper } from "./stories/utilities/TextAlignWrapper";
-
-function App() {
-  const [input1, setInput1] = useState("");
-  const [input2, setInput2] = useState("");
-  const [select, setSelect] = useState("github");
-
-  const handleInputChange1 = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setInput1(e.target.value);
-  };
-
-  const handleInputChange2 = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
-    setInput2(e.target.value);
-  };
-
-  const handleSelectChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
-    setSelect(e.target.value);
-  };
-
-  return (
-    <CenteredContainer fullscreen>
-      <CenteredContainer>
-        <ProgressIndicator currentProgress={3} />
-        {/* <Header1>Securely Share Your Secrets</Header1> */}
-        <Spacer />
-        <Header2>Tell someone</Header2>
-        <Spacer />
-        <TextAlignWrapper align="left">
-          <Label htmlFor="testInput">Testing label</Label>
-        </TextAlignWrapper>
-        <Input
-          variant="primary"
-          id="testInput"
-          value={input1}
-          onChange={handleInputChange1}
-          placeholder="testing 1 2 3"
-        />
-        <Spacer />
-        <InputButtonWithIcon
-          id="testinputbutton"
-          value="https://wanderinginn.com"
-          variant="download"
-          onClick={() => {}}
-        />
-        <Spacer />
-        <Select
-          id="selectService"
-          value={select}
-          onChange={handleSelectChange}
-        />
-        <Spacer />
-        <SpaceBetweenContainer>
-          <Label htmlFor="testInput2">Testing label left</Label>
-          <Label htmlFor="testInput2">Testing label right</Label>
-        </SpaceBetweenContainer>
-        <AutoResizingTextArea
-          id="testTextArea"
-          value={input2}
-          onChange={handleInputChange2}
-          placeholder="Tell me your secrets"
-        />
-        <Spacer />
-        <SpaceBetweenContainer>
-          <Button variant="primary" onClick={() => {}}>
-            <IconArrow arrowDirection="left" />
-          </Button>
-          <Button variant="secondary" onClick={() => {}}>
-            <IconArrow arrowDirection="right" />
-          </Button>
-        </SpaceBetweenContainer>
-      </CenteredContainer>
-    </CenteredContainer>
-  );
-}
-
-export default App;
diff --git a/src/App2.tsx b/src/App2.tsx
deleted file mode 100644
index 9999722..0000000
--- a/src/App2.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import React from "react";
-import styled from "styled-components";
-
-import { SplashIconHeader } from "./stories/SplashIconHeader";
-
-function App2() {
-  return (
-    <StyledDiv>
-      <SplashIconHeader />
-    </StyledDiv>
-  );
-}
-
-export default App2;
-
-const StyledDiv = styled.div`
-  min-height: 100vh;
-  width: 100%;
-  background-color: #091132;
-  padding: 40px;
-`;
diff --git a/src/index.css b/src/index.css
deleted file mode 100644
index e69de29..0000000
diff --git a/src/SecretCreationPage1.stories.tsx b/src/stories/pages/SecretCreationPage1.stories.tsx
similarity index 100%
rename from src/SecretCreationPage1.stories.tsx
rename to src/stories/pages/SecretCreationPage1.stories.tsx
diff --git a/src/SecretCreationPage1.tsx b/src/stories/pages/SecretCreationPage1.tsx
similarity index 74%
rename from src/SecretCreationPage1.tsx
rename to src/stories/pages/SecretCreationPage1.tsx
index cfbc852..4f1c515 100644
--- a/src/SecretCreationPage1.tsx
+++ b/src/stories/pages/SecretCreationPage1.tsx
@@ -1,19 +1,19 @@
 import React, { useState } from "react";
 
-import { ProgressIndicator } from "./stories/ProgressIndicator";
+import { ProgressIndicator } from "../ProgressIndicator";
 
-import { Header2 } from "./stories/Header2";
+import { Header2 } from"../Header2";
 
-import { Button } from "./stories/Button";
-import { IconArrow } from "./stories/IconArrow";
+import { Button } from"../Button";
+import { IconArrow } from"../IconArrow";
 
-import { Label } from "./stories/Label";
-import { FileInput } from "./stories/FileInput";
-import { TextArea } from "./stories/TextArea";
+import { Label } from"../Label";
+import { FileInput } from"../FileInput";
+import { TextArea } from"../TextArea";
 
-import { CenteredContainer } from "./stories/utilities/CenteredContainer";
-import { Spacer } from "./stories/utilities/Spacer";
-import { TextAlignWrapper } from "./stories/utilities/TextAlignWrapper";
+import { CenteredContainer } from"../utilities/CenteredContainer";
+import { Spacer } from"../utilities/Spacer";
+import { TextAlignWrapper } from"../utilities/TextAlignWrapper";
 
 const SecretCreationPage1 = () => {
   const [secretInput, setSecretInput] = useState("");
diff --git a/src/SecretCreationPage2.stories.tsx b/src/stories/pages/SecretCreationPage2.stories.tsx
similarity index 100%
rename from src/SecretCreationPage2.stories.tsx
rename to src/stories/pages/SecretCreationPage2.stories.tsx
diff --git a/src/SecretCreationPage2.tsx b/src/stories/pages/SecretCreationPage2.tsx
similarity index 75%
rename from src/SecretCreationPage2.tsx
rename to src/stories/pages/SecretCreationPage2.tsx
index 9ae12a0..b73deb2 100644
--- a/src/SecretCreationPage2.tsx
+++ b/src/stories/pages/SecretCreationPage2.tsx
@@ -1,20 +1,20 @@
 import React, { useState } from "react";
 
-import { ProgressIndicator } from "./stories/ProgressIndicator";
+import { ProgressIndicator } from"../ProgressIndicator";
 
-import { Header2 } from "./stories/Header2";
+import { Header2 } from"../Header2";
 
-import { Button } from "./stories/Button";
-import { IconArrow } from "./stories/IconArrow";
+import { Button } from"../Button";
+import { IconArrow } from"../IconArrow";
 
-import { Label } from "./stories/Label";
-import { Input } from "./stories/Input";
-import { Select } from "./stories/Select";
+import { Label } from"../Label";
+import { Input } from"../Input";
+import { Select } from"../Select";
 
-import { CenteredContainer } from "./stories/utilities/CenteredContainer";
-import { SpaceBetweenContainer } from "./stories/utilities/SpaceBetweenContainer";
-import { Spacer } from "./stories/utilities/Spacer";
-import { TextAlignWrapper } from "./stories/utilities/TextAlignWrapper";
+import { CenteredContainer } from"../utilities/CenteredContainer";
+import { SpaceBetweenContainer } from"../utilities/SpaceBetweenContainer";
+import { Spacer } from"../utilities/Spacer";
+import { TextAlignWrapper } from"../utilities/TextAlignWrapper";
 
 const SecretCreationPage2 = () => {
   const [recipientInput, setRecipientInput] = useState("");
diff --git a/src/SecretCreationPage3.stories.tsx b/src/stories/pages/SecretCreationPage3.stories.tsx
similarity index 100%
rename from src/SecretCreationPage3.stories.tsx
rename to src/stories/pages/SecretCreationPage3.stories.tsx
diff --git a/src/SecretCreationPage3.tsx b/src/stories/pages/SecretCreationPage3.tsx
similarity index 70%
rename from src/SecretCreationPage3.tsx
rename to src/stories/pages/SecretCreationPage3.tsx
index ae58cd4..5330a1a 100644
--- a/src/SecretCreationPage3.tsx
+++ b/src/stories/pages/SecretCreationPage3.tsx
@@ -1,20 +1,20 @@
 import React from "react";
 
-import { ProgressIndicator } from "./stories/ProgressIndicator";
+import { ProgressIndicator } from"../ProgressIndicator";
 
-import { Header2 } from "./stories/Header2";
+import { Header2 } from"../Header2";
 
-import { Button } from "./stories/Button";
-import { IconArrow } from "./stories/IconArrow";
-import { InputButtonWithIcon } from "./stories/InputButtonWithIcon";
+import { Button } from"../Button";
+import { IconArrow } from"../IconArrow";
+import { InputButtonWithIcon } from"../InputButtonWithIcon";
 
-import { Label } from "./stories/Label";
-import { Input } from "./stories/Input";
+import { Label } from"../Label";
+import { Input } from"../Input";
 
-import { CenteredContainer } from "./stories/utilities/CenteredContainer";
-import { SpaceBetweenContainer } from "./stories/utilities/SpaceBetweenContainer";
-import { Spacer } from "./stories/utilities/Spacer";
-import { TextAlignWrapper } from "./stories/utilities/TextAlignWrapper";
+import { CenteredContainer } from"../utilities/CenteredContainer";
+import { SpaceBetweenContainer } from"../utilities/SpaceBetweenContainer";
+import { Spacer } from"../utilities/Spacer";
+import { TextAlignWrapper } from"../utilities/TextAlignWrapper";
 
 const SecretCreationPage3 = () => {
   return (
diff --git a/src/SecretRevealPage.stories.tsx b/src/stories/pages/SecretRevealPage.stories.tsx
similarity index 100%
rename from src/SecretRevealPage.stories.tsx
rename to src/stories/pages/SecretRevealPage.stories.tsx
diff --git a/src/SecretRevealPage.tsx b/src/stories/pages/SecretRevealPage.tsx
similarity index 68%
rename from src/SecretRevealPage.tsx
rename to src/stories/pages/SecretRevealPage.tsx
index 56746fd..cf9f6d7 100644
--- a/src/SecretRevealPage.tsx
+++ b/src/stories/pages/SecretRevealPage.tsx
@@ -1,19 +1,19 @@
 import React from "react";
 
-import { Header2 } from "./stories/Header2";
-import { Header3 } from "./stories/Header3";
+import { Header2 } from"../Header2";
+import { Header3 } from"../Header3";
 
-import { Button } from "./stories/Button";
+import { Button } from"../Button";
 
-import { Label } from "./stories/Label";
-import { InputButtonWithIcon } from "./stories/InputButtonWithIcon";
+import { Label } from"../Label";
+import { InputButtonWithIcon } from"../InputButtonWithIcon";
 
-import { TextAreaParagraph } from "./stories/TextAreaParagraph";
+import { TextAreaParagraph } from"../TextAreaParagraph";
 
-import { CenteredContainer } from "./stories/utilities/CenteredContainer";
-import { SpaceBetweenContainer } from "./stories/utilities/SpaceBetweenContainer";
-import { Spacer } from "./stories/utilities/Spacer";
-import { TextAlignWrapper } from "./stories/utilities/TextAlignWrapper";
+import { CenteredContainer } from"../utilities/CenteredContainer";
+import { SpaceBetweenContainer } from"../utilities/SpaceBetweenContainer";
+import { Spacer } from"../utilities/Spacer";
+import { TextAlignWrapper } from"../utilities/TextAlignWrapper";
 
 const SecretRevealPage = () => {
   return (
diff --git a/src/SplashPage.stories.tsx b/src/stories/pages/SplashPage.stories.tsx
similarity index 100%
rename from src/SplashPage.stories.tsx
rename to src/stories/pages/SplashPage.stories.tsx
diff --git a/src/SplashPage.tsx b/src/stories/pages/SplashPage.tsx
similarity index 63%
rename from src/SplashPage.tsx
rename to src/stories/pages/SplashPage.tsx
index 94733e6..7b35405 100644
--- a/src/SplashPage.tsx
+++ b/src/stories/pages/SplashPage.tsx
@@ -1,14 +1,14 @@
 import React from "react";
 
-import { SplashIconHeader } from "./stories/SplashIconHeader";
+import { SplashIconHeader } from"../SplashIconHeader";
 
-import { Header1 } from "./stories/Header1";
-import { Header3 } from "./stories/Header3";
+import { Header1 } from"../Header1";
+import { Header3 } from"../Header3";
 
-import { Button } from "./stories/Button";
+import { Button } from"../Button";
 
-import { CenteredContainer } from "./stories/utilities/CenteredContainer";
-import { Spacer } from "./stories/utilities/Spacer";
+import { CenteredContainer } from"../utilities/CenteredContainer";
+import { Spacer } from"../utilities/Spacer";
 
 const SplashPage = () => {
   return (
diff --git a/src/VerifyPage.stories.tsx b/src/stories/pages/VerifyPage.stories.tsx
similarity index 100%
rename from src/VerifyPage.stories.tsx
rename to src/stories/pages/VerifyPage.stories.tsx
diff --git a/src/VerifyPage.tsx b/src/stories/pages/VerifyPage.tsx
similarity index 71%
rename from src/VerifyPage.tsx
rename to src/stories/pages/VerifyPage.tsx
index ae91d8b..f1f7ab9 100644
--- a/src/VerifyPage.tsx
+++ b/src/stories/pages/VerifyPage.tsx
@@ -1,16 +1,16 @@
 import React from "react";
 
-import { Header2 } from "./stories/Header2";
-import { Header3 } from "./stories/Header3";
+import { Header2 } from"../Header2";
+import { Header3 } from"../Header3";
 
-import { Button } from "./stories/Button";
+import { Button } from"../Button";
 
-import { Label } from "./stories/Label";
-import { Input } from "./stories/Input";
+import { Label } from"../Label";
+import { Input } from"../Input";
 
-import { CenteredContainer } from "./stories/utilities/CenteredContainer";
-import { Spacer } from "./stories/utilities/Spacer";
-import { TextAlignWrapper } from "./stories/utilities/TextAlignWrapper";
+import { CenteredContainer } from"../utilities/CenteredContainer";
+import { Spacer } from"../utilities/Spacer";
+import { TextAlignWrapper } from"../utilities/TextAlignWrapper";
 
 const VerifyPage = () => {
   return (