diff --git a/src/assets/styles/app.scss b/src/assets/styles/app.scss
index ac576cca8..11ba895b9 100644
--- a/src/assets/styles/app.scss
+++ b/src/assets/styles/app.scss
@@ -1220,6 +1220,22 @@ a {
     }
 }
 
+    /* DESIGNER */
+    .primevue-designer {
+        background-color: #ffffff;
+        padding: 30px;
+        h3 {
+            margin: 10px 0 20px 0;
+            display: block;
+            text-align: center;
+            font-size: 24px;
+        }
+        img {
+            width: 100%;
+            margin-bottom: 30px;
+        }
+    }
+
 .icons-page {
     .icons-list {
         text-align: center;
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 3276acb2e..e16b2df18 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -170,6 +170,18 @@
                 </div>
             </div>
         </div>
+        <div class="primevue-designer">
+            <h3>PrimeVue Designer API</h3>
+            <div class="p-grid">
+                <div className="p-col-12">
+                    <img alt="PrimeReact Designer" src="../assets/images/primevue-designer.jpg" />
+                    <p><a href="https://www.primefaces.org/designer/primevue">Designer API</a> is a SASS based theme engine to create PrimeVue themes easily featuring over 500 variables,
+                        a demo application and a base sample theme. Whether you have your own style guide or just need a custom theme, Designer API is the right tool to design and bring them to existence.</p>
+
+                    <p>Visit <a href="https://www.primefaces.org/designer/primevue">Designer API HomePage</a> for more information, live demos and access to a trial version.</p>
+                </div>
+            </div>
+        </div>
         <div class="prosupport">
             <div class="p-grid">
                 <div class="p-col-12 p-md-6">