diff --git a/doc/button/ButtonSetDoc.vue b/doc/button/ButtonSetDoc.vue
index 18b19e949..3d7bbe2be 100644
--- a/doc/button/ButtonSetDoc.vue
+++ b/doc/button/ButtonSetDoc.vue
@@ -1,13 +1,13 @@
 <template>
     <DocSectionText v-bind="$attrs">
-        <p>Multiple buttons are grouped when wrapped inside an element with <i>p-buttonset</i> class.</p>
+        <p>Multiple buttons are grouped when wrapped inside an element with <i>ButtonSet</i> component.</p>
     </DocSectionText>
     <div class="card flex justify-content-center">
-        <span class="p-buttonset">
+        <ButtonSet>
             <Button label="Save" icon="pi pi-check" />
             <Button label="Delete" icon="pi pi-trash" />
             <Button label="Cancel" icon="pi pi-times" />
-        </span>
+        </ButtonSet>
     </div>
     <DocSectionCode :code="code" />
 </template>
@@ -18,20 +18,20 @@ export default {
         return {
             code: {
                 basic: `
-<span class="p-buttonset">
+<ButtonSet>
     <Button label="Save" icon="pi pi-check" />
     <Button label="Delete" icon="pi pi-trash" />
     <Button label="Cancel" icon="pi pi-times" />
-</span>
+</ButtonSet>
 `,
                 options: `
 <template>
     <div class="card flex justify-content-center">
-        <span class="p-buttonset">
+        <ButtonSet>
             <Button label="Save" icon="pi pi-check" />
             <Button label="Delete" icon="pi pi-trash" />
             <Button label="Cancel" icon="pi pi-times" />
-        </span>
+        </ButtonSet>
     </div>
 </template>
 
@@ -41,11 +41,11 @@ export default {
                 composition: `
 <template>
     <div class="card flex justify-content-center">
-        <span class="p-buttonset">
+        <ButtonSet>
             <Button label="Save" icon="pi pi-check" />
             <Button label="Delete" icon="pi pi-trash" />
             <Button label="Cancel" icon="pi pi-times" />
-        </span>
+        </ButtonSet>
     </div>
 </template>
 
diff --git a/modules/nuxt-primevue/runtime/core/components/index.js b/modules/nuxt-primevue/runtime/core/components/index.js
index f451336f0..b34b0964b 100644
--- a/modules/nuxt-primevue/runtime/core/components/index.js
+++ b/modules/nuxt-primevue/runtime/core/components/index.js
@@ -30,7 +30,7 @@ const form = [
     'TriStateCheckbox'
 ];
 
-const button = ['Button', 'SpeedDial', 'SplitButton'];
+const button = ['Button', 'ButtonSet', 'SpeedDial', 'SplitButton'];
 
 const data = ['Column', 'Row', 'ColumnGroup', 'DataTable', 'DataView', 'DataViewLayoutOptions', 'OrderList', 'OrganizationChart', 'Paginator', 'PickList', 'Tree', 'TreeTable', 'Timeline', 'VirtualScroller'];
 
diff --git a/pages/button/index.vue b/pages/button/index.vue
index bfb9d3b88..7b331b076 100755
--- a/pages/button/index.vue
+++ b/pages/button/index.vue
@@ -4,7 +4,7 @@
         header="Button"
         description="Button is an extension to standard input element with icons and theming."
         :componentDocs="docs"
-        :apiDocs="['Button']"
+        :apiDocs="['Button', 'ButtonSet']"
         :ptTabComponent="ptComponent"
         :themingDocs="themingDoc"
     />