diff --git a/assets/images/layouts/apollo-vue.jpg b/assets/images/layouts/apollo-vue.jpg
index 21df606f0..06ac3471f 100644
Binary files a/assets/images/layouts/apollo-vue.jpg and b/assets/images/layouts/apollo-vue.jpg differ
diff --git a/assets/images/layouts/themeswitcher-apollo.png b/assets/images/layouts/themeswitcher-apollo.png
deleted file mode 100644
index 018772aab..000000000
Binary files a/assets/images/layouts/themeswitcher-apollo.png and /dev/null differ
diff --git a/assets/images/layouts/themeswitcher-apollo.svg b/assets/images/layouts/themeswitcher-apollo.svg
new file mode 100644
index 000000000..fe5a2eee9
--- /dev/null
+++ b/assets/images/layouts/themeswitcher-apollo.svg
@@ -0,0 +1,5 @@
+<svg width="21" height="22" viewBox="0 0 21 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M10.4851 0L0 20.9465H3.53702L10.4856 6.07843L17.2944 20.9465H20.9715L10.4851 0Z" fill="#6366F1"/>
+    <path d="M13.8399 15.793L16.2076 21.0019H11.7681L13.8399 15.793Z" fill="#6366F1"/>
+    <path d="M9.04637 21.0019L6.67867 15.793L4.60693 21.0019H9.04637Z" fill="#6366F1"/>
+</svg>   
\ No newline at end of file
diff --git a/layouts/AppConfigurator.vue b/layouts/AppConfigurator.vue
index 2edd8dba3..2bc6c4f1c 100755
--- a/layouts/AppConfigurator.vue
+++ b/layouts/AppConfigurator.vue
@@ -306,6 +306,11 @@
                                 <img alt="Ultima" src="@/assets/images/layouts/sakai-vue.jpg" />
                             </a>
                         </div>
+                        <div class="col-12 md:col-6">
+                            <a href="https://www.primefaces.org/layouts/apollo-vue">
+                                <img alt="Apollo" src="@/assets/images/layouts/apollo-vue.jpg" />
+                            </a>
+                        </div>
                         <div class="col-12 md:col-6">
                             <a href="https://www.primefaces.org/layouts/atlantis-vue">
                                 <img alt="Atlantis" src="@/assets/images/layouts/atlantis-vue.jpg" />
@@ -356,11 +361,6 @@
                                 <img alt="Avalon" src="@/assets/images/layouts/avalon-vue.jpg" />
                             </a>
                         </div>
-                        <div class="col-12 md:col-6">
-                            <a href="https://www.primefaces.org/layouts/apollo-vue">
-                                <img alt="Apollo" src="@/assets/images/layouts/apollo-vue.jpg" />
-                            </a>
-                        </div>
                         <div class="col-12 md:col-6">
                             <a href="https://www.primefaces.org/layouts/roma-vue">
                                 <img alt="Roma" src="@/assets/images/layouts/roma-vue.jpg" />
diff --git a/layouts/AppTopBar.vue b/layouts/AppTopBar.vue
index 95faf8728..9a0979f48 100755
--- a/layouts/AppTopBar.vue
+++ b/layouts/AppTopBar.vue
@@ -177,6 +177,9 @@
                             <a href="https://www.primefaces.org/sakai-vue"><img src="@/assets/images/layouts/themeswitcher-sakai.svg" alt="Sakai" /><span>Sakai</span></a>
                         </li>
                         <li class="topbar-submenu-header">PREMIUM ADMIN TEMPLATES</li>
+                        <li>
+                            <a href="https://www.primefaces.org/layouts/apollo-vue"><img src="@/assets/images/layouts/themeswitcher-apollo.svg" alt="Apollo" /><span>Apollo</span></a>
+                        </li>
                         <li>
                             <a href="https://www.primefaces.org/layouts/atlantis-vue"><img src="@/assets/images/layouts/themeswitcher-atlantis.svg" alt="Atlantis" /><span>Atlantis</span></a>
                         </li>
@@ -207,9 +210,6 @@
                         <li>
                             <a href="https://www.primefaces.org/layouts/babylon-vue"><img src="@/assets/images/layouts/themeswitcher-babylon.png" alt="Babylon" /><span>Babylon</span></a>
                         </li>
-                        <li>
-                            <a href="https://www.primefaces.org/layouts/apollo-vue"><img src="@/assets/images/layouts/themeswitcher-apollo.png" alt="Apollo" /><span>Apollo</span><span class="theme-badge darkmode">dark mode</span></a>
-                        </li>
                         <li>
                             <a href="https://www.primefaces.org/layouts/roma-vue"><img src="@/assets/images/layouts/themeswitcher-roma.jpg" alt="Roma" /><span>Roma</span></a>
                         </li>