diff --git a/ionic/components.ios.scss b/ionic/components.ios.scss
index d3cee062eb..037a0ab7da 100644
--- a/ionic/components.ios.scss
+++ b/ionic/components.ios.scss
@@ -7,6 +7,7 @@
 @import
   "components/app/modes/ios",
   "components/action-sheet/modes/ios",
+  "components/badge/modes/ios",
   "components/button/modes/ios",
   "components/card/modes/ios",
   "components/checkbox/modes/ios",
diff --git a/ionic/components.md.scss b/ionic/components.md.scss
index 55ed41bb6f..bd97ece4c2 100644
--- a/ionic/components.md.scss
+++ b/ionic/components.md.scss
@@ -7,6 +7,7 @@
 @import
   "components/app/modes/md",
   "components/action-sheet/modes/md",
+  "components/badge/modes/md",
   "components/button/modes/md",
   "components/card/modes/md",
   "components/checkbox/modes/md",
diff --git a/ionic/components/badge/badge.scss b/ionic/components/badge/badge.scss
index 091160ec4d..24da8e84f2 100644
--- a/ionic/components/badge/badge.scss
+++ b/ionic/components/badge/badge.scss
@@ -5,7 +5,6 @@
 
 $badge-font-size:                 1.3rem !default;
 $badge-font-weight:               bold !default;
-$badge-border-radius:             10px !default;
 
 
 ion-badge {
@@ -13,7 +12,6 @@ ion-badge {
 
   padding: 3px 8px;
   min-width: 10px;
-  border-radius: $badge-border-radius;
 
   vertical-align: baseline;
   text-align: center;
diff --git a/ionic/components/badge/modes/ios.scss b/ionic/components/badge/modes/ios.scss
new file mode 100644
index 0000000000..a369cb4015
--- /dev/null
+++ b/ionic/components/badge/modes/ios.scss
@@ -0,0 +1,11 @@
+@import "../badge";
+
+// iOS Badge
+// --------------------------------------------------
+
+$badge-ios-border-radius:             10px !default;
+
+
+ion-badge {
+  border-radius: $badge-ios-border-radius;
+}
diff --git a/ionic/components/badge/modes/md.scss b/ionic/components/badge/modes/md.scss
new file mode 100644
index 0000000000..4156b406f2
--- /dev/null
+++ b/ionic/components/badge/modes/md.scss
@@ -0,0 +1,11 @@
+@import "../badge";
+
+// Material Design Badge
+// --------------------------------------------------
+
+$badge-md-border-radius:             4px !default;
+
+
+ion-badge {
+  border-radius: $badge-md-border-radius;
+}
diff --git a/ionic/components/badge/test/basic/main.html b/ionic/components/badge/test/basic/main.html
index 80548bc1a2..3a2f0cf16a 100644
--- a/ionic/components/badge/test/basic/main.html
+++ b/ionic/components/badge/test/basic/main.html
@@ -13,23 +13,23 @@
     </ion-item>
     <ion-item>
       Primary Badge
-      <ion-badge item-right class="badge-primary">99</ion-badge>
+      <ion-badge item-right primary>99</ion-badge>
     </ion-item>
     <ion-item>
       Secondary Badge
-      <ion-badge item-right class="badge-secondary">99</ion-badge>
+      <ion-badge item-right secondary>99</ion-badge>
     </ion-item>
     <ion-item>
       Danger Badge
-      <ion-badge item-right class="badge-danger">99</ion-badge>
+      <ion-badge item-right danger>99</ion-badge>
     </ion-item>
     <ion-item>
       Light Badge
-      <ion-badge item-right class="badge-light">99</ion-badge>
+      <ion-badge item-right light>99</ion-badge>
     </ion-item>
     <ion-item>
       Dark Badge
-      <ion-badge item-right class="badge-dark">99</ion-badge>
+      <ion-badge item-right dark>99</ion-badge>
     </ion-item>
   </ion-list>
   <ion-list>
@@ -42,23 +42,23 @@
     </ion-item>
     <ion-item>
       Primary Badge
-      <ion-badge item-left class="badge-primary">99</ion-badge>
+      <ion-badge item-left primary>99</ion-badge>
     </ion-item>
     <ion-item>
       Secondary Badge
-      <ion-badge item-left class="badge-secondary">99</ion-badge>
+      <ion-badge item-left secondary>99</ion-badge>
     </ion-item>
     <ion-item>
       Danger Badge
-      <ion-badge item-left class="badge-danger">99</ion-badge>
+      <ion-badge item-left danger>99</ion-badge>
     </ion-item>
     <ion-item>
       Light Badge
-      <ion-badge item-left class="badge-light">99</ion-badge>
+      <ion-badge item-left light>99</ion-badge>
     </ion-item>
     <ion-item>
       Dark Badge
-      <ion-badge item-left class="badge-dark">99</ion-badge>
+      <ion-badge item-left dark>99</ion-badge>
     </ion-item>
   </ion-list>
 </ion-content>