diff --git a/ionic/components/nav/test/basic/index.ts b/ionic/components/nav/test/basic/index.ts
index 9960b495ac..f72584df97 100644
--- a/ionic/components/nav/test/basic/index.ts
+++ b/ionic/components/nav/test/basic/index.ts
@@ -5,8 +5,8 @@ import {NavParams, NavController} from 'ionic/ionic';
 
 @IonicView({
   template: '' +
-    '<ion-navbar *navbar primary>' +
-      '<ion-title>{{title}}</ion-title>' +
+    '<ion-navbar *navbar>' +
+      '<ion-title><ion-segment><ion-segment-button>Friends</ion-segment-button><ion-segment-button>Enemies</ion-segment-button></ion-segment></ion-title>' +
       '<ion-nav-items primary>' +
         '<button><icon star></icon></button>' +
       '</ion-nav-items>' +
diff --git a/ionic/components/segment/segment.scss b/ionic/components/segment/segment.scss
index 233981fa4c..44b908942d 100644
--- a/ionic/components/segment/segment.scss
+++ b/ionic/components/segment/segment.scss
@@ -2,6 +2,11 @@
 // Segment
 // --------------------------------------------------
 
+$segment-button-bg-color:                 transparent !default;
+$segment-button-bg-color-activated:       color(primary) !default;
+$segment-button-text-color:               inverse($segment-button-bg-color-activated) !default;
+$segment-button-hover-opacity:            0.8 !default;
+
 
 ion-segment {
   display: block;
@@ -34,6 +39,22 @@ ion-segment {
 
     background: none;
 
+    background-color: $segment-button-bg-color;
+    color: $segment-button-text-color;
+
+    &[outline] {
+      border: 1px solid $segment-button-bg-color-activated;
+      background: $segment-button-bg-color;
+      color: $segment-button-bg-color-activated;
+
+      &.activated {
+        opacity: 1;
+        color: $segment-button-text-color;
+        background-color: $segment-button-bg-color-activated;
+      }
+    }
+
+
     &:first-of-type {
       border-radius: $button-border-radius 0px 0px $button-border-radius;
     }
@@ -56,30 +77,22 @@ ion-segment {
 
     ion-segment-button[button] {
       $bg-color: $value;
-      $bg-color-activated: darken-or-lighten($bg-color);
       $text-color: inverse($bg-color);
 
-      background-color: $bg-color;
+      background-color: transparent;
       color: $text-color;
 
-      &.activated {
-        background-color: $bg-color-activated;
-      }
-
       &[outline] {
         border: 1px solid $bg-color;
-        background: $background-color;
+        background: $segment-button-bg-color;
         color: $bg-color;
 
         &.activated {
           opacity: 1;
-          color: $text-color;
-          background-color: $bg-color;
+          color: $text-color !important;
+          background-color: $bg-color !important;
         }
       }
-
     }
-
   }
-
 }
diff --git a/ionic/components/segment/test/basic/main.html b/ionic/components/segment/test/basic/main.html
index e057acc130..13d8f8f474 100644
--- a/ionic/components/segment/test/basic/main.html
+++ b/ionic/components/segment/test/basic/main.html
@@ -11,6 +11,14 @@
           Satellite
         </ion-segment-button>
       </ion-segment>
+      <ion-segment>
+        <ion-segment-button>
+          Friends
+        </ion-segment-button>
+        <ion-segment-button>
+          Enemies
+        </ion-segment-button>
+      </ion-segment>
     <button type="submit" button primary>Submit</button>
   </form>
 
diff --git a/ionic/components/toolbar/modes/ios.scss b/ionic/components/toolbar/modes/ios.scss
index e9175f4f05..e6699d1bd5 100644
--- a/ionic/components/toolbar/modes/ios.scss
+++ b/ionic/components/toolbar/modes/ios.scss
@@ -28,6 +28,12 @@ $toolbar-ios-title-font-size:               1.7rem !default;
     order: map-get($toolbar-order-ios, menu-toggle-secondary);
   }
 
+  ion-segment-button[button] {
+    line-height: 2.4rem;
+    min-height: 2.4rem;
+    font-size: 1.2rem;
+  }
+
   button,
   [button] {
     margin-top: 0;