diff --git a/src/app/pages/tabs-page/tabs-page.html b/src/app/pages/tabs-page/tabs-page.html
index fd661cd0..0bdb7b67 100644
--- a/src/app/pages/tabs-page/tabs-page.html
+++ b/src/app/pages/tabs-page/tabs-page.html
@@ -5,37 +5,37 @@
   </ion-tab-bar>
 
   <ion-tab-bar slot="bottom" class="pycon-tab-bar">
-    <ion-tab-button tab="speakers">
+    <ion-tab-button tab="speakers" [class.pycon-active]="activeTab === 'speakers'">
       <ion-icon name="people"></ion-icon>
       <ion-label>Speakers</ion-label>
     </ion-tab-button>
 
-    <ion-tab-button tab="conference-map">
+    <ion-tab-button tab="conference-map" [class.pycon-active]="activeTab === 'conference-map'">
       <ion-icon name="map"></ion-icon>
       <ion-label>Map</ion-label>
     </ion-tab-button>
 
-    <ion-tab-button tab="schedule">
+    <ion-tab-button tab="schedule" [class.pycon-active]="activeTab === 'schedule'">
       <ion-icon name="calendar"></ion-icon>
       <ion-label>Schedule</ion-label>
     </ion-tab-button>
 
-    <ion-tab-button tab="now">
+    <ion-tab-button tab="now" [class.pycon-active]="activeTab === 'now'">
       <ion-icon name="radio"></ion-icon>
       <ion-label>Now</ion-label>
     </ion-tab-button>
 
-    <ion-tab-button *ngIf="hasDoorCheck" (click)="openStaffTools($event)">
+    <ion-tab-button *ngIf="hasDoorCheck" (click)="openStaffTools($event)" [class.pycon-active]="activeTab === 'lead-retrieval'">
       <ion-icon name="scan"></ion-icon>
       <ion-label>Scanner</ion-label>
     </ion-tab-button>
 
-    <ion-tab-button *ngIf="hasLeadRetrieval && !hasDoorCheck" tab="lead-retrieval">
+    <ion-tab-button *ngIf="hasLeadRetrieval && !hasDoorCheck" tab="lead-retrieval" [class.pycon-active]="activeTab === 'lead-retrieval'">
       <ion-icon name="qr-code"></ion-icon>
       <ion-label>Scanner</ion-label>
     </ion-tab-button>
 
-    <ion-tab-button *ngIf="!loggedIn" tab="login">
+    <ion-tab-button *ngIf="!loggedIn" tab="login" [class.pycon-active]="activeTab === 'login'">
       <ion-icon name="log-in"></ion-icon>
       <ion-label>Login</ion-label>
     </ion-tab-button>
diff --git a/src/app/pages/tabs-page/tabs-page.scss b/src/app/pages/tabs-page/tabs-page.scss
index 00b43a01..a4d09af6 100644
--- a/src/app/pages/tabs-page/tabs-page.scss
+++ b/src/app/pages/tabs-page/tabs-page.scss
@@ -1,3 +1,11 @@
+.pycon-tab-bar ion-tab-button.pycon-active {
+  --color: #DD04D2;
+
+  ion-label {
+    font-weight: 700;
+  }
+}
+
 .bannerSponsorHidden {
   display: none;
 }
diff --git a/src/app/pages/tabs-page/tabs-page.ts b/src/app/pages/tabs-page/tabs-page.ts
index 735835b3..30f61903 100644
--- a/src/app/pages/tabs-page/tabs-page.ts
+++ b/src/app/pages/tabs-page/tabs-page.ts
@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { ModalController } from '@ionic/angular';
-import { Router } from '@angular/router';
+import { NavigationEnd, Router } from '@angular/router';
+import { filter } from 'rxjs/operators';
 
 import { ConferenceData } from '../../providers/conference-data';
 import { UserData } from '../../providers/user-data';
@@ -16,6 +17,7 @@ export class TabsPage implements OnInit {
   hasDoorCheck: boolean = false;
   loggedIn: boolean = false;
   showStaffTools: boolean = false;
+  activeTab: string = '';
 
   constructor(
     private userData: UserData,
@@ -31,6 +33,18 @@ export class TabsPage implements OnInit {
     this.checkLoggedIn();
     this.listenForLoginEvents();
     setInterval(this.showSponsorBanner, 30000);
+
+    this.activeTab = this.computeActiveTab(this.router.url);
+    this.router.events
+      .pipe(filter((e): e is NavigationEnd => e instanceof NavigationEnd))
+      .subscribe(e => {
+        this.activeTab = this.computeActiveTab(e.urlAfterRedirects);
+      });
+  }
+
+  private computeActiveTab(url: string): string {
+    const match = url.match(/\/app\/tabs\/([^/?#]+)/);
+    return match ? match[1] : '';
   }
 
   checkLoggedIn() {