diff --git a/static/css/directives/ui/app-public-view.css b/static/css/directives/ui/app-public-view.css
index 39a5456cd..1436e99a6 100644
--- a/static/css/directives/ui/app-public-view.css
+++ b/static/css/directives/ui/app-public-view.css
@@ -72,4 +72,10 @@
 
 .app-public-view-element .co-panel .co-panel-heading i.fa {
     display: none;
+}
+
+.app-public-view-element .co-tab-panel {
+    margin: 0px;
+    box-shadow: none;
+    border: none;
 }
\ No newline at end of file
diff --git a/static/js/directives/ui/app-public-view/app-public-view.component.html b/static/js/directives/ui/app-public-view/app-public-view.component.html
index ea4adaa13..e8da83a03 100644
--- a/static/js/directives/ui/app-public-view/app-public-view.component.html
+++ b/static/js/directives/ui/app-public-view/app-public-view.component.html
@@ -10,85 +10,91 @@
         </div>
 
         <!-- Tabs -->
-        <ul class="co-top-tab-bar">
-          <li class="co-top-tab" ng-class="$ctrl.currentTab == 'description' ? 'active': ''" ng-click="$ctrl.showTab('description')">
-            Description
-          </li>
-          <li class="co-top-tab" ng-class="$ctrl.currentTab == 'channels' ? 'active': ''" ng-click="$ctrl.showTab('channels')">
-            Channels
-          </li>
-          <li class="co-top-tab" ng-class="$ctrl.currentTab == 'releases' ? 'active': ''" ng-click="$ctrl.showTab('releases')">
-            Releases
-          </li>
-          <li class="co-top-tab" ng-class="$ctrl.currentTab == 'settings' ? 'active': ''" ng-click="$ctrl.showTab('settings')"
-              ng-if="$ctrl.repository.can_admin">
-            Settings
-          </li>
-        </ul>
+        <cor-tab-panel>
+          <cor-tabs>
+            <cor-tab tab-title="Description" tab-id="description">
+              <i class="fa fa-info-circle"></i>
+            </cor-tab>
+            <cor-tab tab-title="Channels" tab-id="channels">
+              <i class="fa fa-tags"></i>
+            </cor-tab>
+            <cor-tab tab-title="Releases" tab-id="releases">
+              <i class="fa ci-package"></i>
+            </cor-tab>
+            <cor-tab tab-title="Settings" tab-id="settings"
+                     ng-if="$ctrl.repository.can_admin">
+              <i class="fa fa-gear"></i>
+            </cor-tab>
+          </cor-tabs>
 
-        <div class="tab-content">
-          <div ng-show="$ctrl.currentTab == 'description'">
-            <div class="description markdown-input"
-             content="$ctrl.repository.description"
-             can-write="$ctrl.repository.can_write"
-             content-changed="$ctrl.updateDescription"
-             field-title="'application description'">
-            </div>
-          </div>
+          <cor-tab-content>
+            <!-- Description -->
+            <cor-tab-pane id="description">
+              <div class="description markdown-input"
+               content="$ctrl.repository.description"
+               can-write="$ctrl.repository.can_write"
+               content-changed="$ctrl.updateDescription"
+               field-title="'application description'">
+              </div>
+            </cor-tab-pane>
 
-          <div ng-show="$ctrl.currentTab == 'channels'">
-            <div ng-show="!$ctrl.repository.channels.length && $ctrl.repository.can_write">
-              <h3>No channels found for this application</h3>
-              <br>
-              <p>
-                To push a new channel (from within the Helm package directory and with the <a href="https://coreos.com/apps" ng-safenewtab>Helm registry plugin</a> installed):
-<pre class="command">
-helm registry push --namespace {{ $ctrl.repository.namespace }} --channel {channelName} {{ $ctrl.Config.SERVER_HOSTNAME }}
-</pre>
-              </p>
-            </div>
+            <!-- Channels -->
+            <cor-tab-pane id="channels">
+              <div ng-show="!$ctrl.repository.channels.length && $ctrl.repository.can_write">
+                <h3>No channels found for this application</h3>
+                <br>
+                <p>
+                  To push a new channel (from within the Helm package directory and with the <a href="https://coreos.com/apps" ng-safenewtab>Helm registry plugin</a> installed):
+  <pre class="command">
+  helm registry push --namespace {{ $ctrl.repository.namespace }} --channel {channelName} {{ $ctrl.Config.SERVER_HOSTNAME }}
+  </pre>
+                </p>
+              </div>
 
-            <div ng-show="$ctrl.repository.channels.length || !$ctrl.repository.can_write">
-              <cor-table table-data="$ctrl.repository.channels" table-item-title="channels" filter-fields="['name']">
-                <cor-table-col datafield="name" sortfield="name" title="Name"
-                               templateurl="/static/js/directives/ui/app-public-view/channel-name.html"></cor-table-col>
-                <cor-table-col datafield="release" sortfield="release" title="Current Release"></cor-table-col>
-                <cor-table-col datafield="last_modified" sortfield="last_modified" title="Last Modified"
-                               selected="true" kindof="datetime"
-                               templateurl="/static/js/directives/ui/app-public-view/last-modified.html"></cor-table-col>
-              </cor-table>
-            </div>
-          </div> <!-- /channels -->
+              <div ng-show="$ctrl.repository.channels.length || !$ctrl.repository.can_write">
+                <cor-table table-data="$ctrl.repository.channels" table-item-title="channels" filter-fields="['name']">
+                  <cor-table-col datafield="name" sortfield="name" title="Name"
+                                 templateurl="/static/js/directives/ui/app-public-view/channel-name.html"></cor-table-col>
+                  <cor-table-col datafield="release" sortfield="release" title="Current Release"></cor-table-col>
+                  <cor-table-col datafield="last_modified" sortfield="last_modified" title="Last Modified"
+                                 selected="true" kindof="datetime"
+                                 templateurl="/static/js/directives/ui/app-public-view/last-modified.html"></cor-table-col>
+                </cor-table>
+              </div>
+            </cor-tab-pane>
 
-          <div ng-show="$ctrl.currentTab == 'releases'">
-            <div ng-show="!$ctrl.repository.releases.length && $ctrl.repository.can_write">
-              <h3>No releases found for this application</h3>
-              <br>
-              <p>
-                To push a new release (from within the Helm package directory and with the <a href="https://coreos.com/apps" ng-safenewtab>Helm registry plugin</a> installed):
-<pre class="command">
-helm registry push --namespace {{ $ctrl.repository.namespace }} {{ $ctrl.Config.SERVER_HOSTNAME }}
-</pre>
-              </p>
-            </div>
+            <!-- Releases -->
+            <cor-tab-pane id="releases">
+              <div ng-show="!$ctrl.repository.releases.length && $ctrl.repository.can_write">
+                <h3>No releases found for this application</h3>
+                <br>
+                <p>
+                  To push a new release (from within the Helm package directory and with the <a href="https://coreos.com/apps" ng-safenewtab>Helm registry plugin</a> installed):
+  <pre class="command">
+  helm registry push --namespace {{ $ctrl.repository.namespace }} {{ $ctrl.Config.SERVER_HOSTNAME }}
+  </pre>
+                </p>
+              </div>
 
-            <div ng-show="$ctrl.repository.releases.length || !$ctrl.repository.can_write">
-              <cor-table table-data="$ctrl.repository.releases" table-item-title="releases" filter-fields="['name']">
-                <cor-table-col datafield="name" sortfield="name" title="Name"></cor-table-col>
-                <cor-table-col datafield="last_modified" sortfield="last_modified"
-                               title="Created"
-                               selected="true" kindof="datetime"
-                               templateurl="/static/js/directives/ui/app-public-view/last-modified.html"></cor-table-col>
-                <cor-table-col datafield="channels" title="Channels"
-                               templateurl="/static/js/directives/ui/app-public-view/channels-list.html"></cor-table-col>
-              </cor-table>
-            </div>
-          </div> <!-- /releases -->
+              <div ng-show="$ctrl.repository.releases.length || !$ctrl.repository.can_write">
+                <cor-table table-data="$ctrl.repository.releases" table-item-title="releases" filter-fields="['name']">
+                  <cor-table-col datafield="name" sortfield="name" title="Name"></cor-table-col>
+                  <cor-table-col datafield="last_modified" sortfield="last_modified"
+                                 title="Created"
+                                 selected="true" kindof="datetime"
+                                 templateurl="/static/js/directives/ui/app-public-view/last-modified.html"></cor-table-col>
+                  <cor-table-col datafield="channels" title="Channels"
+                                 templateurl="/static/js/directives/ui/app-public-view/channels-list.html"></cor-table-col>
+                </cor-table>
+              </div>
+            </cor-tab-pane>
 
-          <div ng-show="$ctrl.currentTab == 'settings'" ng-if="$ctrl.repository.can_admin">
-            <div class="repo-panel-settings" repository="$ctrl.repository" is-enabled="$ctrl.settingsShown"></div>
-          </div>
-        </div>
+            <!-- Settings -->
+            <cor-tab-pane id="settings" ng-if="$ctrl.repository.can_admin">
+              <div class="repo-panel-settings" repository="$ctrl.repository" is-enabled="$ctrl.settingsShown"></div>
+            </cor-tab-pane>
+          </cor-tab-content>
+        </cor-tab-panel>
       </div>
 
       <!-- Side bar -->
diff --git a/static/js/directives/ui/app-public-view/app-public-view.component.ts b/static/js/directives/ui/app-public-view/app-public-view.component.ts
index 0d90c188f..6b1f75258 100644
--- a/static/js/directives/ui/app-public-view/app-public-view.component.ts
+++ b/static/js/directives/ui/app-public-view/app-public-view.component.ts
@@ -10,7 +10,6 @@ import { Input, Component, Inject } from 'ng-metadata/core';
 })
 export class AppPublicViewComponent {
   @Input('<') public repository: any;
-  private currentTab: string = 'description';
   private settingsShown: number = 0;
 
   constructor(@Inject('Config') private Config: any) {
@@ -22,10 +21,7 @@ export class AppPublicViewComponent {
     this.repository.put();
   }
 
-  public showTab(tab: string): void {
-    this.currentTab = tab;
-    if (tab == 'settings') {
-      this.settingsShown++;
-    }
+  public showSettings(): void {
+    this.settingsShown++;
   }
 }