fix(avatar): inherit border-radius on fallback to respect className overrides

[wingkwong]

Closes #6193

📝 Description

Fallback element should inherit the parent's border-radius so that custom className border-radius can override it even color and variant are set.

Reproducible Example:

• the 1st avatar is rounded-full and the 3rd one is rounded-lg. These two are correct
• the middle one is with rounded-lg + soft variant but rendered like rounded-full, which is not expected.

<div className="flex items-start gap-4">
  <Avatar className="rounded-full" color="warning" variant="default">
    <Avatar.Fallback>1</Avatar.Fallback>
  </Avatar>

  <Avatar className="rounded-lg" color="warning" variant="soft">
    <Avatar.Fallback>2</Avatar.Fallback>
  </Avatar>

  <Avatar className="rounded-lg">
    <Avatar.Fallback>3</Avatar.Fallback>
  </Avatar>
</div>

⛳️ Current behavior (updates)

🚀 New behavior

💣 Is this a breaking change (Yes/No):

No

📝 Additional Information

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
heroui	Ready	Preview, Comment	Mar 9, 2026 11:04am
heroui-sb	Ready	Preview, Comment	Mar 9, 2026 11:04am

[changeset-bot]

⚠️ No Changeset found

Latest commit: 030b64c

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[pkg-pr-new]

Open in StackBlitz

npm i https://pkg.pr.new/@heroui/react@6300

npm i https://pkg.pr.new/@heroui/styles@6300

commit: 60d2579