diff --git a/components/lib/themes/aura/ripple/index.js b/components/lib/themes/aura/ripple/index.js
index f760c8d3d..2e9fa078b 100644
--- a/components/lib/themes/aura/ripple/index.js
+++ b/components/lib/themes/aura/ripple/index.js
@@ -1,10 +1,10 @@
 export default {
     colorScheme: {
         light: {
-            background: 'rgba(0,0,0,0.5)'
+            background: 'rgba(0,0,0,0.1)'
         },
         dark: {
-            background: 'rgba(255,255,255,0.5)'
+            background: 'rgba(255,255,255,0.3)'
         }
     }
 };
diff --git a/components/lib/themes/lara/ripple/index.js b/components/lib/themes/lara/ripple/index.js
index f760c8d3d..2e9fa078b 100644
--- a/components/lib/themes/lara/ripple/index.js
+++ b/components/lib/themes/lara/ripple/index.js
@@ -1,10 +1,10 @@
 export default {
     colorScheme: {
         light: {
-            background: 'rgba(0,0,0,0.5)'
+            background: 'rgba(0,0,0,0.1)'
         },
         dark: {
-            background: 'rgba(255,255,255,0.5)'
+            background: 'rgba(255,255,255,0.3)'
         }
     }
 };
diff --git a/components/lib/themes/nora/ripple/index.js b/components/lib/themes/nora/ripple/index.js
index f760c8d3d..5b2453732 100644
--- a/components/lib/themes/nora/ripple/index.js
+++ b/components/lib/themes/nora/ripple/index.js
@@ -1,10 +1,10 @@
 export default {
     colorScheme: {
         light: {
-            background: 'rgba(0,0,0,0.5)'
+            background: 'rgba(0,0,0,0.1)'
         },
         dark: {
-            background: 'rgba(255,255,255,0.5)'
+            background: 'rgba(255,255,255,0.4)'
         }
     }
 };
diff --git a/plugins/app-state.js b/plugins/app-state.js
index 30cdfbe47..78f65161f 100644
--- a/plugins/app-state.js
+++ b/plugins/app-state.js
@@ -5,7 +5,7 @@ import { reactive } from 'vue';
 const $appState = {
     install: (Vue, options) => {
         Vue.config.globalProperties.$appState = reactive({
-            preset: 'Nora',
+            preset: 'Aura',
             darkTheme: false,
             codeSandbox: false,
             sourceType: 'options-api',
@@ -19,6 +19,7 @@ const $appState = {
 export default defineNuxtPlugin((nuxtApp) => {
     nuxtApp.vueApp.use($appState);
     nuxtApp.vueApp.use(PrimeVue, {
+        
         theme: Noir
     });
 });
diff --git a/themes/app-theme.js b/themes/app-theme.js
index 24609095c..f6b5db0f5 100644
--- a/themes/app-theme.js
+++ b/themes/app-theme.js
@@ -1,7 +1,7 @@
 import { definePreset } from 'primevue/themes';
-import Nora from 'primevue/themes/nora';
+import Aura from 'primevue/themes/aura';
 
-const Noir = definePreset(Nora, {
+const Noir = definePreset(Aura, {
     semantic: {
         primary: {
             50: '{zinc.50}',