diff --git a/packages/vuetify/src/components/VAvatar/VAvatar.sass b/packages/vuetify/src/components/VAvatar/VAvatar.sass
index 54f59eedf4b..18577843323 100644
--- a/packages/vuetify/src/components/VAvatar/VAvatar.sass
+++ b/packages/vuetify/src/components/VAvatar/VAvatar.sass
@@ -26,6 +26,10 @@
     &--rounded
       @include tools.rounded($avatar-rounded-border-radius)
 
+    &--variant-tonal
+      .v-avatar__underlay
+        border-radius: 0
+
     &--start
       margin-inline-end: $avatar-margin-start
 
diff --git a/packages/vuetify/src/components/VAvatar/__tests__/VAvatar.spec.browser.tsx b/packages/vuetify/src/components/VAvatar/__tests__/VAvatar.spec.browser.tsx
new file mode 100644
index 00000000000..8b05254232d
--- /dev/null
+++ b/packages/vuetify/src/components/VAvatar/__tests__/VAvatar.spec.browser.tsx
@@ -0,0 +1,17 @@
+import { VAvatar } from '../VAvatar'
+
+// Utilities
+import { render, screen } from '@test'
+
+describe('VAvatar', () => {
+  // https://github.com/vuetifyjs/vuetify/issues/22868
+  it('does not round the tonal underlay so it stays flush with the border', () => {
+    render(() => (
+      <VAvatar variant="tonal" border rounded />
+    ))
+
+    const underlay = screen.getByCSS('.v-avatar__underlay')
+
+    expect(getComputedStyle(underlay).borderRadius).toBe('0px')
+  })
+})