diff --git a/frontend/client/Routes.tsx b/frontend/client/Routes.tsx
index e1abf13e..aef339ed 100644
--- a/frontend/client/Routes.tsx
+++ b/frontend/client/Routes.tsx
@@ -22,6 +22,10 @@ const SignOut = loadable(() => import('pages/sign-out'));
 const Profile = loadable(() => import('pages/profile'));
 const Settings = loadable(() => import('pages/settings'));
 const Exception = loadable(() => import('pages/exception'));
+const Tos = loadable(() => import('pages/tos'));
+const About = loadable(() => import('pages/about'));
+const Privacy = loadable(() => import('pages/privacy'));
+const Contact = loadable(() => import('pages/contact'));
 
 import 'styles/style.less';
 
@@ -107,6 +111,54 @@ const routeConfigs: RouteConfig[] = [
     },
     onlyLoggedIn: true,
   },
+  {
+    // Terms of Service page
+    route: {
+      path: '/tos',
+      component: Tos,
+      exact: true,
+    },
+    template: {
+      title: 'Terms of Service',
+    },
+    onlyLoggedIn: false,
+  },
+  {
+    // About page
+    route: {
+      path: '/about',
+      component: About,
+      exact: true,
+    },
+    template: {
+      title: 'About',
+    },
+    onlyLoggedIn: false,
+  },
+  {
+    // Privacy page
+    route: {
+      path: '/privacy',
+      component: Privacy,
+      exact: true,
+    },
+    template: {
+      title: 'Privacy Policy',
+    },
+    onlyLoggedIn: false,
+  },
+  {
+    // Contact page
+    route: {
+      path: '/contact',
+      component: Contact,
+      exact: true,
+    },
+    template: {
+      title: 'Contact',
+    },
+    onlyLoggedIn: false,
+  },
   {
     // User profile
     route: {
diff --git a/frontend/client/components/About/index.tsx b/frontend/client/components/About/index.tsx
new file mode 100644
index 00000000..8c36919d
--- /dev/null
+++ b/frontend/client/components/About/index.tsx
@@ -0,0 +1,18 @@
+import React, { PureComponent } from 'react';
+import './style.less';
+
+export default class About extends PureComponent {
+  render() {
+    return (
+      <div className="About">
+        <h1 className="About-title">About Grant.io</h1>
+        <section>
+          <p>
+            Grant.io organizes creators and community members to incentivize ecosystem
+            improvements.
+          </p>
+        </section>
+      </div>
+    );
+  }
+}
diff --git a/frontend/client/components/About/style.less b/frontend/client/components/About/style.less
new file mode 100644
index 00000000..8fb750d6
--- /dev/null
+++ b/frontend/client/components/About/style.less
@@ -0,0 +1,21 @@
+.About {
+  max-width: 640px;
+  margin: 0 auto;
+
+  &-title {
+    text-align: center;
+    margin-top: 1rem;
+    padding-bottom: 3rem;
+    border-bottom: 1px solid #e5e5e5;
+    margin-bottom: 2.5rem;
+    font-size: 2.5rem;
+  }
+
+  section {
+    margin-bottom: 3rem;
+
+    p {
+      font-size: 1rem;
+    }
+  }
+}
diff --git a/frontend/client/components/Contact/index.tsx b/frontend/client/components/Contact/index.tsx
new file mode 100644
index 00000000..765f263c
--- /dev/null
+++ b/frontend/client/components/Contact/index.tsx
@@ -0,0 +1,18 @@
+import React, { PureComponent } from 'react';
+import './style.less';
+
+export default class Contact extends PureComponent {
+  render() {
+    return (
+      <div className="Contact">
+        <h1 className="Contact-title">Contact Us</h1>
+        <section>
+          <p>
+            You may contact the Grant.io project by emailing{' '}
+            <a href="mailto:daniel@grant.io">daniel@grant.io</a>.
+          </p>
+        </section>
+      </div>
+    );
+  }
+}
diff --git a/frontend/client/components/Contact/style.less b/frontend/client/components/Contact/style.less
new file mode 100644
index 00000000..4a86bebc
--- /dev/null
+++ b/frontend/client/components/Contact/style.less
@@ -0,0 +1,21 @@
+.Contact {
+  max-width: 640px;
+  margin: 0 auto;
+
+  &-title {
+    text-align: center;
+    margin-top: 1rem;
+    padding-bottom: 3rem;
+    border-bottom: 1px solid #e5e5e5;
+    margin-bottom: 2.5rem;
+    font-size: 2.5rem;
+  }
+
+  section {
+    margin-bottom: 3rem;
+
+    p {
+      font-size: 1rem;
+    }
+  }
+}
diff --git a/frontend/client/components/Footer/index.tsx b/frontend/client/components/Footer/index.tsx
index 386c3e63..69f5a5ee 100644
--- a/frontend/client/components/Footer/index.tsx
+++ b/frontend/client/components/Footer/index.tsx
@@ -7,12 +7,19 @@ export default () => (
     <Link className="Footer-title" to="/">
       Grant.io
     </Link>
-    {/*
-      <div className="Footer-links">
-        <a className="Footer-links-link">about</a>
-        <a className="Footer-links-link">legal</a>
-        <a className="Footer-links-link">privacy policy</a>
-      </div>
-    */}
+    <div className="Footer-links">
+      <Link to="/about" className="Footer-links-link">
+        about
+      </Link>
+      <Link to="/contact" className="Footer-links-link">
+        contact
+      </Link>
+      <Link to="/tos" className="Footer-links-link">
+        terms of service
+      </Link>
+      <Link to="/privacy" className="Footer-links-link">
+        privacy policy
+      </Link>
+    </div>
   </footer>
 );
diff --git a/frontend/client/components/Privacy/index.tsx b/frontend/client/components/Privacy/index.tsx
new file mode 100644
index 00000000..71a7af5c
--- /dev/null
+++ b/frontend/client/components/Privacy/index.tsx
@@ -0,0 +1,64 @@
+import React, { PureComponent } from 'react';
+import './style.less';
+
+export default class Privacy extends PureComponent {
+  render() {
+    return (
+      <div className="Privacy">
+        <h1 className="Privacy-title">Privacy Policy</h1>
+        <section>
+          <h2>1. Lorem Ipsum</h2>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+            incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
+            eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
+            in culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+            incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
+            eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
+            in culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+        </section>
+        <section>
+          <h2>2. Duis Aute Irure</h2>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+            incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
+            eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
+            in culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+        </section>
+        <section>
+          <h2>3. Ullamco Laboris Reprehenderit</h2>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+            incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+          </p>
+        </section>
+        <section>
+          <h2>4. Fugiat</h2>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+            incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
+            eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
+            in culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+        </section>
+        <section>
+          <b>Effective:</b> Oct 25, 2018
+        </section>
+      </div>
+    );
+  }
+}
diff --git a/frontend/client/components/Privacy/style.less b/frontend/client/components/Privacy/style.less
new file mode 100644
index 00000000..25e80eb1
--- /dev/null
+++ b/frontend/client/components/Privacy/style.less
@@ -0,0 +1,5 @@
+@import '~styles/legal-document-mixin.less';
+
+.Privacy {
+  .legal-document-mixin();
+}
diff --git a/frontend/client/components/Tos/index.tsx b/frontend/client/components/Tos/index.tsx
new file mode 100644
index 00000000..9bc88495
--- /dev/null
+++ b/frontend/client/components/Tos/index.tsx
@@ -0,0 +1,64 @@
+import React, { PureComponent } from 'react';
+import './style.less';
+
+export default class Tos extends PureComponent {
+  render() {
+    return (
+      <div className="Tos">
+        <h1 className="Tos-title">Terms of Service</h1>
+        <section>
+          <h2>1. Lorem Ipsum</h2>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+            incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
+            eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
+            in culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+        </section>
+        <section>
+          <h2>2. Duis Aute Irure</h2>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+            incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
+            eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
+            in culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+            incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
+            eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
+            in culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+        </section>
+        <section>
+          <h2>3. Ullamco Laboris Reprehenderit</h2>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+            incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+          </p>
+        </section>
+        <section>
+          <h2>4. Fugiat</h2>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
+            incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
+            nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+            Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
+            eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
+            in culpa qui officia deserunt mollit anim id est laborum.
+          </p>
+        </section>
+        <section>
+          <b>Effective:</b> Oct 25, 2018
+        </section>
+      </div>
+    );
+  }
+}
diff --git a/frontend/client/components/Tos/style.less b/frontend/client/components/Tos/style.less
new file mode 100644
index 00000000..d6b62a5f
--- /dev/null
+++ b/frontend/client/components/Tos/style.less
@@ -0,0 +1,5 @@
+@import '~styles/legal-document-mixin.less';
+
+.Tos {
+  .legal-document-mixin();
+}
diff --git a/frontend/client/pages/about.tsx b/frontend/client/pages/about.tsx
new file mode 100644
index 00000000..a519b0ef
--- /dev/null
+++ b/frontend/client/pages/about.tsx
@@ -0,0 +1,2 @@
+import About from 'components/About';
+export default About;
diff --git a/frontend/client/pages/contact.tsx b/frontend/client/pages/contact.tsx
new file mode 100644
index 00000000..d02629f2
--- /dev/null
+++ b/frontend/client/pages/contact.tsx
@@ -0,0 +1,2 @@
+import Contact from 'components/Contact';
+export default Contact;
diff --git a/frontend/client/pages/privacy.tsx b/frontend/client/pages/privacy.tsx
new file mode 100644
index 00000000..7718d3fe
--- /dev/null
+++ b/frontend/client/pages/privacy.tsx
@@ -0,0 +1,2 @@
+import Privacy from 'components/Privacy';
+export default Privacy;
diff --git a/frontend/client/pages/tos.tsx b/frontend/client/pages/tos.tsx
new file mode 100644
index 00000000..caafa6d9
--- /dev/null
+++ b/frontend/client/pages/tos.tsx
@@ -0,0 +1,2 @@
+import Tos from 'components/Tos';
+export default Tos;
diff --git a/frontend/client/styles/legal-document-mixin.less b/frontend/client/styles/legal-document-mixin.less
new file mode 100644
index 00000000..bac0985f
--- /dev/null
+++ b/frontend/client/styles/legal-document-mixin.less
@@ -0,0 +1,28 @@
+.legal-document-mixin() {
+  max-width: 640px;
+  margin: 0 auto;
+
+  &-title {
+    text-align: center;
+    margin-top: 1rem;
+    padding-bottom: 3rem;
+    border-bottom: 1px solid #e5e5e5;
+    margin-bottom: 2.5rem;
+  }
+
+  h1 {
+    font-size: 2.5rem;
+  }
+
+  h2 {
+    font-size: 2rem;
+  }
+
+  section {
+    margin-bottom: 3rem;
+
+    p {
+      font-size: 1rem;
+    }
+  }
+}