diff --git a/layouts/AppConfigurator.vue b/layouts/AppConfigurator.vue
index 6736d64a4..407d1c5a3 100755
--- a/layouts/AppConfigurator.vue
+++ b/layouts/AppConfigurator.vue
@@ -428,7 +428,7 @@ export default {
             this.$primevue.config.inputStyle = value;
         },
         onRippleChange(value) {
-            this.$primevue.config.ripple = value;
+            this.$appState.ripple = value;
         },
         onDarkModeChange() {
             this.$emit('darkswitch-click');
@@ -474,7 +474,7 @@ export default {
             return this.$appState.darkTheme;
         },
         rippleActive() {
-            return this.$primevue.config.ripple;
+            return this.$appState.ripple;
         },
         containerClass() {
             return [
diff --git a/layouts/default.vue b/layouts/default.vue
index 26670a043..29719346b 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -109,7 +109,7 @@ export default {
                 {
                     'layout-news-active': this.$appState.newsActive,
                     'p-input-filled': this.$primevue.config.inputStyle === 'filled',
-                    'p-ripple-disabled': this.$primevue.config.ripple === false,
+                    'p-ripple-disabled': this.$appState.ripple === false,
                     'layout-dark': this.$appState.darkTheme,
                     'layout-light': !this.$appState.darkTheme
                 }
diff --git a/plugins/app-state.js b/plugins/app-state.js
index 2dd2fea33..9bc2c53c5 100644
--- a/plugins/app-state.js
+++ b/plugins/app-state.js
@@ -7,6 +7,7 @@ const $appState = {
             sourceType: 'options-api',
             newsActive: false,
             announcement: null,
+            ripple: false,
             storageKey: 'primevue',
             colorSchemeKey: 'primevue-color-scheme'
         });