diff --git a/src/shop-checkbox.html b/src/shop-checkbox.html
new file mode 100644
index 00000000..b637efdb
--- /dev/null
+++ b/src/shop-checkbox.html
@@ -0,0 +1,84 @@
+<!--
+@license
+Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+
+<link rel="import" href="../bower_components/polymer/polymer.html">
+
+<dom-module id="shop-checkbox">
+  <template>
+    <style>
+
+      shop-checkbox {
+        display: inline-block;
+        width: 14px;
+        height: 14px;
+        position: relative;
+        border: 2px solid var(--app-accent-color);
+        border-radius: 2px;
+      }
+
+      shop-checkbox > input[type=checkbox] {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        margin: 0;
+        opacity: 0;
+      }
+
+      shop-checkbox > shop-md-decorator {
+        pointer-events: none;
+      }
+
+      /* Checked state overlay */
+      shop-checkbox > shop-md-decorator::after {
+        content: '';
+        position: absolute;
+        top: -5px;
+        left: -5px;
+        right: -5px;
+        bottom: -5px;
+        background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23172C50%22%20d%3D%22M19%203H5c-1.11%200-2%20.9-2%202v14c0%201.1.89%202%202%202h14c1.11%200%202-.9%202-2V5c0-1.1-.89-2-2-2zm-9%2014l-5-5%201.41-1.41L10%2014.17l7.59-7.59L19%208l-9%209z%22%2F%3E%3C%2Fsvg%3E');
+        opacity: 0;
+        transition: opacity 0.1s;
+        will-change: opacity;
+      }
+
+      shop-checkbox > input[type=checkbox]:checked + shop-md-decorator::after {
+        opacity: 1;
+      }
+
+      /* Focused state */
+      shop-checkbox > shop-md-decorator::before {
+        content: '';
+        pointer-events: none;
+        position: absolute;
+        top: -13px;
+        left: -13px;
+        width: 40px;
+        height: 40px;
+        background-color: var(--app-accent-color);
+        border-radius: 50%;
+        opacity: 0.2;
+        -webkit-transform: scale3d(0, 0, 0);
+        transform: scale3d(0, 0, 0);
+        transition: -webkit-transform 0.1s;
+        transition: transform 0.1s;
+        will-change: transform;
+      }
+
+      shop-checkbox > input[type=checkbox]:focus + shop-md-decorator::before {
+        -webkit-transform: scale3d(1, 1, 1);
+        transform: scale3d(1, 1, 1);
+      }
+
+    </style>
+  </template>
+</dom-module>
diff --git a/src/shop-checkout.html b/src/shop-checkout.html
index 2ee32ea4..95200374 100644
--- a/src/shop-checkout.html
+++ b/src/shop-checkout.html
@@ -16,7 +16,7 @@
 <link rel="import" href="shop-form-styles.html">
 <link rel="import" href="shop-input.html">
 <link rel="import" href="shop-select.html">
-<link rel="import" href="shop-switch.html">
+<link rel="import" href="shop-checkbox.html">
 
 <!-- resources loaded by lazy-resources.html -->
 <!--
@@ -29,7 +29,7 @@
 <dom-module id="shop-checkout">
 
   <template>
-    <style include="shop-common-styles shop-button shop-form-styles shop-input shop-select shop-switch">
+    <style include="shop-common-styles shop-button shop-form-styles shop-input shop-select shop-checkbox">
 
       .main-frame {
         transition: opacity 0.5s;
@@ -54,12 +54,13 @@
       }
 
       .billing-address-picker {
-        margin: 30px 0;
+        margin: 28px 0;
+        height: 20px;
+        @apply(--layout-horizontal);
       }
 
       .billing-address-picker > label {
-        margin-left: 10px;
-        vertical-align: middle;
+        margin-left: 12px;
       }
 
       .grid {
@@ -224,11 +225,11 @@ <h2 id="shipAddressHeading">Shipping Address</h2>
                 </div>
                 <h2 id="billAddressHeading">Billing Address</h2>
                 <div class="billing-address-picker">
-                  <shop-switch>
+                  <shop-checkbox>
                     <input type="checkbox" id="setBilling" name="setBilling"
                         checked$="[[hasBillingAddress]]" on-change="_toggleBillingAddress">
                     <shop-md-decorator></shop-md-decorator aria-hidden="true">
-                  </shop-switch>
+                  </shop-checkbox>
                   <label for="setBilling">Use different billing address</label>
                 </div>
                 <div hidden$="[[!hasBillingAddress]]">
diff --git a/src/shop-switch.html b/src/shop-switch.html
deleted file mode 100644
index 7139cd25..00000000
--- a/src/shop-switch.html
+++ /dev/null
@@ -1,108 +0,0 @@
-<!--
-@license
-Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
-This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
-The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
-The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
-Code distributed by Google as part of the polymer project is also
-subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--->
-
-<link rel="import" href="../bower_components/polymer/polymer.html">
-
-<dom-module id="shop-switch">
-  <template>
-    <style>
-
-      shop-switch {
-        display: inline-block;
-        isolation: isolate;
-        width: 36px;
-        height: 16px;
-        background-color: #ccc;
-        position: relative;
-        border-radius: 8px;
-        vertical-align: middle;
-        -webkit-transform: translateZ(0);
-        transform: translateZ(0);
-      }
-
-      shop-switch > shop-md-decorator {
-        display: block;
-        position: absolute;
-        top: 0;
-        left: 0;
-        right: 0;
-        bottom: 0;
-        border-radius: 8px;
-        pointer-events: none;
-      }
-
-      shop-switch > shop-md-decorator::after {
-        content: '';
-        display: block;
-        pointer-events: none;
-        position: absolute;
-        top: -3px;
-        left: -3px;
-        width: 22px;
-        height: 22px;
-        background-color: white;
-        border-radius: 50%;
-        box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.6);
-        -webkit-transform: translateZ(0);
-        transform: translateZ(0);
-        transition: -webkit-transform 0.1s ease-out;
-        transition: transform 0.1s ease-out;
-      }
-
-      shop-switch > shop-md-decorator::before {
-        content: '';
-        display: block;
-        pointer-events: none;
-        position: absolute;
-        top: -11px;
-        left: -11px;
-        width: 38px;
-        height: 38px;
-        background-color: var(--app-accent-color);
-        border-radius: 50%;
-        opacity: 0;
-        -webkit-transform: scale3d(0, 0, 0);
-        transform: scale3d(0, 0, 0);
-        transition-properties: -webkit-transform, opacity;
-        transition-properties: transform, opacity;
-        transition-duration: 0.1s;
-        transition-timing-function: ease-out;
-      }
-
-      shop-switch > input[type=checkbox]:focus + shop-md-decorator::before {
-        opacity: 0.3;
-        -webkit-transform: scale3d(1, 1, 1);
-        transform: scale3d(1, 1, 1);
-      }
-
-      shop-switch > input[type=checkbox] {
-        width: 100%;
-        height: 44px;
-        position: absolute;
-        top: -15px;
-        left: -4px;
-        opacity: 0;
-      }
-
-      shop-switch > input[type=checkbox]:checked + shop-md-decorator::after {
-        -webkit-transform: translate3d(22px, 0px, 0px);
-        transform: translate3d(22px, 0px, 0px);
-        background-color: var(--app-accent-color);
-      }
-
-      shop-switch > input[type=checkbox]:checked + shop-md-decorator::before {
-        -webkit-transform: translate3d(22px, 0px, 0px);
-        transform: translate3d(22px, 0px, 0px);
-        background-color: var(--app-accent-color);
-      }
-
-    </style>
-  </template>
-</dom-module>