diff --git a/components/page-footer/index.js b/components/page-footer/index.js
index c383f9ee5..d2a624a0a 100644
--- a/components/page-footer/index.js
+++ b/components/page-footer/index.js
@@ -55,4 +55,4 @@ const PageFooter = () => (
);
-export default PageFooter;
\ No newline at end of file
+export default PageFooter;
diff --git a/components/signup-form/index.js b/components/signup-form/index.js
new file mode 100644
index 000000000..785cc230d
--- /dev/null
+++ b/components/signup-form/index.js
@@ -0,0 +1,12 @@
+import { SignUpWrap, Title, Subtitle, Textbox, Button } from './style';
+
+const SignUpForm = () => (
+
+ Subscribe
+ You have caught us before we are ready, enter your email below and we will keep you posted
+
+
+
+);
+
+export default SignUpForm;
diff --git a/components/signup-form/style.js b/components/signup-form/style.js
new file mode 100644
index 000000000..c6cd5c59c
--- /dev/null
+++ b/components/signup-form/style.js
@@ -0,0 +1,55 @@
+import styled from 'styled-components';
+
+export const SignUpWrap = styled.div`
+ max-width: 400px;
+ margin: 200px auto;
+ text-align: center;
+`;
+
+export const Title = styled.h1`
+ font-size: 48px;
+ font-weight: 700;
+ margin-bottom: 17px;
+`;
+
+export const Subtitle = styled.p`
+ font-size: 16px;
+`;
+
+export const Textbox = styled.input`
+ display: block;
+ width: 100%;
+ padding: 10px 15px;
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 1.5;
+ color: #495057;
+ height: auto;
+ outline: none;
+ background-color: #fff;
+ border: 1px solid #ced4da;
+ border-radius: 5px;
+
+ &:focus {
+ border: 1px solid #101010;
+ }
+`;
+
+export const Button = styled.button`
+ -webkit-appearance: none;
+ border: none;
+ outline: none;
+ box-shadow: none;
+ display: block;
+ text-align: center;
+ width: 100%;
+ padding: 10px 15px;
+ margin-top: 10px;
+ background: #333;
+ color: white;
+ border-radius: 5px;
+
+ &:hover {
+ background: #000000;
+ }
+`;
diff --git a/components/site-nav/index.js b/components/site-nav/index.js
index a5fa0cbf9..6828c466d 100644
--- a/components/site-nav/index.js
+++ b/components/site-nav/index.js
@@ -12,7 +12,6 @@ const SiteNav = () => (
diff --git a/pages/signup.js b/pages/signup.js
index 5a45c77e2..a58e5384f 100644
--- a/pages/signup.js
+++ b/pages/signup.js
@@ -1,18 +1,12 @@
import DefaultLayout from 'layouts/default';
import PageFooter from 'components/page-footer';
import SiteNav from 'components/site-nav';
+import SignUpForm from '../components/signup-form';
const SignUp = () => (
-
-
-
Sign Up
-
You have caught us before we are ready, enter your email below and we will notify you once you are in
-
-
-
-
+
);