diff --git a/src/AppTopBar.vue b/src/AppTopBar.vue
index 9c28d84a6..c27f6d339 100644
--- a/src/AppTopBar.vue
+++ b/src/AppTopBar.vue
@@ -16,8 +16,10 @@
                         <li><router-link to="/theming" @click.native="hideThemesMenu()"><i class="pi pi-fw pi-file"/><span>Guide</span></router-link></li>
                         <li><a href="https://www.primefaces.org/designer/primevue"><i class="pi pi-fw pi-cog" /><span>Designer</span></a></li>
                         <li><router-link to="/icons" @click.native="hideThemesMenu()"><i class="pi pi-fw pi-search"/><span>Icons</span></router-link></li>
+                        <li class="topbar-submenu-header">PREMIUM TEMPLATES</li>
+                        <li><a href="https://www.primefaces.org/sapphire-vue"><img src="./assets/images/layouts/themeswitcher-sapphire.png" alt="Sapphire" /><span>Sapphire</span><span class="theme-badge material">material</span></a></li>
                         <li class="topbar-submenu-header">FREE TEMPLATES</li>
-                                                        <li><a href="https://www.primefaces.org/sigma-vue"><img src="./assets/images/layouts/themeswitcher-sigma.png" alt="Sigma" /><span>Sigma</span></a></li>
+                        <li><a href="https://www.primefaces.org/sigma-vue"><img src="./assets/images/layouts/themeswitcher-sigma.png" alt="Sigma" /><span>Sigma</span></a></li>
                         <li class="topbar-submenu-header">FREE THEMES</li>
                         <li><a href="#" @click="changeTheme($event, 'nova-light', false)"><img src="./assets/images/layouts/themeswitcher-nova-light.png" alt="Nova Light" /><span>Nova Light</span></a></li>
                         <li><a @click="changeTheme($event, 'nova-dark', false)"><img src="./assets/images/layouts/themeswitcher-nova-dark.png" alt="Nova Dark" /><span>Nova Dark</span></a></li>
diff --git a/src/assets/images/layouts/sapphire.jpg b/src/assets/images/layouts/sapphire.jpg
new file mode 100644
index 000000000..4163dd8f0
Binary files /dev/null and b/src/assets/images/layouts/sapphire.jpg differ
diff --git a/src/assets/images/layouts/themeswitcher-sapphire.png b/src/assets/images/layouts/themeswitcher-sapphire.png
new file mode 100644
index 000000000..65ba93ea2
Binary files /dev/null and b/src/assets/images/layouts/themeswitcher-sapphire.png differ
diff --git a/src/assets/styles/app.scss b/src/assets/styles/app.scss
index 445919d42..590d2069b 100644
--- a/src/assets/styles/app.scss
+++ b/src/assets/styles/app.scss
@@ -170,7 +170,7 @@ body {
                             font-weight: bold;
                             text-align: left;
                             color: #ffffff;
-                            background-color: #484848;
+                            background-color: #34485e;
                         }
                     }
 
@@ -220,9 +220,9 @@ body {
         }
         
         .theme-badge.material {
-            background: #00b09b;  /* fallback for old browsers */
-            background: -webkit-linear-gradient(to bottom, #202124, #404147);  /* Chrome 10-25, Safari 5.1-6 */
-            background: linear-gradient(to bottom, #202124, #404147); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */  
+            background: #2196F3;  /* fallback for old browsers */
+            background: -webkit-linear-gradient(to bottom, #2196F3, #2196F3);  /* Chrome 10-25, Safari 5.1-6 */
+            background: linear-gradient(to bottom, #2196F3, #2196F3); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */  
         }
         
         .theme-badge.bootstrap {
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 44930cc41..b5b104d31 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -77,6 +77,18 @@
                 <div class="p-col-6 p-md-2"><img alt="viacom" src="../assets/images/home/viacom.svg"/></div>
             </div>
         </div>
+        <div class="templates">
+            <h3>Premium Application Templates</h3>
+            <p>Powered by <a href="https://cli.vuejs.org">Vue-CLI</a>, create awesome applications in no time using the premium templates of PrimeVue and impress your users.</p>
+
+            <div class="p-grid">
+                <div class="p-col">
+                    <a href="https://www.primefaces.org/layouts/sapphire-vue">
+                        <img alt="Sapphire" src="../assets/images/layouts/sapphire.jpg">
+                    </a>
+                </div>
+            </div>
+        </div>
         <div class="templates">
             <h3>Free Application Template for PrimeVue</h3>
             <p>Sigma is a free and open source admin template based on <a href="https://cli.vuejs.org">Vue-CLI</a>.</p>