diff --git a/src/browser/scss/app.scss b/src/browser/scss/app.scss
index 6e9ef51..09098a8 100644
--- a/src/browser/scss/app.scss
+++ b/src/browser/scss/app.scss
@@ -1,3 +1,18 @@
-[v-cloak] { 
-  display: none; 
+[v-cloak] {
+  display: none;
+}
+$primary-color: #333;
+
+.todoapp {
+  .todo-title {
+    color: $primary-color;
+    text-shadow: 0 0 5px $primary-color;
+    opacity: 0.8;
+  }
+}
+.info > p {
+  color: $primary-color;
+  a {
+    color: $primary-color;
+  }
 }
diff --git a/src/server/views/index.ejs b/src/server/views/index.ejs
index b2d0831..e1b3e1a 100644
--- a/src/server/views/index.ejs
+++ b/src/server/views/index.ejs
@@ -15,25 +15,25 @@
     <section class="todoapp">
 
       <header class="header">
-        <h1>todos</h1>
-        <input class="new-todo" autofocus autocomplete="off" 
-          placeholder="What needs to be done?" 
+        <h1 class="todo-title">todos</h1>
+        <input class="new-todo" autofocus autocomplete="off"
+          placeholder="What needs to be done?"
           v-model="newTodo" @keyup.enter="addTodo">
       </header>
 
       <section class="main" v-show="todos.length" v-cloak>
         <input class="toggle-all" type="checkbox" v-model="allDone">
         <ul class="todo-list">
-          <li class="todo" v-for="todo in filteredTodos" 
+          <li class="todo" v-for="todo in filteredTodos"
             :class="{completed: todo.completed, editing: todo == editedTodo}">
             <div class="view">
               <input class="toggle" type="checkbox" v-model="todo.completed">
               <label @dblclick="editTodo(todo)">{{todo.title}}</label>
               <button class="destroy" @click="removeTodo(todo)"></button>
             </div>
-            <input class="edit" type="text" v-model="todo.title" 
-              v-todo-focus="todo == editedTodo" 
-              @blur="doneEdit(todo)" @keyup.enter="doneEdit(todo)" 
+            <input class="edit" type="text" v-model="todo.title"
+              v-todo-focus="todo == editedTodo"
+              @blur="doneEdit(todo)" @keyup.enter="doneEdit(todo)"
               @keyup.esc="cancelEdit(todo)">
           </li>
         </ul>
@@ -41,7 +41,7 @@
 
       <footer class="footer" v-show="todos.length" v-cloak>
         <span class="todo-count">
-          <strong v-text="remaining"></strong> 
+          <strong v-text="remaining"></strong>
           {{remaining | pluralize 'item'}} left
         </span>
         <ul class="filters">
@@ -49,15 +49,15 @@
             <a href="#/all" :class="{selected: visibility == 'all'}">All</a>
           </li>
           <li>
-            <a href="#/active" 
+            <a href="#/active"
               :class="{selected: visibility == 'active'}">Active</a>
           </li>
           <li>
-            <a href="#/completed" 
+            <a href="#/completed"
               :class="{selected: visibility == 'completed'}">Completed</a>
           </li>
         </ul>
-        <button class="clear-completed" @click="removeCompleted" 
+        <button class="clear-completed" @click="removeCompleted"
           v-show="todos.length > remaining">
           Clear completed
         </button>