diff --git a/src/runtime/components/ButtonGroup.vue b/src/runtime/components/ButtonGroup.vue
index 0635091f..c4a02381 100644
--- a/src/runtime/components/ButtonGroup.vue
+++ b/src/runtime/components/ButtonGroup.vue
@@ -47,7 +47,7 @@ provide(buttonGroupInjectionKey, computed(() => ({
 </script>
 
 <template>
-  <Primitive :as="as" :class="buttonGroup({ orientation })">
+  <Primitive :as="as" :class="buttonGroup({ orientation, class: props.class })">
     <slot />
   </Primitive>
 </template>
diff --git a/test/components/__snapshots__/ButtonGroup.spec.ts.snap b/test/components/__snapshots__/ButtonGroup.spec.ts.snap
index ff12dd1e..8389fd54 100644
--- a/test/components/__snapshots__/ButtonGroup.spec.ts.snap
+++ b/test/components/__snapshots__/ButtonGroup.spec.ts.snap
@@ -14,7 +14,7 @@ exports[`ButtonGroup > renders orientation vertical with default slot correctly
 
 exports[`ButtonGroup > renders with as correctly 1`] = `"<section class="relative inline-flex -space-x-px"></section>"`;
 
-exports[`ButtonGroup > renders with class correctly 1`] = `"<div class="relative inline-flex -space-x-px"></div>"`;
+exports[`ButtonGroup > renders with class correctly 1`] = `"<div class="inline-flex -space-x-px absolute"></div>"`;
 
 exports[`ButtonGroup > renders with default slot correctly 1`] = `
 "<div class="relative inline-flex -space-x-px">