diff --git a/src/assets/styles/landing/_designer.scss b/src/assets/styles/landing/_designer.scss
index 97960e77a..f01f75426 100644
--- a/src/assets/styles/landing/_designer.scss
+++ b/src/assets/styles/landing/_designer.scss
@@ -1,8 +1,8 @@
 .landing-designer {
 
     .designer-demo {
-        --dd-primary:#03C4E8;
-        --dd-primary-darker:#029dba;
+        --dd-primary:#4f8ff7;
+        --dd-primary-darker:#3575dd;
         --dd-font: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
 
         .p-component {
diff --git a/src/views/landing/DesignerSection.vue b/src/views/landing/DesignerSection.vue
index 3e12c3fd4..508d0c716 100644
--- a/src/views/landing/DesignerSection.vue
+++ b/src/views/landing/DesignerSection.vue
@@ -12,7 +12,7 @@
                     <div class="p-fluid">
                         <span class="font-semibold block mb-3">Primary</span>
                         <div>
-                            <button type="button" class="border-circle w-2rem h-2rem p-link mr-3" style="background-color:#03C4E8" @click="changeTheme('#03C4E8', '#029dba')"></button>
+                            <button type="button" class="border-circle w-2rem h-2rem p-link mr-3" style="background-color:#4f8ff7" @click="changeTheme('#4f8ff7', '#3575dd')"></button>
                             <button type="button" class="border-circle w-2rem h-2rem p-link mr-3" style="background-color:#03E8BF" @click="changeTheme('#03E8BF', '#02ba99')"></button>
                             <button type="button" class="border-circle w-2rem h-2rem p-link mr-3" style="background-color:#916AFF" @click="changeTheme('#916AFF', '#7455cc')"></button>
                             <button type="button" class="border-circle w-2rem h-2rem p-link" style="background-color:#FFBD80" @click="changeTheme('#FFBD80','#cc9766')"></button>