diff --git a/src/runtime/components/elements/AvatarGroup.ts b/src/runtime/components/elements/AvatarGroup.ts
index fab2a558ef..6fc4bf0204 100644
--- a/src/runtime/components/elements/AvatarGroup.ts
+++ b/src/runtime/components/elements/AvatarGroup.ts
@@ -46,11 +46,13 @@ export default defineComponent({
           vProps.size = props.size
         }
 
-        vProps.class = node.props.class || ''
-        vProps.class += ` ${classNames(
+        vProps.ui = node.props.ui || {}
+        vProps.ui.wrapper = classNames(
+          appConfig.ui.avatar.wrapper,
+          vProps.ui.wrapper || '',
           ui.value.ring,
           ui.value.margin
-        )}`
+        )
 
         return cloneVNode(node, vProps)
       }
@@ -59,10 +61,13 @@ export default defineComponent({
         return h(Avatar, {
           size: props.size,
           text: `+${children.value.length - max.value}`,
-          class: classNames(
-            ui.value.ring,
-            ui.value.margin
-          )
+          ui: {
+            wrapper: classNames(
+              appConfig.ui.avatar.wrapper,
+              ui.value.ring,
+              ui.value.margin
+            )
+          }
         })
       }