diff --git a/ionic/components/app/test/sink/pages/tabs.ts b/ionic/components/app/test/sink/pages/tabs.ts
index 719b379d67..b3a24badb7 100644
--- a/ionic/components/app/test/sink/pages/tabs.ts
+++ b/ionic/components/app/test/sink/pages/tabs.ts
@@ -1,34 +1,55 @@
 import {Component, Directive, View} from 'angular2/angular2';
 import {FormBuilder, Validators, formDirectives, ControlGroup} from 'angular2/forms';
 
-import {IonicApp, Tabs, Tab, NavbarTemplate, Navbar, NavController, Content} from 'ionic/ionic';
+import {IonicApp, IonicView, Tabs, Tab, NavbarTemplate, Navbar, NavController, Content} from 'ionic/ionic';
 
 import {SinkPage} from '../sink-page';
 
+@Component({selector: 'ion-view'})
+@IonicView({
+  template: '' +
+    '<ion-navbar *navbar>' +
+      '<ion-title>Featured</ion-title>' +
+    '</ion-navbar>' +
+    '<ion-content class="padding">' +
+    '</ion-content>'
+})
+class FeaturedTabPage {
+  constructor(nav: NavController) {
+    this.nav = nav;
+  }
+}
+@Component({selector: 'ion-view'})
+@IonicView({
+  template: '' +
+    '<ion-navbar *navbar>' +
+      '<ion-title>Top</ion-title>' +
+    '</ion-navbar>' +
+    '<ion-content class="padding">' +
+    '</ion-content>'
+})
+class TopTabPage {
+  constructor(nav: NavController) {
+    this.nav = nav;
+  }
+}
+
 @Component({
   selector: 'ion-view'
 })
 @View({
   template: `
     <ion-navbar *navbar><ion-nav-items primary><button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button></ion-nav-items><ion-title>Tabs</ion-title></ion-navbar>
-    <ion-tabs>
-
-      <ion-tab tab-title="Tab 1" tab-icon="ion-home">
-
-        <ion-content class="padding">
-          Tab 1 Content
-        </ion-content>
 
+    <ion-tabs id="tabs">
+      <ion-tab tab-title="Featured" tab-icon="ion-ios-star" [root]="featuredTab"></ion-tab>
+      <ion-tab tab-title="Top Charts" tab-icon="ion-ios-list-outline" [root]="topTab"></ion-tab>
+      <ion-tab tab-title="Search" tab-icon="ion-ios-search">
+        <ion-navbar *navbar><ion-nav-items primary><button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button></ion-nav-items><ion-title>Search</ion-title></ion-navbar>
       </ion-tab>
-
-      <ion-tab tab-title="Tab 2" tab-icon="ion-star">
-
-        <ion-content class="padding">
-          Tab 2 Content
-        </ion-content>
-
+      <ion-tab tab-title="Updates" tab-icon="ion-ios-download-outline">
+        <ion-navbar *navbar><ion-nav-items primary><button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button></ion-nav-items><ion-title>Updates</ion-title></ion-navbar>
       </ion-tab>
-
     </ion-tabs>
   `,
   directives: [NavbarTemplate, Navbar, Content, Tabs, Tab]
@@ -36,5 +57,7 @@ import {SinkPage} from '../sink-page';
 export class TabsPage extends SinkPage {
   constructor(app: IonicApp) {
     super(app);
+    this.featuredTab = FeaturedTabPage;
+    this.topTab = TopTabPage;
   }
 }
diff --git a/ionic/components/tabs/tabs.scss b/ionic/components/tabs/tabs.scss
index fbb5a34da8..6bc10aaac6 100644
--- a/ionic/components/tabs/tabs.scss
+++ b/ionic/components/tabs/tabs.scss
@@ -134,9 +134,10 @@ button.tab-button {
 }
 
 button.tab-button:hover {
-  opacity: 0.6;
+  opacity: 0.8;
 }
 
 button.tab-button[aria-selected="true"] {
-  color: red;
+  // Default color is primary
+  color: get-color(primary, base);
 }