diff --git a/_includes/header.html b/_includes/header.html
index f00b392..a9bd316 100644
--- a/_includes/header.html
+++ b/_includes/header.html
@@ -8,7 +8,7 @@
 <meta name="apple-mobile-web-app-status-bar-style" content="black">
 
 <link rel="stylesheet" href="{{ page.base_url }}dist/ratchet.css">
-<!-- <link rel="stylesheet" href="{{ page.base_url }}dist/ios-theme.css"> -->
+<link rel="stylesheet" href="{{ page.base_url }}dist/ios-theme.css">
 <link rel="stylesheet" href="{{ page.base_url }}docs-assets/css/docs.css">
 <link rel="stylesheet" href="{{ page.base_url }}docs-assets/css/pygments.css">
 
diff --git a/components.html b/components.html
index 8208b91..9d5d0d9 100644
--- a/components.html
+++ b/components.html
@@ -552,22 +552,22 @@ base_url: "../"
     <h3 class="component-title">Buttons with badges</h3>
 
     <div class="component-example">
-      <a class="button">Badge button <span class="badge badge-filled">1</span></a>
-      <a class="button-primary">Badge button <span class="badge-primary badge-filled">1</span></a>
-      <a class="button-positive">Badge button <span class="badge-positive badge-filled">1</span></a>
-      <a class="button-negative">Badge button <span class="badge-negative badge-filled">1</span></a>
+      <a class="button">Badge button <span class="badge">1</span></a>
+      <a class="button-primary">Badge button <span class="badge-primary">1</span></a>
+      <a class="button-positive">Badge button <span class="badge-positive">1</span></a>
+      <a class="button-negative">Badge button <span class="badge-negative">1</span></a>
     </div>
 
 {% highlight html %}
-<a class="button">Badge button <span class="badge badge-filled">1</span></a>
-<a class="button-primary">Badge button <span class="badge-primary badge-filled">1</span></a>
-<a class="button-positive">Badge button <span class="badge-positive badge-filled">1</span></a>
-<a class="button-negative">Badge button <span class="badge-negative badge-filled">1</span></a>
-
-<a class="button-filled">Badge button <span class="badge badge-filled">1</span></a>
-<a class="button-filled button-primary">Badge button <span class="badge-primary badge-filled">1</span></a>
-<a class="button-filled button-positive">Badge button <span class="badge-positive badge-filled">1</span></a>
-<a class="button-filled button-negative">Badge button <span class="badge-negative badge-filled">1</span></a>
+<a class="button">Badge button <span class="badge">1</span></a>
+<a class="button-primary">Badge button <span class="badge-primary">1</span></a>
+<a class="button-positive">Badge button <span class="badge-positive">1</span></a>
+<a class="button-negative">Badge button <span class="badge-negative">1</span></a>
+
+<a class="button-outlined">Badge button <span class="badge badge-inverted">1</span></a>
+<a class="button-outlined button-primary">Badge button <span class="badge-primary badge-inverted">1</span></a>
+<a class="button-outlined button-positive">Badge button <span class="badge-positive badge-inverted">1</span></a>
+<a class="button-outlined button-negative">Badge button <span class="badge-negative badge-inverted">1</span></a>
 {% endhighlight %}
 
   </article>
@@ -581,10 +581,10 @@ base_url: "../"
       <a class="button-positive button-block">Block button</a>
       <a class="button-negative button-block">Block button</a>
 
-      <a class="button-block button-filled">Block button</a>
-      <a class="button-primary button-block button-filled">Block button</a>
-      <a class="button-positive button-block button-filled">Block button</a>
-      <a class="button-negative button-block button-filled">Block button</a>
+      <a class="button-block button-outlined">Block button</a>
+      <a class="button-primary button-block button-outlined">Block button</a>
+      <a class="button-positive button-block button-outlined">Block button</a>
+      <a class="button-negative button-block button-outlined">Block button</a>
     </div>
 
 {% highlight html %}
@@ -593,10 +593,10 @@ base_url: "../"
 <a class="button-positive button-block">Block button</a>
 <a class="button-negative button-block">Block button</a>
 
-<a class="button-block button-filled">Block button</a>
-<a class="button-primary button-block button-filled">Block button</a>
-<a class="button-positive button-block button-filled">Block button</a>
-<a class="button-negative button-block button-filled">Block button</a>
+<a class="button-block button-outlined">Block button</a>
+<a class="button-primary button-block button-outlined">Block button</a>
+<a class="button-positive button-block button-outlined">Block button</a>
+<a class="button-negative button-block button-outlined">Block button</a>
 {% endhighlight %}
 
   </article>
@@ -672,10 +672,10 @@ base_url: "../"
       <span class="badge-primary">2</span>
       <span class="badge-positive">3</span>
       <span class="badge-negative">4</span>
-      <span class="badge badge-filled">1</span>
-      <span class="badge-primary badge-filled">2</span>
-      <span class="badge-positive badge-filled">3</span>
-      <span class="badge-negative badge-filled">4</span>
+      <span class="badge badge-inverted">1</span>
+      <span class="badge-primary badge-inverted">2</span>
+      <span class="badge-positive badge-inverted">3</span>
+      <span class="badge-negative badge-inverted">4</span>
     </div>
 
 {% highlight html %}
@@ -684,10 +684,10 @@ base_url: "../"
 <span class="badge-positive">3</span>
 <span class="badge-negative">4</span>
 
-<span class="badge badge-filled">1</span>
-<span class="badge-primary badge-filled">2</span>
-<span class="badge-positive badge-filled">3</span>
-<span class="badge-negative badge-filled">4</span>
+<span class="badge badge-inverted">1</span>
+<span class="badge-primary badge-inverted">2</span>
+<span class="badge-positive badge-inverted">3</span>
+<span class="badge-negative badge-inverted">4</span>
 {% endhighlight %}
 
   </article>
@@ -701,7 +701,7 @@ base_url: "../"
         <input type="text" placeholder="Full name">
         <input type="search" placeholder="Search">
         <textarea rows="5"></textarea>
-        <a class="button-positive button-block button-filled">Choose existing</a>
+        <a class="button-positive button-block">Choose existing</a>
       </form>
     </div>
 
@@ -710,7 +710,7 @@ base_url: "../"
   <input type="text" placeholder="Full name">
   <input type="search" placeholder="Search">
   <textarea rows="5"></textarea>
-  <a class="button-positive button-block button-filled">Choose existing</a>
+  <a class="button-positive button-block">Choose existing</a>
 </form>
 {% endhighlight %}