diff --git a/gatsby-config.js b/gatsby-config.js
index e35eb02..78ca5fa 100644
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -50,7 +50,7 @@ module.exports = {
     `gatsby-plugin-sharp`,
     // `gatsby-plugin-offline`,
     `gatsby-plugin-react-helmet`,
-    // `gatsby-plugin-netlify-cms`,
+    `gatsby-plugin-netlify-cms`,
     `gatsby-plugin-styled-components`,
     `gatsby-plugin-purify-css`,
   ],
diff --git a/src/components/Card.js b/src/components/Card.js
index d31f479..a5b9a31 100644
--- a/src/components/Card.js
+++ b/src/components/Card.js
@@ -1,5 +1,6 @@
 import styled from 'styled-components';
 import { space, flexDirection } from 'styled-system';
+import t from '../styles/theme';
 import shadow from '../styles/shadow';
 
 export default styled.div`
@@ -7,6 +8,7 @@ export default styled.div`
   ${flexDirection};
   position: relative;
   display: flex;
+  color: ${t.colors.textDark};
   background-color: ${p => p.theme.colors[p.background] || p.theme.colors.bg};
   border: 1px solid ${p => p.theme.colors.grey[0]};
   border-radius: 6px;
diff --git a/src/components/Nav.js b/src/components/Nav.js
index 889d4c2..8316c63 100644
--- a/src/components/Nav.js
+++ b/src/components/Nav.js
@@ -12,7 +12,7 @@ const Nav = styled.nav`
   bottom: 0;
   height: 3.25rem;
   display: flex;
-  background-color: ${t.colors.grey[0]};
+  background-color: ${t.colors.bgDark};
   box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.15);
   z-index: 999;
   @media (min-width: 40em) {
@@ -50,7 +50,7 @@ const NavLink = styled(Link)`
   transition: border-color 0.2s;
   @media (min-width: 40em) {
     border-bottom: 4px solid transparent;
-    ${p => p.current && css`border-bottom-color: ${t.colors.grey[3]};`};
+    ${p => p.current && css`border-bottom-color: ${t.colors.grey[1]};`};
     &:hover {
       color: inherit;
       border-bottom-color: ${t.colors.primary};
diff --git a/src/components/Title.js b/src/components/Title.js
index f02b0cc..8826400 100644
--- a/src/components/Title.js
+++ b/src/components/Title.js
@@ -1,12 +1,13 @@
 import React from 'react';
 import styled from 'styled-components';
 import { fontSize } from 'styled-system';
+import t from '../styles/theme';
 import shadow from '../styles/longShadow';
 
 const Title = styled.h1`
   ${fontSize};
   font-size: ${p => (p.big ? p.theme.fontSizes[3] : p.theme.fontSizes[2])};
-  color: orange;
+  color: ${t.colors.textLight};
   text-shadow: ${p => shadow(20)};
   @media (min-width: 40em) {
     font-size: ${p => (p.big ? p.theme.fontSizes[4] : p.theme.fontSizes[3])};
diff --git a/src/pages/index.js b/src/pages/index.js
index dab9353..440fd0a 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -5,6 +5,7 @@ import Helmet from 'react-helmet';
 import Container from '../components/Container';
 import Title from '../components/Title';
 import BlogSection from '../components/BlogSection';
+import t from '../styles/theme';
 
 class BlogIndex extends React.Component {
   render() {
@@ -14,7 +15,7 @@ class BlogIndex extends React.Component {
     return (
       <Container>
         <Helmet title={siteTitle} />
-        <Title big>I'm a frontend developer in London.</Title>
+        <Title big>I'm a <span style={{ color: t.colors.primary }}>frontend developer</span> in London.</Title>
         <BlogSection
           label="Recent Posts"
           direction={['column', 'column', 'row']}
diff --git a/src/styles/global.js b/src/styles/global.js
index 5278a40..b23b32c 100644
--- a/src/styles/global.js
+++ b/src/styles/global.js
@@ -22,8 +22,8 @@ injectGlobal`
 
   body {
     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-    color: ${t.colors.textDark};
-    background-color: ${t.colors.bg};
+    color: ${t.colors.textLight};
+    background-color: ${t.colors.bgDark};
     line-height: 1.5;
   }
 
diff --git a/src/styles/theme.js b/src/styles/theme.js
index 47e9d07..8d2e370 100644
--- a/src/styles/theme.js
+++ b/src/styles/theme.js
@@ -24,6 +24,7 @@ export default {
     grey: shades,
     primary: palette.orange,
     bg: palette.white,
+    bgDark: shades[4],
     textLight: palette.white,
     textDark: shades[4],
   },