diff --git a/docs/homepage/assets/scss/_cyan_theme.scss b/docs/homepage/assets/scss/_cyan_theme.scss
index 0e7c989..e4638c0 100644
--- a/docs/homepage/assets/scss/_cyan_theme.scss
+++ b/docs/homepage/assets/scss/_cyan_theme.scss
@@ -1,30 +1,50 @@
 @import 'variables';
 
 #v-select {
+  font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
   max-width: 500px;
   margin: 0 auto;
   .dropdown-toggle {
     background: #fff;
     border-color: rgba(82, 166, 183, 0.39);
   }
-  .selected-tag {
-    color: #147688;
-    background-color: #d7f3f9;
-    border-color: #91ddec;
-    .close {
-      color: #147688;
-      opacity: .5;
-    }
-  }
+  //.selected-tag {
+  //  color: #147688;
+  //  background-color: #d7f3f9;
+  //  border-color: #91ddec;
+  //  .close {
+  //    color: #147688;
+  //    opacity: .5;
+  //  }
+  //}
   &.dropdown.open .dropdown-toggle,
   &.dropdown.open .dropdown-menu,
   &.dropdown.open .open-indicator:before {
     border-color: #4CC3D9;
   }
   .active a {
-    background: rgba(50,50,50,.1);
+    background: rgba(50, 50, 50, .1);
     color: #333;
   }
+
+  &.dropdown li {
+    border-bottom: 1px solid rgba($code-grey, .1);
+    &:last-child {
+      border-bottom: none;
+    }
+  }
+
+  &.dropdown li a {
+    padding: 10px 20px;
+    display: inline-flex;
+    width: 100%;
+    align-items: center;
+    font-size: 1.5em;
+    .octicon {
+      font-size: 1.5em;
+      width: 1.5em;
+    }
+  }
   &.dropdown .highlight a,
   &.dropdown li:hover a {
     background: #4CC3D9;
diff --git a/docs/homepage/assets/scss/_demo.scss b/docs/homepage/assets/scss/_demo.scss
index c0cd9be..c9fbd81 100644
--- a/docs/homepage/assets/scss/_demo.scss
+++ b/docs/homepage/assets/scss/_demo.scss
@@ -5,6 +5,10 @@ body {
   height: 100vh;
 }
 
+[v-cloak] {
+  display: none;
+}
+
 body {
   font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
   -webkit-font-smoothing: antialiased;
@@ -48,6 +52,11 @@ p.lead {
   line-height: 1.4;
 }
 
+.accolades a {
+  margin-left: 0;
+  margin-right: 5px;
+}
+
 .btn {
   display: inline-block;
   margin-bottom: 0;
@@ -73,9 +82,30 @@ p.lead {
 
   ul {
     padding-left: 0;
-    margin-left: 50px;
+    margin: 2em 2em;
     text-align: left;
   }
+
+  + p {
+    margin-top: 0;
+    margin-bottom: 2em;
+  }
+}
+
+code {
+  color: $code-grey;
+  font-family: 'Fira Code', 'monospace';
+  display: inline-block;
+  padding: .5em;
+  margin-top: 1.5em;
+  margin-bottom: 1em;
+  border-radius: 5px;
+  background: rgba(255,255,255,.5);
+  font-size: 20px;
+}
+
+.cta .btn {
+  margin: 0 .5em;
 }
 
 .btn-outline {
@@ -105,7 +135,20 @@ p.lead {
   }
 }
 
-.accolades a {
-  margin-left: 0;
-  margin-right: 5px;
+.overlay {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 999;
+  position: fixed;
+  width: 100%;
+  height: 100vh;
+  top: 0;
+  left: 0;
+  background: rgba($code-black, .8);
+  transform: translateY(200vh);
+  transition: .25s transform;
+  &.active {
+    transform: translateY(0);
+  }
 }
\ No newline at end of file
diff --git a/docs/homepage/home.html b/docs/homepage/home.html
index 5eefa85..032ea0f 100644
--- a/docs/homepage/home.html
+++ b/docs/homepage/home.html
@@ -30,6 +30,46 @@
 <body>
 <div id="app">
 
+    <div class="overlay" :class="{ active: loading }" v-cloak v-show="loading">
+        <!-- By Sam Herbert (@sherb), for everyone. More @ http://goo.gl/7AJzbL -->
+        <svg width="44" height="44" viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg" stroke="#fff">
+            <g fill="none" fill-rule="evenodd" stroke-width="2">
+                <circle cx="22" cy="22" r="1">
+                    <animate attributeName="r"
+                             begin="0s" dur="1.8s"
+                             values="1; 20"
+                             calcMode="spline"
+                             keyTimes="0; 1"
+                             keySplines="0.165, 0.84, 0.44, 1"
+                             repeatCount="indefinite" />
+                    <animate attributeName="stroke-opacity"
+                             begin="0s" dur="1.8s"
+                             values="1; 0"
+                             calcMode="spline"
+                             keyTimes="0; 1"
+                             keySplines="0.3, 0.61, 0.355, 1"
+                             repeatCount="indefinite" />
+                </circle>
+                <circle cx="22" cy="22" r="1">
+                    <animate attributeName="r"
+                             begin="-0.9s" dur="1.8s"
+                             values="1; 20"
+                             calcMode="spline"
+                             keyTimes="0; 1"
+                             keySplines="0.165, 0.84, 0.44, 1"
+                             repeatCount="indefinite" />
+                    <animate attributeName="stroke-opacity"
+                             begin="-0.9s" dur="1.8s"
+                             values="1; 0"
+                             calcMode="spline"
+                             keyTimes="0; 1"
+                             keySplines="0.3, 0.61, 0.355, 1"
+                             repeatCount="indefinite" />
+                </circle>
+            </g>
+        </svg>
+    </div>
+
     <h1>Vue Select</h1>
 
     <p class="accolades lead">
@@ -54,40 +94,49 @@
     </p>
 
     <p class="lead">
-        A Vue.js select component that provides similar functionality to Select2/Chosen without the overhead of jQuery.
+        A Vue.js select component that provides similar functionality
+        to Select2/Chosen without the overhead of jQuery.
     </p>
 
-    <v-select
-            id="v-select"
-            :placeholder="placeholder"
-            :options="options"
-            multiple
-    >
+    <v-select @input="onInput" id="v-select" :options="options" label="title">
+        <template slot="option" slot-scope="option">
+            <span class="octicon" :class="option.icon"></span>
+            {{ option.title }}
+        </template>
     </v-select>
 
     <div class="feature-list">
         <ul class="list-vue">
-            <li>Custom Templating</li>
+            <li>Supports Vuex</li>
             <li>Tagging Support</li>
-            <li>Works with Vuex</li>
-            <li>Zero dependencies</li>
+            <li>Custom Templating</li>
+            <li>Zero JS/CSS dependencies</li>
+            <li>Custom Filtering Algoirthms</li>
         </ul>
 
         <ul class="list-vue">
             <li>+95% Test Coverage</li>
             <li>Select Single/Multiple</li>
             <li>Typeahead Suggestions</li>
+            <li>Supports RTL & Translations</li>
             <li>Plays nice with CSS Frameworks</li>
         </ul>
     </div>
 
-    <a class="btn btn-primary btn-outline btn-lg" href="https://github.com/sagalbot/vue-select">
-        <span class="octicon octicon-mark-github"></span> View on GitHub
-    </a>
+    <p>
+        And so much more! Get started with: <br>
+        <code>yarn add vue-select</code>
+    </p>
 
-    <a class="btn btn-primary btn-outline btn-lg" href="https://github.com/sagalbot/vue-select/docs/">
-        <span class="octicon octicon-book"></span> Read the Docs
-    </a>
+    <div class="cta">
+        <a class="btn btn-primary btn-outline btn-lg" href="https://github.com/sagalbot/vue-select">
+            <span class="octicon octicon-mark-github"></span> View on GitHub
+        </a>
+
+        <a class="btn btn-primary btn-outline btn-lg" href="https://github.com/sagalbot/vue-select/docs/">
+            <span class="octicon octicon-book"></span> Read the Docs
+        </a>
+    </div>
 
 </div>
 <script>
diff --git a/docs/homepage/home.js b/docs/homepage/home.js
index 37e30a8..66ad848 100644
--- a/docs/homepage/home.js
+++ b/docs/homepage/home.js
@@ -7,5 +7,46 @@ Vue.component('v-select', vSelect);
 
 /* eslint-disable no-new */
 new Vue({
-  el: '#app'
+  el: '#app',
+  data() {
+    return {
+      loading: false,
+      options: [
+        {
+          title: 'Read the Docs',
+          icon: 'octicon-book',
+          url: 'https://codeclimate.com/github/sagalbot/vue-select'
+        },
+        {
+          title: 'View on GitHub',
+          icon: 'octicon-mark-github',
+          url: 'https://codeclimate.com/github/sagalbot/vue-select'
+        },
+        {
+          title: 'View on NPM',
+          icon: 'octicon-database',
+          url: 'https://codeclimate.com/github/sagalbot/vue-select'
+        },
+        {
+          title: 'View Code Climate Analysis',
+          icon: 'octicon-graph',
+          url: 'https://codeclimate.com/github/sagalbot/vue-select'
+        },
+        {
+          title: 'View Codepen Examples',
+          icon: 'octicon-pencil',
+          url: 'https://codeclimate.com/github/sagalbot/vue-select'
+        },
+      ]
+    }
+  },
+  methods: {
+    onInput(option) {
+      this.loading = true;
+      this.go(option.url);
+    },
+    go(url) {
+      window.location = url;
+    }
+  }
 });
